Refactor/visuals

app/src/main/java/com/markel/flowstate/components/FlowBottomBar.kt

@@ -1,5 +1,9 @@
 package com.markel.flowstate.components
 
+import androidx.compose.animation.animateColorAsState
+import androidx.compose.animation.core.animateDpAsState
+import androidx.compose.animation.core.spring
+import androidx.compose.animation.core.tween
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -20,6 +24,7 @@ import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.res.vectorResource
+import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.currentBackStackEntryAsState
@@ -53,17 +58,18 @@ fun FlowBottomBar(navController: NavHostController, isLandscape: Boolean) {
             modifier = Modifier.height(barHeight)
         ) {
             bottomNavItems.forEach { screen ->
+                val selected = currentRoute == screen.route
                 val label = stringResource(screen.labelRes)
                 NavigationBarItem(
                     icon = {
-                        if (screen == Screen.Calendar) {
-                            DynamicCalendarIcon()
-                        }
-                        else
-                            Icon(imageVector = ImageVector.vectorResource(screen.iconRes), contentDescription = label)
+                        val iconDrawable = if (selected) screen.iconSelectedRes else screen.iconRes
+                        Icon(
+                            imageVector = ImageVector.vectorResource(iconDrawable),
+                            contentDescription = label
+                        )
                     },
-                    label = if (!isLandscape) { { Text(label) } } else null,  // Hide labels in landscape mode
-                    selected = currentRoute == screen.route,
+                    label = if (!isLandscape) { { Text(label) } } else null,
+                    selected = selected,
                     onClick = {
                         // Navigate to the new screen
                         navController.navigate(screen.route) {

app/src/main/java/com/markel/flowstate/navigation/Screen.kt

@@ -1,15 +1,40 @@
 package com.markel.flowstate.navigation
 
+import androidx.annotation.DrawableRes
 import androidx.annotation.StringRes
 import com.markel.flowstate.R
 
-sealed class Screen(val route: String, @StringRes val labelRes: Int, val iconRes: Int) {
-    object Tasks : Screen("tasks", com.markel.flowstate.feature.tasks.R.string.flow, R.drawable.task_alt_24px)
-    object Calendar : Screen("calendar", com.markel.flowstate.feature.tasks.R.string.calendar, R.drawable.calendar_today)
-    object Habits : Screen("habits", com.markel.flowstate.feature.tasks.R.string.habits, R.drawable.calendar_month_24px)
-    object Mood : Screen("mood", com.markel.flowstate.feature.tasks.R.string.mood, R.drawable.self_improvement_24px)
+sealed class Screen(
+    val route: String,
+    @StringRes val labelRes: Int,
+    @DrawableRes val iconRes: Int,
+    @DrawableRes val iconSelectedRes: Int
+) {
+    object Tasks : Screen(
+        route = "tasks",
+        labelRes = com.markel.flowstate.feature.tasks.R.string.flow,
+        iconRes = R.drawable.task_alt_out_24px,
+        iconSelectedRes = R.drawable.task_alt_24px
+    )
+    object Calendar : Screen(
+        route = "calendar",
+        labelRes = com.markel.flowstate.feature.tasks.R.string.calendar,
+        iconRes = R.drawable.calendar_month_out_24px,
+        iconSelectedRes = R.drawable.calendar_month_24px
+    )
+    object Habits : Screen(
+        route = "habits",
+        labelRes = com.markel.flowstate.feature.tasks.R.string.habits,
+        iconRes = R.drawable.analytics_out_24px,
+        iconSelectedRes = R.drawable.analytics_24px
+    )
+    object Mood : Screen(
+        route = "mood",
+        labelRes = com.markel.flowstate.feature.tasks.R.string.mood,
+        iconRes = R.drawable.self_improvement_24px,
+        iconSelectedRes = R.drawable.self_improvement_24px
+    )
 
-    // Routes that are full-screen without bottom bar
     object Detail {
         const val TASK_EDITOR = "task_editor/{taskId}"
         const val IDEA_EDITOR = "idea_editor/{ideaId}" // ideaId = "new" for creation
@@ -18,8 +43,7 @@ sealed class Screen(val route: String, @StringRes val labelRes: Int, val iconRes
         fun taskEditor(taskId: Int) = "task_editor/$taskId"
         fun ideaEditor(ideaId: Int) = "idea_editor/$ideaId"
         fun newIdea() = "idea_editor/new"
-        fun checkListEditor(checkListId: Int?) =
-            "checklist_editor/${checkListId ?: "new"}"
+        fun checkListEditor(checkListId: Int?) = "checklist_editor/${checkListId ?: "new"}"
         fun habitDetail(habitId: Int) = "habit_detail/$habitId"
     }
 }

app/src/main/res/drawable/analytics_24px.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="960"
+    android:viewportHeight="960"
+    android:tint="?attr/colorControlNormal">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M283.39,680L363.39,680L363.39,480L283.39,480L283.39,680ZM596.61,680L676.61,680L676.61,280L596.61,280L596.61,680ZM440,680L520,680L520,560L440,560L440,680ZM440,480L520,480L520,400L440,400L440,480ZM206.78,859.22Q162.48,859.22 131.63,828.37Q100.78,797.52 100.78,753.22L100.78,206.78Q100.78,162.48 131.63,131.63Q162.48,100.78 206.78,100.78L753.22,100.78Q797.52,100.78 828.37,131.63Q859.22,162.48 859.22,206.78L859.22,753.22Q859.22,797.52 828.37,828.37Q797.52,859.22 753.22,859.22L206.78,859.22Z"/>
+</vector>

app/src/main/res/drawable/analytics_out_24px.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="960"
+    android:viewportHeight="960"
+    android:tint="?attr/colorControlNormal">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M281.43,680L361.43,680L361.43,480L281.43,480L281.43,680ZM598.57,680L678.57,680L678.57,280L598.57,280L598.57,680ZM440,680L520,680L520,560L440,560L440,680ZM440,480L520,480L520,400L440,400L440,480ZM202.87,848.13Q165.09,848.13 138.48,821.52Q111.87,794.91 111.87,757.13L111.87,202.87Q111.87,165.09 138.48,138.48Q165.09,111.87 202.87,111.87L757.13,111.87Q794.91,111.87 821.52,138.48Q848.13,165.09 848.13,202.87L848.13,757.13Q848.13,794.91 821.52,821.52Q794.91,848.13 757.13,848.13L202.87,848.13ZM202.87,757.13L757.13,757.13Q757.13,757.13 757.13,757.13Q757.13,757.13 757.13,757.13L757.13,202.87Q757.13,202.87 757.13,202.87Q757.13,202.87 757.13,202.87L202.87,202.87Q202.87,202.87 202.87,202.87Q202.87,202.87 202.87,202.87L202.87,757.13Q202.87,757.13 202.87,757.13Q202.87,757.13 202.87,757.13ZM202.87,202.87L202.87,202.87Q202.87,202.87 202.87,202.87Q202.87,202.87 202.87,202.87L202.87,757.13Q202.87,757.13 202.87,757.13Q202.87,757.13 202.87,757.13L202.87,757.13Q202.87,757.13 202.87,757.13Q202.87,757.13 202.87,757.13L202.87,202.87Q202.87,202.87 202.87,202.87Q202.87,202.87 202.87,202.87Z"/>
+</vector>

app/src/main/res/drawable/calendar_month_24px.xml

@@ -6,5 +6,5 @@
     android:tint="?attr/colorControlNormal">
   <path
       android:fillColor="@android:color/white"
-      android:pathData="M200,880Q167,880 143.5,856.5Q120,833 120,800L120,240Q120,207 143.5,183.5Q167,160 200,160L240,160L240,80L320,80L320,160L640,160L640,80L720,80L720,160L760,160Q793,160 816.5,183.5Q840,207 840,240L840,800Q840,833 816.5,856.5Q793,880 760,880L200,880ZM200,800L760,800Q760,800 760,800Q760,800 760,800L760,400L200,400L200,800Q200,800 200,800Q200,800 200,800ZM200,320L760,320L760,240Q760,240 760,240Q760,240 760,240L200,240Q200,240 200,240Q200,240 200,240L200,320ZM200,320L200,240Q200,240 200,240Q200,240 200,240L200,240Q200,240 200,240Q200,240 200,240L200,320ZM480,560Q463,560 451.5,548.5Q440,537 440,520Q440,503 451.5,491.5Q463,480 480,480Q497,480 508.5,491.5Q520,503 520,520Q520,537 508.5,548.5Q497,560 480,560ZM320,560Q303,560 291.5,548.5Q280,537 280,520Q280,503 291.5,491.5Q303,480 320,480Q337,480 348.5,491.5Q360,503 360,520Q360,537 348.5,548.5Q337,560 320,560ZM640,560Q623,560 611.5,548.5Q600,537 600,520Q600,503 611.5,491.5Q623,480 640,480Q657,480 668.5,491.5Q680,503 680,520Q680,537 668.5,548.5Q657,560 640,560ZM480,720Q463,720 451.5,708.5Q440,697 440,680Q440,663 451.5,651.5Q463,640 480,640Q497,640 508.5,651.5Q520,663 520,680Q520,697 508.5,708.5Q497,720 480,720ZM320,720Q303,720 291.5,708.5Q280,697 280,680Q280,663 291.5,651.5Q303,640 320,640Q337,640 348.5,651.5Q360,663 360,680Q360,697 348.5,708.5Q337,720 320,720ZM640,720Q623,720 611.5,708.5Q600,697 600,680Q600,663 611.5,651.5Q623,640 640,640Q657,640 668.5,651.5Q680,663 680,680Q680,697 668.5,708.5Q657,720 640,720Z"/>
+      android:pathData="M480,564.52Q461.3,564.52 448.39,551.61Q435.48,538.7 435.48,520Q435.48,501.3 448.39,488.39Q461.3,475.48 480,475.48Q498.7,475.48 511.61,488.39Q524.52,501.3 524.52,520Q524.52,538.7 511.61,551.61Q498.7,564.52 480,564.52ZM288.39,551.61Q275.48,538.7 275.48,520Q275.48,501.3 288.39,488.39Q301.3,475.48 320,475.48Q338.7,475.48 351.61,488.39Q364.52,501.3 364.52,520Q364.52,538.7 351.61,551.61Q338.7,564.52 320,564.52Q301.3,564.52 288.39,551.61ZM640,564.52Q621.87,564.52 608.67,551.61Q595.48,538.7 595.48,520Q595.48,501.3 608.67,488.39Q621.87,475.48 640,475.48Q658.7,475.48 671.61,488.39Q684.52,501.3 684.52,520Q684.52,538.7 671.61,551.61Q658.7,564.52 640,564.52ZM480,724.52Q461.3,724.52 448.39,711.33Q435.48,698.13 435.48,680Q435.48,661.3 448.39,648.39Q461.3,635.48 480,635.48Q498.7,635.48 511.61,648.39Q524.52,661.3 524.52,680Q524.52,698.13 511.61,711.33Q498.7,724.52 480,724.52ZM288.39,711.33Q275.48,698.13 275.48,680Q275.48,661.3 288.39,648.39Q301.3,635.48 320,635.48Q338.7,635.48 351.61,648.39Q364.52,661.3 364.52,680Q364.52,698.13 351.61,711.33Q338.7,724.52 320,724.52Q301.3,724.52 288.39,711.33ZM640,724.52Q621.87,724.52 608.67,711.33Q595.48,698.13 595.48,680Q595.48,661.3 608.67,648.39Q621.87,635.48 640,635.48Q658.7,635.48 671.61,648.39Q684.52,661.3 684.52,680Q684.52,698.13 671.61,711.33Q658.7,724.52 640,724.52ZM206.78,899.22Q162.48,899.22 131.63,868.37Q100.78,837.52 100.78,793.22L100.78,246.78Q100.78,202.48 131.63,171.63Q162.48,140.78 206.78,140.78L240,140.78L240,60.78L333,60.78L333,140.78L627,140.78L627,60.78L720,60.78L720,140.78L753.22,140.78Q797.52,140.78 828.37,171.63Q859.22,202.48 859.22,246.78L859.22,793.22Q859.22,837.52 828.37,868.37Q797.52,899.22 753.22,899.22L206.78,899.22ZM206.78,793.22L753.22,793.22Q753.22,793.22 753.22,793.22Q753.22,793.22 753.22,793.22L753.22,400L206.78,400L206.78,793.22Q206.78,793.22 206.78,793.22Q206.78,793.22 206.78,793.22Z"/>
 </vector>

app/src/main/res/drawable/calendar_month_out_24px.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="960"
+    android:viewportHeight="960"
+    android:tint="?attr/colorControlNormal">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M202.87,888.13Q165.09,888.13 138.48,861.52Q111.87,834.91 111.87,797.13L111.87,242.87Q111.87,205.09 138.48,178.48Q165.09,151.87 202.87,151.87L240,151.87L240,71.87L325.5,71.87L325.5,151.87L634.5,151.87L634.5,71.87L720,71.87L720,151.87L757.13,151.87Q794.91,151.87 821.52,178.48Q848.13,205.09 848.13,242.87L848.13,797.13Q848.13,834.91 821.52,861.52Q794.91,888.13 757.13,888.13L202.87,888.13ZM202.87,797.13L757.13,797.13Q757.13,797.13 757.13,797.13Q757.13,797.13 757.13,797.13L757.13,400L202.87,400L202.87,797.13Q202.87,797.13 202.87,797.13Q202.87,797.13 202.87,797.13ZM202.87,320L757.13,320L757.13,242.87Q757.13,242.87 757.13,242.87Q757.13,242.87 757.13,242.87L202.87,242.87Q202.87,242.87 202.87,242.87Q202.87,242.87 202.87,242.87L202.87,320ZM202.87,320L202.87,242.87Q202.87,242.87 202.87,242.87Q202.87,242.87 202.87,242.87L202.87,242.87Q202.87,242.87 202.87,242.87Q202.87,242.87 202.87,242.87L202.87,320ZM480,561.91Q462.19,561.91 450.14,549.82Q438.09,537.72 438.09,520Q438.09,502.28 450.14,490.18Q462.19,478.09 480,478.09Q497.81,478.09 509.86,490.18Q521.91,502.28 521.91,520Q521.91,537.72 509.86,549.82Q497.81,561.91 480,561.91ZM290.18,549.82Q278.09,537.72 278.09,520Q278.09,502.28 290.18,490.18Q302.28,478.09 320,478.09Q337.72,478.09 349.82,490.18Q361.91,502.28 361.91,520Q361.91,537.72 349.82,549.82Q337.72,561.91 320,561.91Q302.28,561.91 290.18,549.82ZM640,561.91Q622.52,561.91 610.3,549.82Q598.09,537.72 598.09,520Q598.09,502.28 610.3,490.18Q622.52,478.09 640.12,478.09Q657.72,478.09 669.82,490.18Q681.91,502.28 681.91,520Q681.91,537.72 669.86,549.82Q657.81,561.91 640,561.91ZM480,721.91Q462.19,721.91 450.14,709.7Q438.09,697.48 438.09,679.88Q438.09,662.28 450.14,650.18Q462.19,638.09 480,638.09Q497.81,638.09 509.86,650.14Q521.91,662.19 521.91,680Q521.91,697.48 509.86,709.7Q497.81,721.91 480,721.91ZM290.18,709.7Q278.09,697.48 278.09,679.88Q278.09,662.28 290.18,650.18Q302.28,638.09 320,638.09Q337.72,638.09 349.82,650.14Q361.91,662.19 361.91,680Q361.91,697.48 349.82,709.7Q337.72,721.91 320,721.91Q302.28,721.91 290.18,709.7ZM640,721.91Q622.52,721.91 610.3,709.7Q598.09,697.48 598.09,679.88Q598.09,662.28 610.3,650.18Q622.52,638.09 640.12,638.09Q657.72,638.09 669.82,650.14Q681.91,662.19 681.91,680Q681.91,697.48 669.86,709.7Q657.81,721.91 640,721.91Z"/>
+</vector>

app/src/main/res/drawable/mood_24px.xml

@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="960"
+    android:viewportHeight="960"
+    android:tint="?attr/colorControlNormal">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M615.48,444.52Q642.74,444.52 661.37,425.89Q680,407.26 680,380Q680,352.74 661.37,334.11Q642.74,315.48 615.48,315.48Q588.78,315.48 570.15,334.39Q551.52,353.3 551.52,380Q551.52,406.7 570.15,425.61Q588.78,444.52 615.48,444.52ZM344.52,444.52Q371.22,444.52 389.85,425.61Q408.48,406.7 408.48,380Q408.48,353.3 389.85,334.39Q371.22,315.48 344.52,315.48Q317.26,315.48 298.63,334.11Q280,352.74 280,380Q280,407.26 298.63,425.89Q317.26,444.52 344.52,444.52ZM606.61,659.52Q662.96,619.04 686.83,553.22L273.17,553.22Q297.04,619.04 353.39,659.52Q409.74,700 480,700Q550.26,700 606.61,659.52ZM316.65,866.31Q240.26,833.39 183.43,776.57Q126.61,719.74 93.69,643.35Q60.78,566.96 60.78,480Q60.78,393.04 93.69,316.65Q126.61,240.26 183.43,183.43Q240.26,126.61 316.65,93.69Q393.04,60.78 480,60.78Q566.96,60.78 643.35,93.69Q719.74,126.61 776.57,183.43Q833.39,240.26 866.31,316.65Q899.22,393.04 899.22,480Q899.22,566.96 866.31,643.35Q833.39,719.74 776.57,776.57Q719.74,833.39 643.35,866.31Q566.96,899.22 480,899.22Q393.04,899.22 316.65,866.31Z"/>
+</vector>

app/src/main/res/drawable/self_improvement_24px.xml

@@ -6,5 +6,5 @@
     android:tint="?attr/colorControlNormal">
   <path
       android:fillColor="@android:color/white"
-      android:pathData="M272,800Q242,800 221,779Q200,758 200,728Q200,707 212,688.5Q224,670 244,662L400,600L400,510Q346,573 274.5,606.5Q203,640 120,640L120,560Q188,560 243.5,532Q299,504 344,452L398,388Q410,374 426,367Q442,360 460,360L500,360Q518,360 534,367Q550,374 562,388L616,452Q661,504 716.5,532Q772,560 840,560L840,640Q757,640 685.5,606.5Q614,573 560,510L560,600L716,662Q736,670 748,688.5Q760,707 760,728Q760,758 739,779Q718,800 688,800L400,800L400,780Q400,754 417,737Q434,720 460,720L580,720Q589,720 594.5,714.5Q600,709 600,700Q600,691 594.5,685.5Q589,680 580,680L460,680Q418,680 389,709Q360,738 360,780L360,800L272,800ZM480,320Q447,320 423.5,296.5Q400,273 400,240Q400,207 423.5,183.5Q447,160 480,160Q513,160 536.5,183.5Q560,207 560,240Q560,273 536.5,296.5Q513,320 480,320Z"/>
+      android:pathData="M272,808.48Q238.04,808.48 214.78,785.22Q191.52,761.96 191.52,728Q191.52,704.17 205.22,683.41Q218.91,662.65 240.61,654.09L391.52,593.78L391.52,523Q337.52,580.35 266.59,610.17Q195.65,640 111.52,640L111.52,542.48Q181.78,542.48 238.13,515.61Q294.48,488.74 337.22,437.87L391.22,373.3Q404.35,357.61 422.04,350.04Q439.74,342.48 460,342.48L500,342.48Q520.26,342.48 537.96,350.33Q555.65,358.17 568.78,373.87L622.78,439Q665.52,489.87 721.87,516.17Q778.22,542.48 848.48,542.48L848.48,640Q764.35,640 693.41,610.17Q622.48,580.35 568.48,523L568.48,593.78L719.39,654.09Q741.09,662.65 754.78,683.41Q768.48,704.17 768.48,728Q768.48,761.96 745.22,785.22Q721.96,808.48 688,808.48L400,808.48L400,780Q400,752.3 417.85,736.15Q435.7,720 460,720L580,720Q589,720 594.5,714.5Q600,709 600,700Q600,691 594.5,685.5Q589,680 580,680L460,680Q418.57,680 389.28,709Q360,738 360,780L360,808.48L272,808.48ZM417.28,276.72Q391.52,250.96 391.52,214Q391.52,177.04 417.28,151.28Q443.04,125.52 480,125.52Q516.96,125.52 542.72,151.28Q568.48,177.04 568.48,214Q568.48,250.96 542.72,276.72Q516.96,302.48 480,302.48Q443.04,302.48 417.28,276.72Z"/>
 </vector>