Add background color for each screen separately

Author: SimonSchubert

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/App.kt

@@ -231,7 +231,10 @@ fun LinuxApp(initialDeeplink: String? = null) {
             )
         },
     ) { innerPadding ->
-        Box(modifier = Modifier.padding(innerPadding)) {
+        Box(
+            modifier = Modifier
+                .padding(innerPadding),
+        ) {
             NavHost(
                 navController = navController,
                 startDestination = initialRoute,

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/ui/screens/basiccategories/BasicCategoriesScreen.kt

@@ -2,6 +2,7 @@
 
 package com.linuxcommandlibrary.app.ui.screens.basiccategories
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.size
@@ -11,6 +12,7 @@ import androidx.compose.foundation.lazy.grid.items
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.Icon
 import androidx.compose.material.ListItem
+import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
@@ -22,6 +24,7 @@ import androidx.compose.ui.unit.dp
 import com.linuxcommandlibrary.app.ui.composables.AppIcon
 import com.linuxcommandlibrary.app.ui.composables.getIconId
 import com.linuxcommandlibrary.app.ui.composables.rememberIconPainter
+import com.linuxcommandlibrary.app.ui.theme.LocalCustomColors
 
 @Composable
 fun BasicCategoriesScreen(
@@ -31,7 +34,9 @@ fun BasicCategoriesScreen(
     val basicCategories by viewModel.basicCategories.collectAsState()
 
     LazyVerticalGrid(
-        modifier = Modifier.fillMaxSize(),
+        modifier = Modifier
+            .background(MaterialTheme.colors.background)
+            .fillMaxSize(),
         columns = GridCells.Adaptive(minSize = 300.dp),
     ) {
         items(

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/ui/screens/basicgroups/BasicGroupsScreen.kt

@@ -2,6 +2,7 @@
 
 package com.linuxcommandlibrary.app.ui.screens.basicgroups
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.size
@@ -10,6 +11,7 @@ import androidx.compose.foundation.lazy.items
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.Icon
 import androidx.compose.material.ListItem
+import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
@@ -24,6 +26,7 @@ import com.linuxcommandlibrary.app.ui.composables.CommandView
 import com.linuxcommandlibrary.app.ui.composables.HighlightedText
 import com.linuxcommandlibrary.app.ui.composables.getIconId
 import com.linuxcommandlibrary.app.ui.composables.rememberIconPainter
+import com.linuxcommandlibrary.app.ui.theme.LocalCustomColors
 import com.linuxcommandlibrary.shared.getCommandList
 import kotlinx.collections.immutable.ImmutableList
 import kotlinx.collections.immutable.ImmutableSet
@@ -38,7 +41,11 @@ fun BasicGroupsScreen(
 ) {
     val uiState by viewModel.uiState.collectAsState()
 
-    LazyColumn(Modifier.fillMaxSize()) {
+    LazyColumn(
+        Modifier
+            .fillMaxSize()
+            .background(MaterialTheme.colors.background),
+    ) {
         items(
             items = uiState.basicGroups,
             key = { it.id },

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/ui/screens/commanddetail/CommandDetailScreen.kt

@@ -2,6 +2,7 @@
 
 package com.linuxcommandlibrary.app.ui.screens.commanddetail
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
@@ -29,6 +30,7 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.linuxcommandlibrary.app.data.CommandSectionInfo
 import com.linuxcommandlibrary.app.ui.composables.TipSectionContent
+import com.linuxcommandlibrary.app.ui.theme.LocalCustomColors
 import com.linuxcommandlibrary.shared.MarkdownParser
 import kotlinx.collections.immutable.ImmutableList
 
@@ -39,7 +41,11 @@ fun CommandDetailScreen(
 ) {
     val uiState by viewModel.state.collectAsState()
 
-    LazyColumn(Modifier.fillMaxSize()) {
+    LazyColumn(
+        Modifier
+            .background(MaterialTheme.colors.background)
+            .fillMaxSize(),
+    ) {
         itemsIndexed(
             items = uiState.sections,
             key = { index, _ -> index },

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/ui/screens/commandlist/CommandListScreen.kt

@@ -2,12 +2,15 @@
 
 package com.linuxcommandlibrary.app.ui.screens.commandlist
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.items
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.Icon
 import androidx.compose.material.ListItem
+import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
@@ -19,6 +22,7 @@ import com.linuxcommandlibrary.app.data.CommandInfo
 import com.linuxcommandlibrary.app.ui.composables.AppIcon
 import com.linuxcommandlibrary.app.ui.composables.HighlightedText
 import com.linuxcommandlibrary.app.ui.composables.rememberIconPainter
+import com.linuxcommandlibrary.app.ui.theme.LocalCustomColors
 
 @Composable
 fun CommandListScreen(
@@ -27,7 +31,11 @@ fun CommandListScreen(
 ) {
     val commands by viewModel.commands.collectAsState()
 
-    LazyColumn {
+    LazyColumn(
+        modifier = Modifier
+            .background(MaterialTheme.colors.background)
+            .fillMaxSize(),
+    ) {
         items(
             items = commands,
             key = { it.id },

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/ui/screens/search/SearchScreen.kt

@@ -18,6 +18,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import com.linuxcommandlibrary.app.ui.screens.commandlist.CommandListItem
+import com.linuxcommandlibrary.app.ui.theme.LocalCustomColors
 
 @Composable
 fun SearchScreen(

composeApp/src/commonMain/kotlin/com/linuxcommandlibrary/app/ui/screens/tips/TipsScreen.kt

@@ -1,12 +1,15 @@
 package com.linuxcommandlibrary.app.ui.screens.tips
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.staggeredgrid.LazyVerticalStaggeredGrid
 import androidx.compose.foundation.lazy.staggeredgrid.StaggeredGridCells
 import androidx.compose.foundation.lazy.staggeredgrid.items
 import androidx.compose.material.Card
+import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
@@ -15,6 +18,7 @@ import androidx.compose.ui.unit.dp
 import com.linuxcommandlibrary.app.data.TipInfo
 import com.linuxcommandlibrary.app.ui.composables.SectionTitle
 import com.linuxcommandlibrary.app.ui.composables.TipSectionContent
+import com.linuxcommandlibrary.app.ui.theme.LocalCustomColors
 
 @Composable
 fun TipsScreen(
@@ -24,6 +28,9 @@ fun TipsScreen(
     val tips by viewModel.tips.collectAsState()
 
     LazyVerticalStaggeredGrid(
+        modifier = Modifier
+            .background(MaterialTheme.colors.background)
+            .fillMaxSize(),
         columns = StaggeredGridCells.Adaptive(minSize = 300.dp),
     ) {
         items(