Add stuff to the theme and use theme.

app/src/main/java/com/pixelized/rplexicon/MainActivity.kt

@@ -6,6 +6,7 @@ import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Scaffold
@@ -63,7 +64,10 @@ class MainActivity : ComponentActivity() {
                             }
                         },
                         snackbarHost = {
-                            SnackbarHost(hostState = LocalSnack.current)
+                            SnackbarHost(
+                                modifier = Modifier.navigationBarsPadding(),
+                                hostState = LocalSnack.current,
+                            )
                         }
                     )
                 }

app/src/main/java/com/pixelized/rplexicon/ui/navigation/HomeNavHost.kt

@@ -1,6 +1,7 @@
 package com.pixelized.rplexicon.ui.navigation
 
 import androidx.compose.animation.ExperimentalAnimationApi
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.material3.BottomAppBar
@@ -9,6 +10,8 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.NavigationBarItem
 import androidx.compose.material3.Scaffold
+import androidx.compose.material3.SnackbarHost
+import androidx.compose.material3.SnackbarHostState
 import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
@@ -17,6 +20,7 @@ import androidx.compose.runtime.Stable
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
@@ -25,6 +29,7 @@ import androidx.compose.ui.unit.dp
 import androidx.navigation.NavHostController
 import com.google.accompanist.navigation.animation.AnimatedNavHost
 import com.google.accompanist.navigation.animation.rememberAnimatedNavController
+import com.pixelized.rplexicon.LocalSnack
 import com.pixelized.rplexicon.R
 import com.pixelized.rplexicon.ui.navigation.pages.LEXICON_ROUTE
 import com.pixelized.rplexicon.ui.navigation.pages.composableLexicon
@@ -44,56 +49,66 @@ fun HomeNavHost(
     bottomBarItems: List<BottomBarItem> = rememberBottomBarItems(navHostController = navHostController),
     startDestination: String = LEXICON_ROUTE
 ) {
-    Scaffold(
+    CompositionLocalProvider(
-        topBar = {
+        LocalSnack provides remember { SnackbarHostState() },
-            TopAppBar(
+    ) {
-                title = {
+        Scaffold(
-                    Text(text = stringResource(id = R.string.app_name))
+            topBar = {
-                },
+                TopAppBar(
-            )
+                    title = {
-        },
+                        Text(text = stringResource(id = R.string.app_name))
-        bottomBar = {
+                    },
-            val selectedIndex = remember { mutableStateOf(0) }
+                )
-            BottomAppBar(
+            },
-                containerColor = MaterialTheme.colorScheme.surface,
+            snackbarHost = {
-                tonalElevation = 0.dp,
+                SnackbarHost(
-            ) {
+                    hostState = LocalSnack.current,
-                bottomBarItems.forEachIndexed { index, item ->
+                )
-                    val selectedItem = remember { derivedStateOf { selectedIndex.value == index } }
+            },
-                    NavigationBarItem(
+            bottomBar = {
-                        selected = selectedItem.value,
+                val selectedIndex = rememberSaveable { mutableStateOf(0) }
-                        onClick = {
+
-                            selectedIndex.value = index
+                BottomAppBar(
-                            item.onClick.invoke()
+                    containerColor = MaterialTheme.colorScheme.surface,
-                        },
+                    tonalElevation = 0.dp,
-                        label = {
-                            Text(text = stringResource(id = item.label))
-                        },
-                        icon = {
-                            Icon(
-                                painter = painterResource(id = item.icon),
-                                contentDescription = "",
-                            )
-                        }
-                    )
-                }
-            }
-        },
-        content = { padding ->
-            CompositionLocalProvider(
-                LocalPageNavHost provides navHostController,
-            ) {
-                AnimatedNavHost(
-                    modifier = Modifier.padding(padding),
-                    navController = navHostController,
-                    startDestination = startDestination,
                 ) {
-                    composableLexicon(lazyListState = lexiconListState)
+                    bottomBarItems.forEachIndexed { index, item ->
-                    composableQuestList()
+                        val selectedItem = remember { derivedStateOf { selectedIndex.value == index } }
+                        NavigationBarItem(
+                            selected = selectedItem.value,
+                            onClick = {
+                                selectedIndex.value = index
+                                item.onClick.invoke()
+                            },
+                            label = {
+                                Text(text = stringResource(id = item.label))
+                            },
+                            icon = {
+                                Icon(
+                                    painter = painterResource(id = item.icon),
+                                    contentDescription = "",
+                                )
+                            }
+                        )
+                    }
+                }
+            },
+            content = { padding ->
+                CompositionLocalProvider(
+                    LocalPageNavHost provides navHostController,
+                ) {
+                    AnimatedNavHost(
+                        modifier = Modifier.padding(padding),
+                        navController = navHostController,
+                        startDestination = startDestination,
+                    ) {
+                        composableLexicon(lazyListState = lexiconListState)
+                        composableQuestList()
+                    }
                 }
             }
-        }
+        )
-    )
+    }
 }
 
 @Stable

app/src/main/java/com/pixelized/rplexicon/ui/screens/lexicon/list/LexiconScreen.kt

@@ -11,10 +11,8 @@ import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.ExperimentalAnimationApi
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
-import androidx.compose.animation.with
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
@@ -58,6 +56,7 @@ import com.pixelized.rplexicon.ui.screens.lexicon.list.LexiconErrorUio.Permissio
 import com.pixelized.rplexicon.ui.screens.lexicon.list.LexiconErrorUio.Structure
 import com.pixelized.rplexicon.ui.theme.LexiconTheme
 import com.pixelized.rplexicon.utilitary.extentions.cell
+import com.pixelized.rplexicon.utilitary.extentions.lexicon
 import kotlinx.coroutines.flow.SharedFlow
 import kotlinx.coroutines.launch
 
@@ -129,10 +128,6 @@ fun LexiconScreen(
 private fun LexiconScreenContent(
     modifier: Modifier = Modifier,
     lazyColumnState: LazyListState,
-    paddingValues: PaddingValues = PaddingValues(
-        top = 6.dp,
-        bottom = 8.dp + 16.dp + 56.dp + 16.dp,
-    ),
     refreshState: PullRefreshState,
     refreshing: State<Boolean>,
     isFabExpended: State<Boolean>,
@@ -145,7 +140,7 @@ private fun LexiconScreenContent(
     ) {
         AnimatedContent(
             targetState = items.value.isEmpty(),
-            transitionSpec = { fadeIn() with fadeOut() },
+            transitionSpec = MaterialTheme.lexicon.animation.itemList,
             label = "AnimatedLexicon"
         ) { empty ->
             when (empty) {
@@ -154,7 +149,7 @@ private fun LexiconScreenContent(
                         .fillMaxSize()
                         .pullRefresh(state = refreshState),
                     state = lazyColumnState,
-                    contentPadding = paddingValues,
+                    contentPadding = MaterialTheme.lexicon.dimens.itemListPadding,
                 ) {
                     items(count = 6) {
                         LexiconItem(
@@ -169,7 +164,7 @@ private fun LexiconScreenContent(
                         .fillMaxSize()
                         .pullRefresh(state = refreshState),
                     state = lazyColumnState,
-                    contentPadding = paddingValues,
+                    contentPadding = MaterialTheme.lexicon.dimens.itemListPadding,
                 ) {
                     items(
                         items = items.value,

app/src/main/java/com/pixelized/rplexicon/ui/screens/quest/list/QuestListScreen.kt

@@ -3,15 +3,9 @@ package com.pixelized.rplexicon.ui.screens.quest.list
 import android.content.res.Configuration
 import androidx.compose.animation.AnimatedContent
 import androidx.compose.animation.ExperimentalAnimationApi
-import androidx.compose.animation.fadeIn
-import androidx.compose.animation.fadeOut
-import androidx.compose.animation.with
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.heightIn
-import androidx.compose.foundation.layout.systemBarsPadding
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.items
@@ -20,7 +14,6 @@ import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.pullrefresh.PullRefreshState
 import androidx.compose.material.pullrefresh.pullRefresh
 import androidx.compose.material.pullrefresh.rememberPullRefreshState
-import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
@@ -31,7 +24,6 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
 import com.pixelized.rplexicon.ui.composable.Loader
 import com.pixelized.rplexicon.ui.navigation.LocalScreenNavHost
@@ -78,10 +70,6 @@ fun QuestListScreen(
 private fun QuestListContent(
     modifier: Modifier = Modifier,
     lazyColumnState: LazyListState,
-    paddingValues: PaddingValues = PaddingValues(
-        top = 8.dp,
-        bottom = 8.dp + 16.dp + 56.dp + 16.dp,
-    ),
     refreshState: PullRefreshState,
     refreshing: State<Boolean>,
     items: State<List<QuestItemUio>>,
@@ -93,7 +81,7 @@ private fun QuestListContent(
     ) {
         AnimatedContent(
             targetState = items.value.isEmpty(),
-            transitionSpec = { fadeIn() with fadeOut() },
+            transitionSpec = MaterialTheme.lexicon.animation.itemList,
             label = "AnimatedQuests"
         ) { empty ->
             when (empty) {
@@ -102,7 +90,7 @@ private fun QuestListContent(
                         .fillMaxSize()
                         .pullRefresh(state = refreshState),
                     state = lazyColumnState,
-                    contentPadding = paddingValues,
+                    contentPadding = MaterialTheme.lexicon.dimens.itemListPadding,
                 ) {
                     items(count = 2) {
                         QuestItem(
@@ -117,7 +105,7 @@ private fun QuestListContent(
                         .fillMaxSize()
                         .pullRefresh(state = refreshState),
                     state = lazyColumnState,
-                    contentPadding = paddingValues,
+                    contentPadding = MaterialTheme.lexicon.dimens.itemListPadding,
                 ) {
                     items(
                         items = items.value,

app/src/main/java/com/pixelized/rplexicon/ui/theme/Theme.kt

@@ -10,8 +10,11 @@ import androidx.compose.runtime.Stable
 import androidx.compose.runtime.compositionLocalOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.graphics.toArgb
+import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.platform.LocalView
 import androidx.core.view.WindowCompat
+import com.pixelized.rplexicon.ui.theme.animation.LexiconAnimation
+import com.pixelized.rplexicon.ui.theme.animation.lexiconAnimation
 import com.pixelized.rplexicon.ui.theme.colors.LexiconColors
 import com.pixelized.rplexicon.ui.theme.colors.darkColorScheme
 import com.pixelized.rplexicon.ui.theme.colors.lightColorScheme
@@ -28,6 +31,7 @@ val LocalLexiconTheme = compositionLocalOf<LexiconTheme> {
 
 @Stable
 data class LexiconTheme(
+    val animation: LexiconAnimation,
     val colorScheme: LexiconColors,
     val shapes: LexiconShapes,
     val dimens: LexiconDimens,
@@ -39,8 +43,11 @@ fun LexiconTheme(
     darkTheme: Boolean = isSystemInDarkTheme(),
     content: @Composable () -> Unit
 ) {
+    val density = LocalDensity.current
+
     val lexiconTheme = remember {
         LexiconTheme(
+            animation = lexiconAnimation(density = density),
             colorScheme = when (darkTheme) {
                 true -> darkColorScheme()
                 else -> lightColorScheme()

app/src/main/java/com/pixelized/rplexicon/ui/theme/animation/LexiconAnimation.kt

@@ -0,0 +1,28 @@
+package com.pixelized.rplexicon.ui.theme.animation
+
+import androidx.compose.animation.AnimatedContentScope
+import androidx.compose.animation.ContentTransform
+import androidx.compose.animation.ExperimentalAnimationApi
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
+import androidx.compose.animation.slideInVertically
+import androidx.compose.animation.slideOutVertically
+import androidx.compose.animation.with
+import androidx.compose.runtime.Stable
+import androidx.compose.ui.unit.Density
+import androidx.compose.ui.unit.dp
+
+@Stable
+@OptIn(ExperimentalAnimationApi::class)
+data class LexiconAnimation constructor(
+    val itemList: AnimatedContentScope<Boolean>.() -> ContentTransform,
+)
+
+@OptIn(ExperimentalAnimationApi::class)
+fun lexiconAnimation(
+    density: Density,
+): LexiconAnimation = LexiconAnimation(
+    itemList = with(density) {
+        { fadeIn() + slideInVertically { 8.dp.roundToPx() } with fadeOut() + slideOutVertically { 8.dp.roundToPx() } }
+    },
+)

app/src/main/java/com/pixelized/rplexicon/ui/theme/dimen/LexiconDimens.kt

@@ -1,5 +1,6 @@
 package com.pixelized.rplexicon.ui.theme.dimen
 
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.runtime.Immutable
 import androidx.compose.runtime.Stable
 import androidx.compose.ui.unit.Dp
@@ -8,11 +9,17 @@ import androidx.compose.ui.unit.dp
 @Stable
 @Immutable
 data class LexiconDimens(
-    val item: Dp
+    val item: Dp,
+    val itemListPadding: PaddingValues,
 )
 
 fun lexiconDimen(
-    item: Dp = 52.dp
+    item: Dp = 52.dp,
+    itemListPadding: PaddingValues = PaddingValues(
+        top = 8.dp,
+        bottom = 8.dp + 16.dp + 56.dp + 16.dp,
+    )
 ) = LexiconDimens(
     item = item,
+    itemListPadding,
 )