Content and fixes

composeApp/src/commonMain/kotlin/component/ComposeUtils.kt

@@ -7,12 +7,15 @@ import androidx.compose.ui.platform.LocalWindowInfo
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
 
+@Composable
+fun isLargeScreen(): Boolean = screenWidth() > 600.dp
+
 @OptIn(ExperimentalComposeUiApi::class)
 @Composable
-fun isLargeScreen(): Boolean {
+fun screenWidth(): Dp {
     val density = LocalDensity.current
     val containerSize = LocalWindowInfo.current.containerSize
-    return containerSize.width > with(density) { 600.dp.toPx() }
+    return with(density) { containerSize.width.toDp() }
 }
 
 @Composable

composeApp/src/commonMain/kotlin/ui/screen/course/composable/LessonCard.kt

@@ -12,6 +12,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
+import component.isLargeScreen
 import component.text.SubTitle
 import component.text.Title
 import io.kamel.image.KamelImage
@@ -28,7 +29,9 @@ fun LessonCard(
     onLessonClick: () -> Unit
 ) {
     Card(
-        modifier = modifier.sizeIn(maxWidth = 600.dp),
+        modifier = modifier
+            .sizeIn(maxWidth = 600.dp)
+            .fillMaxWidth(),
         shape = RoundedCornerShape(24.dp),
         elevation = 4.dp,
         border = BorderStroke(
@@ -42,25 +45,25 @@ fun LessonCard(
         onClick = onLessonClick
     ) {
         Row {
-            val height = 132.dp
+            val height = 148.dp
             LessonImage(
                 modifier = Modifier.height(height),
                 imageUrl = lesson.imageUrl
             )
             Column(
-                modifier = Modifier.height(height),
+                modifier = Modifier.height(height)
+                    .padding(
+                        start = if (isLargeScreen()) 24.dp else 20.dp,
+                        end = if (isLargeScreen()) 16.dp else 12.dp
+                    ),
                 verticalArrangement = Arrangement.Center,
             ) {
                 Title(
-                    modifier = Modifier.padding(horizontal = 16.dp),
                     text = lesson.name,
                     fontWeight = FontWeight.Bold
                 )
                 Spacer(Modifier.height(4.dp))
-                SubTitle(
-                    modifier = Modifier.padding(horizontal = 16.dp),
-                    text = lesson.tagline
-                )
+                SubTitle(text = lesson.tagline)
             }
         }
     }
@@ -73,8 +76,8 @@ private fun LessonImage(
 ) {
     KamelImage(
         modifier = modifier
-            .aspectRatio(0.8f),
-        contentScale = ContentScale.FillHeight,
+            .aspectRatio(1f),
+        contentScale = ContentScale.Crop,
         contentAlignment = Alignment.CenterStart,
         resource = asyncPainterResource(imageUrl),
         contentDescription = null

composeApp/src/commonMain/kotlin/ui/screen/home/composable/CourseCard.kt

@@ -14,6 +14,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
+import component.isLargeScreen
 import component.text.SubTitle
 import component.text.Title
 import io.kamel.image.KamelImage
@@ -39,7 +40,8 @@ fun CourseCard(
                 imageUrl = course.imageUrl,
                 onClick = onCourseClick
             )
-            Spacer(Modifier.height(16.dp))
+            val isLargeScreen = isLargeScreen()
+            Spacer(Modifier.height(if (isLargeScreen) 24.dp else 20.dp))
             Title(
                 modifier = Modifier.padding(horizontal = 16.dp),
                 text = course.name,
@@ -50,7 +52,7 @@ fun CourseCard(
                 modifier = Modifier.padding(horizontal = 16.dp),
                 text = course.tagline
             )
-            Spacer(Modifier.height(16.dp))
+            Spacer(Modifier.height(if (isLargeScreen) 32.dp else 24.dp))
         }
     }
 }
@@ -65,8 +67,8 @@ private fun Banner(
         KamelImage(
             modifier = modifier
                 .fillMaxWidth()
-                .height(148.dp),
-            contentScale = ContentScale.FillWidth,
+                .aspectRatio(4f),
+            contentScale = ContentScale.Crop,
             resource = asyncPainterResource(imageUrl),
             contentDescription = null
         )

composeApp/src/commonMain/kotlin/ui/screen/home/composable/HomeContent.kt

@@ -10,10 +10,7 @@ import androidx.compose.foundation.lazy.grid.items
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import component.BackButton
-import component.LearnScaffold
-import component.isLargeScreen
-import component.platformHorizontalPadding
+import component.*
 import ivy.model.CourseId
 import ui.screen.home.HomeItemViewState
 import ui.screen.home.HomeViewEvent
@@ -32,14 +29,20 @@ fun HomeContent(
         ),
         title = "Learn"
     ) { contentPadding ->
-        val columnsCount = if (isLargeScreen()) 3 else 2
+        val columnsCount = when (screenWidth().value) {
+            in 0f..600f -> 1
+            in 600f..1200f -> 2
+            else -> 3
+        }
         val horizontalPadding = platformHorizontalPadding()
         LazyVerticalGrid(
             modifier = Modifier.padding(contentPadding),
             columns = GridCells.Fixed(
                 count = columnsCount
             ),
-            verticalArrangement = Arrangement.spacedBy(12.dp),
+            verticalArrangement = Arrangement.spacedBy(
+                if (isLargeScreen()) 16.dp else 12.dp
+            ),
             horizontalArrangement = Arrangement.spacedBy(
                 if (isLargeScreen()) 24.dp else 12.dp
             ),

server/src/main/kotlin/ivy/learn/data/cms/TopicsContent.kt

@@ -1,5 +1,10 @@
 package ivy.learn.data.cms
 
+import ivy.learn.data.cms.course.android.AndroidArchitecture
+import ivy.learn.data.cms.course.android.ScreenArchitecture
+import ivy.learn.data.cms.course.kotlin.DataModeling
+import ivy.learn.data.cms.course.kotlin.ErrorHandling
+import ivy.learn.data.cms.course.kotlin.KotlinDSLs
 import ivy.learn.data.cms.course.programming.*
 import ivy.learn.data.cms.dsl.TopicsDsl
 
@@ -12,9 +17,12 @@ object TopicsContent : TopicsDsl({
         course(ObjectOrientedProgramming)
     }
     topic("Kotlin") {
-
+        course(DataModeling)
+        course(ErrorHandling)
+        course(KotlinDSLs)
     }
-    topic("Compose") {
-
+    topic("Android") {
+        course(AndroidArchitecture)
+        course(ScreenArchitecture)
     }
 })

server/src/main/kotlin/ivy/learn/data/cms/course/CoursesContent.kt

@@ -1,5 +1,10 @@
 package ivy.learn.data.cms.course
 
+import ivy.learn.data.cms.course.android.AndroidArchitecture
+import ivy.learn.data.cms.course.android.ScreenArchitecture
+import ivy.learn.data.cms.course.kotlin.DataModeling
+import ivy.learn.data.cms.course.kotlin.ErrorHandling
+import ivy.learn.data.cms.course.kotlin.KotlinDSLs
 import ivy.learn.data.cms.course.programming.*
 import ivy.learn.data.cms.dsl.CoursesDsl
 
@@ -9,4 +14,11 @@ object CoursesContent : CoursesDsl({
     course(DataStructures)
     course(FunctionalProgramming)
     course(ObjectOrientedProgramming)
+
+    course(DataModeling)
+    course(ErrorHandling)
+    course(KotlinDSLs)
+
+    course(AndroidArchitecture)
+    course(ScreenArchitecture)
 })

server/src/main/kotlin/ivy/learn/data/cms/course/android/AndroidArchitecture.kt

@@ -0,0 +1,9 @@
+package ivy.learn.data.cms.course.android
+
+import ivy.learn.data.cms.dsl.CourseDsl
+
+object AndroidArchitecture : CourseDsl({
+    name = "Android Architecture"
+    tagline = "Data, Domain, UI and everything in between."
+    imageUrl = "https://i.ibb.co/9c4YGz2/android-architecture.webp"
+})

server/src/main/kotlin/ivy/learn/data/cms/course/android/ScreenArchitecture.kt

@@ -0,0 +1,9 @@
+package ivy.learn.data.cms.course.android
+
+import ivy.learn.data.cms.dsl.CourseDsl
+
+object ScreenArchitecture : CourseDsl({
+    name = "Screen Architecture"
+    tagline = "MVP, MVVM, MVI, Compose-MVI and more."
+    imageUrl = "https://i.ibb.co/hmqPVTQ/android-screen-arch.webp"
+})

server/src/main/kotlin/ivy/learn/data/cms/course/kotlin/DataModeling.kt

@@ -0,0 +1,9 @@
+package ivy.learn.data.cms.course.kotlin
+
+import ivy.learn.data.cms.dsl.CourseDsl
+
+object DataModeling : CourseDsl({
+    name = "Data Modeling"
+    tagline = "Data classes, sealed interfaces and more."
+    imageUrl = "https://i.ibb.co/17D5rP6/kotlin-data-modeling.webp"
+})

server/src/main/kotlin/ivy/learn/data/cms/course/kotlin/ErrorHandling.kt

@@ -0,0 +1,9 @@
+package ivy.learn.data.cms.course.kotlin
+
+import ivy.learn.data.cms.dsl.CourseDsl
+
+object ErrorHandling : CourseDsl({
+    name = "Error Handling"
+    tagline = "Gracefully handle errors in FP-style."
+    imageUrl = "https://i.ibb.co/k9brdsZ/kotlin-error-handling.webp"
+})

server/src/main/kotlin/ivy/learn/data/cms/course/kotlin/KotlinDSLs.kt

@@ -0,0 +1,9 @@
+package ivy.learn.data.cms.course.kotlin
+
+import ivy.learn.data.cms.dsl.CourseDsl
+
+object KotlinDSLs : CourseDsl({
+    name = "Kotlin DSLs"
+    tagline = "Creating Domain Specific Languages (DSLs) in Kotlin."
+    imageUrl = "https://i.ibb.co/TkVMbSf/kotlin-dsl.webp"
+})

server/src/main/kotlin/ivy/learn/data/cms/course/programming/DataStructures.kt

@@ -1,71 +1,70 @@
 package ivy.learn.data.cms.course.programming
 
 import ivy.learn.data.cms.dsl.CourseDsl
-import ivy.learn.data.cms.dsl.CourseImageUrl
-import ivy.learn.data.cms.dsl.LessonImageUrl
+import ivy.learn.data.cms.dsl.LessonImage
 
 object DataStructures : CourseDsl({
     name = "Data Structures"
     tagline = "Lists, Sets, Maps, Stacks, Trees and more."
-    imageUrl = CourseImageUrl
+    imageUrl = "https://i.ibb.co/0BRty6H/ds.webp"
     lesson(
         name = "Arrays",
         tagline = "The simplest data structure.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Lists",
         tagline = "Arrays with superpowers. Dynamic sizing.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Linked Lists",
         tagline = "A different take on lists. Pointers and nodes.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Sets",
         tagline = "Unique elements. No duplicates.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Maps",
         tagline = "Key-Value pairs. Associative arrays.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Stacks",
         tagline = "LIFO: Last In, First Out.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Queues",
         tagline = "FIFO: First In, First Out.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Trees",
         tagline = "Hierarchical data structures.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Graphs",
         tagline = "Networks of nodes and edges.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Heaps",
         tagline = "Priority Queues. Efficiently find the max or min.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Tries",
         tagline = "Prefix Trees. Efficient string search.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
     lesson(
         name = "Hash Tables",
         tagline = "Fast lookups. Key-Value pairs.",
-        imageUrl = LessonImageUrl
+        imageUrl = LessonImage
     )
 })