From d9c3ff6b1069de9bd170d647357967654baf4785 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Mon, 4 Nov 2024 12:18:44 +0100
Subject: [PATCH 01/23] feat: add constants for screen size categories
 (compact, medium, extended)

---
 .../java/com/android/periodpals/ui/theme/Theme.kt | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index b9d040bba..d36a19b2e 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -1,6 +1,7 @@
 package com.android.periodpals.ui.theme
 
 import android.app.Activity
+import android.widget.Toast
 import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.darkColorScheme
@@ -116,6 +117,9 @@ private val darkSchemeInDev =
         surfaceContainerHighest = surfaceContainerHighestDark,
     )
 
+private const val COMPACT_S = 360
+private const val COMPACT_M = 440
+
 @OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
 @Composable
 fun PeriodPalsAppTheme(
@@ -147,28 +151,35 @@ fun PeriodPalsAppTheme(
 
   var appDimens = CompactDimens
   var typography = CompactTypography
+  var toasty = ""
   when (window.widthSizeClass) {
     WindowWidthSizeClass.Compact -> {
-      if (config.screenWidthDp <= 360) {
+      if (config.screenWidthDp <= COMPACT_S) {
         appDimens = CompactSmallDimens
         typography = CompactSmallTypography
-      } else if (config.screenWidthDp < 599) {
+        toasty = "CompactSmall"
+      } else if (config.screenWidthDp <= COMPACT_M) {
         appDimens = CompactMediumDimens
         typography = CompactMediumTypography
+        toasty = "CompactMedium"
       } else {
         appDimens = CompactDimens
         typography = CompactTypography
+        toasty = "CompactLarge"
       }
     }
     WindowWidthSizeClass.Medium -> {
       appDimens = MediumDimens
       typography = MediumTypography
+      toasty = "Medium"
     }
     WindowWidthSizeClass.Expanded -> {
       appDimens = ExpandedDimens
       typography = ExpandedTypography
+      toasty = "Expanded"
     }
   }
+  Toast.makeText(activity, toasty, Toast.LENGTH_SHORT).show()
 
   ProvideAppUtils(appDimens = appDimens) {
     MaterialTheme(colorScheme = colorScheme, typography = typography, content = content)

From bf13f8deaaa615fca5cd0bf159f68199e54a50f8 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Mon, 4 Nov 2024 14:56:47 +0100
Subject: [PATCH 02/23] fix: update Compact M value for responsiveness

---
 app/src/main/java/com/android/periodpals/ui/theme/Theme.kt | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index d36a19b2e..988ce5ed8 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -118,7 +118,7 @@ private val darkSchemeInDev =
     )
 
 private const val COMPACT_S = 360
-private const val COMPACT_M = 440
+private const val COMPACT_M = 500
 
 @OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
 @Composable
@@ -155,25 +155,30 @@ fun PeriodPalsAppTheme(
   when (window.widthSizeClass) {
     WindowWidthSizeClass.Compact -> {
       if (config.screenWidthDp <= COMPACT_S) {
+        // Emulator Small Phone API 34
         appDimens = CompactSmallDimens
         typography = CompactSmallTypography
         toasty = "CompactSmall"
       } else if (config.screenWidthDp <= COMPACT_M) {
+        // Emulator Pixel 2 API 34
         appDimens = CompactMediumDimens
         typography = CompactMediumTypography
         toasty = "CompactMedium"
       } else {
+        // Emulator Pixel 9 Pro XL API 34
         appDimens = CompactDimens
         typography = CompactTypography
         toasty = "CompactLarge"
       }
     }
     WindowWidthSizeClass.Medium -> {
+      // Emulator Medium Tablet API 34
       appDimens = MediumDimens
       typography = MediumTypography
       toasty = "Medium"
     }
     WindowWidthSizeClass.Expanded -> {
+      //
       appDimens = ExpandedDimens
       typography = ExpandedTypography
       toasty = "Expanded"

From fdcc4e1a6e053e9115e41ab58bf31d76f0c6bfee Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 14:12:01 +0100
Subject: [PATCH 03/23] feat: update theme color to selected palette

---
 .../com/android/periodpals/ui/theme/Theme.kt  | 34 ++++---------------
 1 file changed, 7 insertions(+), 27 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index 988ce5ed8..d4750feac 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -11,7 +11,6 @@ import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
 import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.SideEffect
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.toArgb
 import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalContext
@@ -19,27 +18,7 @@ import androidx.compose.ui.platform.LocalView
 import androidx.core.view.WindowCompat
 import com.android.periodpals.MainActivity
 
-private val DarkColorScheme =
-    darkColorScheme(primary = Purple80, secondary = PurpleGrey80, tertiary = Pink80)
-
 private val LightColorScheme =
-    lightColorScheme(
-        primary = Purple40,
-        secondary = PurpleGrey40,
-        tertiary = Pink40,
-
-        // Other default colors to override
-        background = Color(0xFFFFFBFE),
-        surface = Color(0xFFFFFBFE),
-        onPrimary = Color.White,
-        onSecondary = Color.White,
-        onTertiary = Color.White,
-        onBackground = Color(0xFF1C1B1F),
-        onSurface = Color(0xFF1C1B1F),
-    )
-
-/* Color themes still in development */
-private val lightSchemeInDev =
     lightColorScheme(
         primary = primaryLight,
         onPrimary = onPrimaryLight,
@@ -78,7 +57,7 @@ private val lightSchemeInDev =
         surfaceContainerHighest = surfaceContainerHighestLight,
     )
 
-private val darkSchemeInDev =
+private val DarkColorScheme =
     darkColorScheme(
         primary = primaryDark,
         onPrimary = onPrimaryDark,
@@ -149,8 +128,8 @@ fun PeriodPalsAppTheme(
   val window = calculateWindowSizeClass(activity = activity)
   val config = LocalConfiguration.current
 
-  var appDimens = CompactDimens
-  var typography = CompactTypography
+  var appDimens = CompactLargeDimens
+  var typography = CompactLargeTypography
   var toasty = ""
   when (window.widthSizeClass) {
     WindowWidthSizeClass.Compact -> {
@@ -166,8 +145,8 @@ fun PeriodPalsAppTheme(
         toasty = "CompactMedium"
       } else {
         // Emulator Pixel 9 Pro XL API 34
-        appDimens = CompactDimens
-        typography = CompactTypography
+        appDimens = CompactLargeDimens
+        typography = CompactLargeTypography
         toasty = "CompactLarge"
       }
     }
@@ -178,12 +157,13 @@ fun PeriodPalsAppTheme(
       toasty = "Medium"
     }
     WindowWidthSizeClass.Expanded -> {
-      //
+      // Pixel C API 34
       appDimens = ExpandedDimens
       typography = ExpandedTypography
       toasty = "Expanded"
     }
   }
+  // TODO: delete
   Toast.makeText(activity, toasty, Toast.LENGTH_SHORT).show()
 
   ProvideAppUtils(appDimens = appDimens) {

From 0bcb1098fea70fe65a04620ea4e9a0f7ca421ada Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 18:54:07 +0100
Subject: [PATCH 04/23] feat: add borderline value and adapt compact M paddings

---
 .../com/android/periodpals/ui/theme/Dimens.kt     | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
index 559d691e3..a31baa0d1 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
@@ -19,11 +19,13 @@ data class Dimens(
     val medium2: Dp = 0.dp,
     val medium3: Dp = 0.dp,
     val large: Dp = 0.dp,
+    val borderLine: Dp = 1.dp,
     val buttonHeight: Dp = 40.dp,
     val iconSize: Dp = 24.dp,
     //    val logoSize: Dp = 42.dp
 )
 
+// Width <= 360dp
 val CompactSmallDimens =
     Dimens(
         small1 = 5.dp,
@@ -37,17 +39,18 @@ val CompactSmallDimens =
         //    logoSize = 36.dp
     )
 
+// 360dp < Width <= 500dp
 val CompactMediumDimens =
     Dimens(
-        small1 = 8.dp,
-        small2 = 13.dp,
-        small3 = 17.dp,
+        small1 = 4.dp,
+        small2 = 8.dp,
+        small3 = 16.dp,
         medium1 = 24.dp,
-        medium2 = 30.dp,
+        medium2 = 32.dp,
         medium3 = 40.dp,
-        large = 65.dp)
+        large = 60.dp)
 
-val CompactDimens =
+val CompactLargeDimens =
     Dimens(
         small1 = 10.dp,
         small2 = 15.dp,

From 2975a3566dc53b46dcba0b810d47d2652aad5570 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 18:55:27 +0100
Subject: [PATCH 05/23] fix: typo in `Color.kt`

---
 app/src/main/java/com/android/periodpals/ui/theme/Color.kt | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
index 9701f827d..55c55ef81 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
@@ -2,6 +2,7 @@ package com.android.periodpals.ui.theme
 
 import androidx.compose.ui.graphics.Color
 
+//TODO: delete
 val Purple80 = Color(0xFFD0BCFF)
 val PurpleGrey80 = Color(0xFFCCC2DC)
 val Pink80 = Color(0xFFEFB8C8)
@@ -10,7 +11,7 @@ val Purple40 = Color(0xFF6650a4)
 val PurpleGrey40 = Color(0xFF625b71)
 val Pink40 = Color(0xFF7D5260)
 
-/* Light theme, still in development and thus not in use */
+/* Light theme */
 val primaryLight = Color(0xFF415F91)
 val onPrimaryLight = Color(0xFFFFFFFF)
 val primaryContainerLight = Color(0xFFD6E3FF)
@@ -47,7 +48,7 @@ val surfaceContainerLight = Color(0xFFEDEDF4)
 val surfaceContainerHighLight = Color(0xFFE7E8EE)
 val surfaceContainerHighestLight = Color(0xFFE2E2E9)
 
-/* Dark theme, still in development and thus not in use */
+/* Dark theme */
 val primaryDark = Color(0xFFAAC7FF)
 val onPrimaryDark = Color(0xFF0A305F)
 val primaryContainerDark = Color(0xFF284777)

From 8dc0811af0e453d50f773cdf7ee1401b7adb28c1 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 18:57:13 +0100
Subject: [PATCH 06/23] refactor: rename `CompactDimens` to
 `CompactLargeDimens` in `AppUtil.kt`

---
 app/src/main/java/com/android/periodpals/ui/theme/AppUtil.kt | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/AppUtil.kt b/app/src/main/java/com/android/periodpals/ui/theme/AppUtil.kt
index b546d7be2..7f6c0db20 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/AppUtil.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/AppUtil.kt
@@ -21,4 +21,4 @@ fun ProvideAppUtils(
 }
 
 /** A composition local representing the application dimensions. */
-val LocalAppDimens = compositionLocalOf { CompactDimens }
+val LocalAppDimens = compositionLocalOf { CompactLargeDimens }

From 249e7a224562f63ac0980586227e32c599b701bf Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 18:58:26 +0100
Subject: [PATCH 07/23] fix: update font list in `Type.kt`

---
 .../com/android/periodpals/ui/theme/Type.kt   | 88 +++++++++----------
 1 file changed, 44 insertions(+), 44 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
index c3d701d38..fe7457026 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
@@ -13,90 +13,65 @@ import com.android.periodpals.R
 val Nunito_Sans =
     FontFamily(
         listOf(
-            Font(
-                resId = R.font.nunito_sans_black,
-                weight = FontWeight.Black,
-                style = FontStyle.Normal),
+            Font(resId = R.font.nunito_sans_black, weight = FontWeight.Black),
             Font(
                 resId = R.font.nunito_sans_black_italic,
                 weight = FontWeight.Black,
                 style = FontStyle.Italic),
-            Font(
-                resId = R.font.nunito_sans_bold,
-                weight = FontWeight.Bold,
-                style = FontStyle.Normal),
+            Font(resId = R.font.nunito_sans_bold, weight = FontWeight.Bold),
             Font(
                 resId = R.font.nunito_sans_bold_italic,
                 weight = FontWeight.Bold,
                 style = FontStyle.Italic),
-            Font(
-                resId = R.font.nunito_sans_extra_bold,
-                weight = FontWeight.ExtraBold,
-                style = FontStyle.Normal),
+            Font(resId = R.font.nunito_sans_extra_bold, weight = FontWeight.ExtraBold),
             Font(
                 resId = R.font.nunito_sans_extra_bold_italic,
                 weight = FontWeight.ExtraBold,
                 style = FontStyle.Italic),
-            Font(
-                resId = R.font.nunito_sans_extra_light,
-                weight = FontWeight.ExtraLight,
-                style = FontStyle.Normal),
+            Font(resId = R.font.nunito_sans_extra_light, weight = FontWeight.ExtraLight),
             Font(
                 resId = R.font.nunito_sans_extra_light_italic,
                 weight = FontWeight.ExtraLight,
                 style = FontStyle.Italic),
-            Font(
-                resId = R.font.nunito_sans_italic,
-                weight = FontWeight.Normal,
-                style = FontStyle.Italic),
-            Font(
-                resId = R.font.nunito_sans_light,
-                weight = FontWeight.Light,
-                style = FontStyle.Normal),
+            Font(resId = R.font.nunito_sans_italic, style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_light, weight = FontWeight.Light),
             Font(
                 resId = R.font.nunito_sans_light_italic,
                 weight = FontWeight.Light,
                 style = FontStyle.Italic),
-            Font(
-                resId = R.font.nunito_sans_regular,
-                weight = FontWeight.Normal,
-                style = FontStyle.Normal),
-            Font(
-                resId = R.font.nunito_sans_semi_bold,
-                weight = FontWeight.SemiBold,
-                style = FontStyle.Normal),
+            Font(resId = R.font.nunito_sans_regular),
+            Font(resId = R.font.nunito_sans_semi_bold, weight = FontWeight.SemiBold),
             Font(
                 resId = R.font.nunito_sans_semi_bold_italic,
                 weight = FontWeight.SemiBold,
                 style = FontStyle.Italic)))
 
-// Set of Material typography styles to start with
-val CompactTypography =
+val CompactSmallTypography =
     Typography(
         headlineLarge =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 32.sp),
+                fontSize = 22.sp),
         headlineMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Bold,
                 fontStyle = FontStyle.Normal,
-                fontSize = 24.sp),
+                fontSize = 16.sp),
         titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 14.sp),
+                fontSize = 10.sp),
         labelMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,
                 fontStyle = FontStyle.Normal,
-                fontSize = 14.sp))
+                fontSize = 10.sp))
 
 val CompactMediumTypography =
     Typography(
@@ -105,7 +80,8 @@ val CompactMediumTypography =
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 28.sp),
+                fontSize = 40.sp,
+                lineHeight = 64.sp),
         headlineMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
@@ -118,39 +94,63 @@ val CompactMediumTypography =
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
                 fontSize = 14.sp),
+        bodyLarge =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.SemiBold,
+                fontStyle = FontStyle.Normal,
+                fontSize = 20.sp),
+        bodyMedium =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Medium,
+                fontStyle = FontStyle.Normal,
+                fontSize = 18.sp),
+        labelLarge =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Medium,
+                fontStyle = FontStyle.Normal,
+                fontSize = 16.sp),
         labelMedium =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Normal,
+                fontStyle = FontStyle.Normal,
+                fontSize = 16.sp),
+        labelSmall =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,
                 fontStyle = FontStyle.Normal,
                 fontSize = 14.sp))
 
-val CompactSmallTypography =
+val CompactLargeTypography =
     Typography(
         headlineLarge =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 22.sp),
+                fontSize = 32.sp),
         headlineMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Bold,
                 fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
+                fontSize = 24.sp),
         titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 10.sp),
+                fontSize = 14.sp),
         labelMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,
                 fontStyle = FontStyle.Normal,
-                fontSize = 10.sp))
+                fontSize = 14.sp))
 
 val MediumTypography =
     Typography(

From 4e5b73c162fc7f17fb33895c3cda9b0a9fd6526b Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 21:54:31 +0100
Subject: [PATCH 08/23] style: ktfmt

---
 app/src/main/java/com/android/periodpals/ui/theme/Color.kt | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
index 55c55ef81..eaac43d36 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
@@ -2,7 +2,7 @@ package com.android.periodpals.ui.theme
 
 import androidx.compose.ui.graphics.Color
 
-//TODO: delete
+// TODO: delete
 val Purple80 = Color(0xFFD0BCFF)
 val PurpleGrey80 = Color(0xFFCCC2DC)
 val Pink80 = Color(0xFFEFB8C8)

From 2c460f9569741fecf60dc0f0e680cef0144e7593 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 23:03:11 +0100
Subject: [PATCH 09/23] feat: adjust `ErrorText` padding and text style to
 match Figma

---
 .../com/android/periodpals/ui/components/ErrorComponent.kt  | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt b/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt
index 2afeea395..ea6bfc863 100644
--- a/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt
+++ b/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt
@@ -1,6 +1,7 @@
 package com.android.periodpals.ui.components
 
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -15,8 +16,9 @@ import androidx.compose.ui.text.style.TextAlign
 @Composable
 fun ErrorText(message: String, testTag: String) {
   Text(
-      modifier = Modifier.fillMaxWidth().testTag(testTag),
+      modifier = Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag),
       text = message,
       color = Color.Red,
-      style = MaterialTheme.typography.bodyMedium.copy(textAlign = TextAlign.Start))
+      textAlign = TextAlign.Start,
+      style = MaterialTheme.typography.labelLarge)
 }

From d7c67f16c8aa3f3ff00a16cc64689ff8983d542f Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 23:06:07 +0100
Subject: [PATCH 10/23] feat: update `SignInScreen` layout for Figma compliance

- Adjusted padding and typography for consistency with Figma designs.
- Made screen scrollable to support all screen sizes.
- Validated adjustments on compact medium; remaining screens to follow.
---
 .../periodpals/ui/authentication/SignIn.kt    | 219 ++++++++++--------
 .../ui/components/AuthComponents.kt           |  88 ++++---
 2 files changed, 175 insertions(+), 132 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
index f49ea6e46..b0f04d1b2 100644
--- a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
+++ b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
@@ -15,7 +15,9 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.layout.wrapContentSize
+import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
@@ -36,7 +38,6 @@ import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.unit.dp
 import com.android.periodpals.R
 import com.android.periodpals.model.authentication.AuthenticationViewModel
 import com.android.periodpals.model.user.UserAuthState
@@ -54,6 +55,7 @@ import com.android.periodpals.ui.navigation.Screen
 import com.android.periodpals.ui.theme.Pink40
 import com.android.periodpals.ui.theme.Purple80
 import com.android.periodpals.ui.theme.PurpleGrey80
+import com.android.periodpals.ui.theme.dimens
 
 @Composable
 fun SignInScreen(
@@ -80,113 +82,130 @@ fun SignInScreen(
         // Purple-ish background
         GradedBackground(Purple80, Pink40, PurpleGrey80, SignInScreen.BACKGROUND)
 
-        Column(
-            modifier = Modifier.fillMaxSize().padding(padding).padding(60.dp),
+        LazyColumn(
+            modifier =
+                Modifier.fillMaxSize()
+                    .padding(padding)
+                    .padding(
+                        horizontal = MaterialTheme.dimens.large,
+                        vertical = MaterialTheme.dimens.medium3),
             horizontalAlignment = Alignment.CenterHorizontally,
-            verticalArrangement = Arrangement.spacedBy(48.dp, Alignment.CenterVertically),
+            verticalArrangement =
+                Arrangement.spacedBy(MaterialTheme.dimens.medium1, Alignment.CenterVertically),
         ) {
           // Welcome text
-          AuthWelcomeText(
-              text = "Welcome to PeriodPals",
-              color = Color.Black,
-              testTag = SignInScreen.TITLE_TEXT,
-          )
+          item {
+            AuthWelcomeText(
+                text = "Welcome to PeriodPals",
+                color = Color.Black,
+                testTag = SignInScreen.TITLE_TEXT,
+            )
+          }
 
           // Rectangle with login fields and button
-          Box(
-              modifier =
-                  Modifier.fillMaxWidth()
-                      .border(1.dp, Color.Gray, RectangleShape)
-                      .background(Color.White)
-                      .padding(24.dp)) {
-                Column(
-                    horizontalAlignment = Alignment.CenterHorizontally,
-                    verticalArrangement = Arrangement.spacedBy(8.dp, Alignment.CenterVertically),
-                ) {
-                  // Sign in instruction
-                  AuthInstruction(
-                      text = "Sign in to your account",
-                      testTag = SignInScreen.INSTRUCTION_TEXT,
-                  )
-
-                  // Email input and error message
-                  AuthEmailInput(
-                      email = email,
-                      onEmailChange = { email = it },
-                      testTag = SignInScreen.EMAIL_FIELD,
-                  )
-                  if (emailErrorMessage.isNotEmpty()) {
-                    ErrorText(emailErrorMessage, SignInScreen.EMAIL_ERROR_TEXT)
-                  }
+          item {
+            Box(
+                modifier =
+                    Modifier.fillMaxWidth().wrapContentHeight()
+                        .border(MaterialTheme.dimens.borderLine, Color.Gray, RectangleShape)
+                        .background(Color.White)
+                        .padding(horizontal = MaterialTheme.dimens.medium1, vertical = MaterialTheme.dimens.small3)) {
+                  Column(
+                      modifier = Modifier.fillMaxWidth().wrapContentHeight(),
+                      horizontalAlignment = Alignment.CenterHorizontally,
+                      verticalArrangement =
+                          Arrangement.spacedBy(
+                              MaterialTheme.dimens.small2, Alignment.CenterVertically),
+                  ) {
+                    // Sign in instruction
+                    AuthInstruction(
+                        text = "Sign in to your account",
+                        testTag = SignInScreen.INSTRUCTION_TEXT,
+                    )
 
-                  // Password input and error message
-                  AuthPasswordInput(
-                      password = password,
-                      onPasswordChange = { password = it },
-                      passwordVisible = passwordVisible,
-                      onPasswordVisibilityChange = { passwordVisible = !passwordVisible },
-                      testTag = SignInScreen.PASSWORD_FIELD,
-                      visibilityTestTag = SignInScreen.PASSWORD_VISIBILITY_BUTTON,
-                  )
-                  if (passwordErrorMessage.isNotEmpty()) {
-                    ErrorText(passwordErrorMessage, SignInScreen.PASSWORD_ERROR_TEXT)
-                  }
+                    // Email input and error message
+                    AuthEmailInput(
+                        email = email,
+                        onEmailChange = { email = it },
+                        testTag = SignInScreen.EMAIL_FIELD,
+                    )
+                    if (emailErrorMessage.isNotEmpty()) {
+                      ErrorText(emailErrorMessage, SignInScreen.EMAIL_ERROR_TEXT)
+                    }
+
+                    // Password input and error message
+                    AuthPasswordInput(
+                        password = password,
+                        onPasswordChange = { password = it },
+                        passwordVisible = passwordVisible,
+                        onPasswordVisibilityChange = { passwordVisible = !passwordVisible },
+                        testTag = SignInScreen.PASSWORD_FIELD,
+                        visibilityTestTag = SignInScreen.PASSWORD_VISIBILITY_BUTTON,
+                    )
+                    if (passwordErrorMessage.isNotEmpty()) {
+                      ErrorText(passwordErrorMessage, SignInScreen.PASSWORD_ERROR_TEXT)
+                    }
+
+                    // Sign in button
+                    AuthButton(
+                        text = "Sign in",
+                        onClick = {
+                          emailErrorMessage = validateEmail(email)
+                          passwordErrorMessage = validatePassword(password)
 
-                  // Sign in button
-                  AuthButton(
-                      text = "Sign in",
-                      onClick = {
-                        emailErrorMessage = validateEmail(email)
-                        passwordErrorMessage = validatePassword(password)
-
-                        if (emailErrorMessage.isEmpty() && passwordErrorMessage.isEmpty()) {
-                          authenticationViewModel.logInWithEmail(email, password)
-                          authenticationViewModel.isUserLoggedIn()
-                          val loginSuccess = userState is UserAuthState.Success
-                          if (loginSuccess) {
-                            // with supabase
-                            Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT).show()
-                            navigationActions.navigateTo(Screen.PROFILE)
+                          if (emailErrorMessage.isEmpty() && passwordErrorMessage.isEmpty()) {
+                            authenticationViewModel.logInWithEmail(email, password)
+                            authenticationViewModel.isUserLoggedIn()
+                            val loginSuccess = userState is UserAuthState.Success
+                            if (loginSuccess) {
+                              // with supabase
+                              Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT).show()
+                              navigationActions.navigateTo(Screen.PROFILE)
+                            } else {
+                              Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
+                            }
                           } else {
-                            Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
+                            Toast.makeText(
+                                    context, "Invalid email or password.", Toast.LENGTH_SHORT)
+                                .show()
                           }
-                        } else {
-                          Toast.makeText(context, "Invalid email or password.", Toast.LENGTH_SHORT)
+                        },
+                        testTag = SignInScreen.SIGN_IN_BUTTON,
+                    )
+
+                    // Or continue with text
+                    AuthSecondInstruction(
+                        text = "Or continue with",
+                        testTag = SignInScreen.CONTINUE_WITH_TEXT,
+                    )
+
+                    // Google sign in button
+                    GoogleButton(
+                        onClick = {
+                          Toast.makeText(
+                                  context,
+                                  "Use other login method for now, thanks!",
+                                  Toast.LENGTH_SHORT,
+                              )
                               .show()
-                        }
-                      },
-                      testTag = SignInScreen.SIGN_IN_BUTTON,
-                  )
-
-                  // Or continue with text
-                  AuthSecondInstruction(
-                      text = "Or continue with",
-                      testTag = SignInScreen.CONTINUE_WITH_TEXT,
-                  )
-
-                  // Google sign in button
-                  GoogleButton(
-                      onClick = {
-                        Toast.makeText(
-                                context,
-                                "Use other login method for now, thanks!",
-                                Toast.LENGTH_SHORT,
-                            )
-                            .show()
-                      },
-                      testTag = SignInScreen.GOOGLE_BUTTON,
-                  )
+                        },
+                        testTag = SignInScreen.GOOGLE_BUTTON,
+                    )
+                  }
                 }
-              }
-          Row(modifier = Modifier) {
-            Text("Not registered yet? ")
-            Text(
-                text = "Sign up here!",
-                modifier =
-                    Modifier.clickable { navigationActions.navigateTo(Screen.SIGN_UP) }
-                        .testTag(SignInScreen.NOT_REGISTERED_BUTTON),
-                color = Color.Blue,
-            )
+          }
+
+          item {
+            Row(modifier = Modifier.fillMaxWidth().wrapContentHeight()) {
+              Text(text = "Not registered yet? ", style = MaterialTheme.typography.bodyMedium)
+              Text(
+                  text = "Sign up here!",
+                  modifier =
+                      Modifier.clickable { navigationActions.navigateTo(Screen.SIGN_UP) }
+                          .testTag(SignInScreen.NOT_REGISTERED_BUTTON),
+                  color = Color.Blue,
+                  style = MaterialTheme.typography.bodyMedium)
+            }
           }
         }
       },
@@ -224,7 +243,7 @@ fun GoogleButton(onClick: () -> Unit, modifier: Modifier = Modifier, testTag: St
       onClick = onClick,
       colors = ButtonDefaults.buttonColors(containerColor = Color.White),
       shape = RoundedCornerShape(50),
-      border = BorderStroke(1.dp, Color.LightGray),
+      border = BorderStroke(MaterialTheme.dimens.borderLine, Color.LightGray),
   ) {
     Row(
         verticalAlignment = Alignment.CenterVertically,
@@ -233,9 +252,9 @@ fun GoogleButton(onClick: () -> Unit, modifier: Modifier = Modifier, testTag: St
       Image(
           painter = painterResource(id = R.drawable.google_logo),
           contentDescription = "Google Logo",
-          modifier = Modifier.size(24.dp),
+          modifier = Modifier.size(MaterialTheme.dimens.iconSize),
       )
-      Spacer(modifier = Modifier.size(8.dp))
+      Spacer(modifier = Modifier.size(MaterialTheme.dimens.small2))
       Text(
           text = "Sign in with Google",
           color = Color.Black,
diff --git a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
index b9604c741..3a0c207f9 100644
--- a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
+++ b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
@@ -6,6 +6,8 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.layout.wrapContentSize
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
@@ -19,19 +21,22 @@ import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.focus.onFocusEvent
 import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.testTag
-import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.input.PasswordVisualTransformation
 import androidx.compose.ui.text.input.VisualTransformation
 import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import com.android.periodpals.ui.theme.Purple40
+import com.android.periodpals.ui.theme.dimens
 
 /**
  * A composable that displays a graded background with [gradeFrom] and [gradeTo] colors and
@@ -39,29 +44,21 @@ import com.android.periodpals.ui.theme.Purple40
  */
 @Composable
 fun GradedBackground(gradeFrom: Color, gradeTo: Color, background: Color, testTag: String) {
-  Box(modifier = Modifier.fillMaxSize().background(Color.Transparent).testTag(testTag)) {
+  Box(modifier = Modifier.fillMaxSize().background(background).testTag(testTag)) {
     Canvas(modifier = Modifier.fillMaxSize()) {
       val gradientBrush =
           Brush.verticalGradient(
-              colors = listOf(gradeFrom, gradeTo), startY = 0f, endY = size.minDimension * 3 / 2)
+              colors = listOf(gradeFrom, gradeTo), startY = 0f, endY = size.height * 2 / 3)
 
-      drawRect(
-          color = background,
-          topLeft = Offset(0f, size.minDimension),
-          size = Size(size.width, size.height - size.minDimension))
-
-      drawRect(
-          brush = gradientBrush,
-          topLeft = Offset((size.width - size.minDimension) / 2, 0f),
-          size = Size(size.width, size.minDimension))
+      drawRect(brush = gradientBrush, size = Size(size.width, size.height / 2))
 
       drawArc(
           brush = gradientBrush,
           startAngle = 0f,
           sweepAngle = 180f,
           useCenter = true,
-          topLeft = Offset(0f, size.minDimension / 2),
-          size = Size(size.width, size.minDimension))
+          topLeft = Offset(0f, size.height / 3),
+          size = Size(size.width, size.height / 3))
     }
   }
 }
@@ -73,13 +70,15 @@ fun GradedBackground(gradeFrom: Color, gradeTo: Color, background: Color, testTa
 @Composable
 fun AuthWelcomeText(text: String, color: Color, testTag: String) {
   Text(
-      modifier = Modifier.fillMaxWidth().padding(vertical = 16.dp).testTag(testTag),
+      modifier =
+          Modifier.fillMaxWidth()
+              .wrapContentHeight()
+              .padding(MaterialTheme.dimens.small3)
+              .testTag(testTag),
       text = text,
       textAlign = TextAlign.Center,
       color = color,
-      style =
-          MaterialTheme.typography.headlineLarge.copy(
-              fontSize = 40.sp, lineHeight = 64.sp, fontWeight = FontWeight.SemiBold))
+      style = MaterialTheme.typography.headlineLarge)
 }
 
 /**
@@ -88,10 +87,10 @@ fun AuthWelcomeText(text: String, color: Color, testTag: String) {
 @Composable
 fun AuthInstruction(text: String, testTag: String) {
   Text(
-      modifier = Modifier.testTag(testTag),
+      modifier = Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag),
       text = text,
-      style =
-          MaterialTheme.typography.bodyLarge.copy(fontSize = 20.sp, fontWeight = FontWeight.Medium))
+      textAlign = TextAlign.Center,
+      style = MaterialTheme.typography.bodyLarge)
 }
 
 /**
@@ -101,9 +100,9 @@ fun AuthInstruction(text: String, testTag: String) {
 @Composable
 fun AuthSecondInstruction(text: String, testTag: String) {
   Text(
-      modifier = Modifier.testTag(testTag),
-      text = text,
-      style = MaterialTheme.typography.bodyLarge.copy(fontWeight = FontWeight.Medium))
+      modifier = Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag), text = text,
+      textAlign = TextAlign.Center,
+      style = MaterialTheme.typography.bodyLarge)
 }
 
 /**
@@ -111,11 +110,23 @@ fun AuthSecondInstruction(text: String, testTag: String) {
  */
 @Composable
 fun AuthEmailInput(email: String, onEmailChange: (String) -> Unit, testTag: String) {
+  var isFocused by remember { mutableStateOf(false) }
+
   OutlinedTextField(
-      modifier = Modifier.fillMaxWidth().wrapContentSize().testTag(testTag),
+      modifier =
+          Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag).onFocusEvent { focusState ->
+            isFocused = focusState.isFocused
+          },
       value = email,
       onValueChange = onEmailChange,
-      label = { Text("Email") })
+      textStyle = MaterialTheme.typography.labelMedium,
+      label = {
+        Text(
+            text = "Email",
+            style =
+                if (isFocused || email.isNotEmpty()) MaterialTheme.typography.labelSmall
+                else MaterialTheme.typography.labelMedium)
+      })
 }
 
 /**
@@ -131,11 +142,23 @@ fun AuthPasswordInput(
     testTag: String,
     visibilityTestTag: String
 ) {
+  var isFocused by remember { mutableStateOf(false) }
+
   OutlinedTextField(
-      modifier = Modifier.fillMaxWidth().testTag(testTag),
+      modifier =
+          Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag).onFocusEvent { focusState ->
+            isFocused = focusState.isFocused
+          },
       value = password,
       onValueChange = onPasswordChange,
-      label = { Text("Password") },
+      textStyle = MaterialTheme.typography.labelMedium,
+      label = {
+        Text(
+            "Password",
+            style =
+                if (isFocused || password.isNotEmpty()) MaterialTheme.typography.labelSmall
+                else MaterialTheme.typography.labelMedium)
+      },
       visualTransformation =
           if (passwordVisible) VisualTransformation.None else PasswordVisualTransformation(),
       trailingIcon = {
@@ -144,7 +167,8 @@ fun AuthPasswordInput(
             onClick = onPasswordVisibilityChange, modifier = Modifier.testTag(visibilityTestTag)) {
               Icon(
                   imageVector = image,
-                  contentDescription = if (passwordVisible) "Hide password" else "Show password")
+                  contentDescription = if (passwordVisible) "Hide password" else "Show password",
+                  modifier = Modifier.size(MaterialTheme.dimens.iconSize))
             }
       })
 }
@@ -160,6 +184,6 @@ fun AuthButton(text: String, onClick: () -> Unit, testTag: String) {
       onClick = onClick,
       colors = ButtonDefaults.buttonColors(containerColor = Purple40),
       shape = RoundedCornerShape(50)) {
-        Text(text = text, color = Color.White, fontSize = 16.sp, fontWeight = FontWeight.Medium)
+        Text(text = text, color = Color.White, style = MaterialTheme.typography.bodyMedium)
       }
 }

From ba1a41eab6af746ba2f4878da39fa52891691a1a Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 23:09:48 +0100
Subject: [PATCH 11/23] style: ktfmt format

---
 .../com/android/periodpals/ui/authentication/SignIn.kt     | 7 +++++--
 .../com/android/periodpals/ui/components/AuthComponents.kt | 3 ++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
index b0f04d1b2..b3397aced 100644
--- a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
+++ b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
@@ -106,10 +106,13 @@ fun SignInScreen(
           item {
             Box(
                 modifier =
-                    Modifier.fillMaxWidth().wrapContentHeight()
+                    Modifier.fillMaxWidth()
+                        .wrapContentHeight()
                         .border(MaterialTheme.dimens.borderLine, Color.Gray, RectangleShape)
                         .background(Color.White)
-                        .padding(horizontal = MaterialTheme.dimens.medium1, vertical = MaterialTheme.dimens.small3)) {
+                        .padding(
+                            horizontal = MaterialTheme.dimens.medium1,
+                            vertical = MaterialTheme.dimens.small3)) {
                   Column(
                       modifier = Modifier.fillMaxWidth().wrapContentHeight(),
                       horizontalAlignment = Alignment.CenterHorizontally,
diff --git a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
index 3a0c207f9..5ea9023df 100644
--- a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
+++ b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
@@ -100,7 +100,8 @@ fun AuthInstruction(text: String, testTag: String) {
 @Composable
 fun AuthSecondInstruction(text: String, testTag: String) {
   Text(
-      modifier = Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag), text = text,
+      modifier = Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag),
+      text = text,
       textAlign = TextAlign.Center,
       style = MaterialTheme.typography.bodyLarge)
 }

From 9fd3548a0419a452c2c8e19cb2d39e8d8d295657 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 23:31:51 +0100
Subject: [PATCH 12/23] feat: adapt layout for compact S and M screens

- Modified padding and typography for better display on compact S screens.
- Adjusted typography for `ErrorMessage` to improve readability.
---
 .../periodpals/ui/authentication/SignIn.kt    | 23 ++++++-----
 .../ui/components/AuthComponents.kt           |  1 -
 .../ui/components/ErrorComponent.kt           |  2 +-
 .../com/android/periodpals/ui/theme/Dimens.kt |  9 ++--
 .../com/android/periodpals/ui/theme/Type.kt   | 41 ++++++++++---------
 5 files changed, 39 insertions(+), 37 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
index b3397aced..b2d015ad7 100644
--- a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
+++ b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
@@ -199,16 +199,19 @@ fun SignInScreen(
           }
 
           item {
-            Row(modifier = Modifier.fillMaxWidth().wrapContentHeight()) {
-              Text(text = "Not registered yet? ", style = MaterialTheme.typography.bodyMedium)
-              Text(
-                  text = "Sign up here!",
-                  modifier =
-                      Modifier.clickable { navigationActions.navigateTo(Screen.SIGN_UP) }
-                          .testTag(SignInScreen.NOT_REGISTERED_BUTTON),
-                  color = Color.Blue,
-                  style = MaterialTheme.typography.bodyMedium)
-            }
+            Row(
+                modifier = Modifier.fillMaxWidth().wrapContentHeight(),
+                horizontalArrangement = Arrangement.Center,
+                verticalAlignment = Alignment.CenterVertically) {
+                  Text(text = "Not registered yet? ", style = MaterialTheme.typography.bodyMedium)
+                  Text(
+                      text = "Sign up here!",
+                      modifier =
+                          Modifier.clickable { navigationActions.navigateTo(Screen.SIGN_UP) }
+                              .testTag(SignInScreen.NOT_REGISTERED_BUTTON),
+                      color = Color.Blue,
+                      style = MaterialTheme.typography.bodyMedium)
+                }
           }
         }
       },
diff --git a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
index 5ea9023df..17cc0c855 100644
--- a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
+++ b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
@@ -73,7 +73,6 @@ fun AuthWelcomeText(text: String, color: Color, testTag: String) {
       modifier =
           Modifier.fillMaxWidth()
               .wrapContentHeight()
-              .padding(MaterialTheme.dimens.small3)
               .testTag(testTag),
       text = text,
       textAlign = TextAlign.Center,
diff --git a/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt b/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt
index ea6bfc863..a50d8f59e 100644
--- a/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt
+++ b/app/src/main/java/com/android/periodpals/ui/components/ErrorComponent.kt
@@ -20,5 +20,5 @@ fun ErrorText(message: String, testTag: String) {
       text = message,
       color = Color.Red,
       textAlign = TextAlign.Start,
-      style = MaterialTheme.typography.labelLarge)
+      style = MaterialTheme.typography.labelMedium)
 }
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
index a31baa0d1..903021f25 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
@@ -28,14 +28,13 @@ data class Dimens(
 // Width <= 360dp
 val CompactSmallDimens =
     Dimens(
-        small1 = 5.dp,
+        small1 = 3.dp,
         small2 = 6.dp,
-        small3 = 8.dp,
-        medium1 = 15.dp,
-        medium2 = 26.dp,
+        small3 = 12.dp,
+        medium1 = 18.dp,
+        medium2 = 24.dp,
         medium3 = 30.dp,
         large = 45.dp,
-        buttonHeight = 30.dp,
         //    logoSize = 36.dp
     )
 
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
index fe7457026..2f66d8f02 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
@@ -53,25 +53,38 @@ val CompactSmallTypography =
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 22.sp),
-        headlineMedium =
+                fontSize = 32.sp,
+                lineHeight = 48.sp),
+        titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Bold,
+                fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
-        titleMedium =
+                fontSize = 10.sp),
+        bodyLarge =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.SemiBold,
+                fontStyle = FontStyle.Normal,
+                fontSize = 18.sp),
+        bodyMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 10.sp),
+                fontSize = 16.sp),
         labelMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,
                 fontStyle = FontStyle.Normal,
-                fontSize = 10.sp))
+                fontSize = 14.sp),
+        labelSmall =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Normal,
+                fontStyle = FontStyle.Normal,
+                fontSize = 12.sp))
 
 val CompactMediumTypography =
     Typography(
@@ -81,13 +94,7 @@ val CompactMediumTypography =
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
                 fontSize = 40.sp,
-                lineHeight = 64.sp),
-        headlineMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Bold,
-                fontStyle = FontStyle.Normal,
-                fontSize = 22.sp),
+                lineHeight = 60.sp),
         titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
@@ -106,12 +113,6 @@ val CompactMediumTypography =
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
                 fontSize = 18.sp),
-        labelLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
         labelMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,

From aa73c01114d1c125afedc5457087fdcf054f2686 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Tue, 5 Nov 2024 23:32:37 +0100
Subject: [PATCH 13/23] style: ktfmt format

---
 .../com/android/periodpals/ui/components/AuthComponents.kt  | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
index 17cc0c855..b6cfbf3c8 100644
--- a/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
+++ b/app/src/main/java/com/android/periodpals/ui/components/AuthComponents.kt
@@ -5,7 +5,6 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.layout.wrapContentSize
@@ -70,10 +69,7 @@ fun GradedBackground(gradeFrom: Color, gradeTo: Color, background: Color, testTa
 @Composable
 fun AuthWelcomeText(text: String, color: Color, testTag: String) {
   Text(
-      modifier =
-          Modifier.fillMaxWidth()
-              .wrapContentHeight()
-              .testTag(testTag),
+      modifier = Modifier.fillMaxWidth().wrapContentHeight().testTag(testTag),
       text = text,
       textAlign = TextAlign.Center,
       color = color,

From 48c3e8912a421187b3166655cdf1f5e9cbf22112 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Wed, 6 Nov 2024 00:11:47 +0100
Subject: [PATCH 14/23] feat: adapt layout for compact S, M, L, and medium
 screens

- Adjusted padding and typography for improved display on compact L and medium screens.
---
 .../com/android/periodpals/ui/theme/Dimens.kt | 24 ++++-----
 .../com/android/periodpals/ui/theme/Theme.kt  |  2 +-
 .../com/android/periodpals/ui/theme/Type.kt   | 52 ++++++++++++++-----
 3 files changed, 52 insertions(+), 26 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
index 903021f25..a300f90f6 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
@@ -51,23 +51,23 @@ val CompactMediumDimens =
 
 val CompactLargeDimens =
     Dimens(
-        small1 = 10.dp,
-        small2 = 15.dp,
+        small1 = 5.dp,
+        small2 = 10.dp,
         small3 = 20.dp,
         medium1 = 30.dp,
-        medium2 = 36.dp,
-        medium3 = 40.dp,
-        large = 80.dp)
+        medium2 = 40.dp,
+        medium3 = 50.dp,
+        large = 65.dp)
 
 val MediumDimens =
     Dimens(
-        small1 = 10.dp,
-        small2 = 15.dp,
-        small3 = 20.dp,
-        medium1 = 30.dp,
-        medium2 = 36.dp,
-        medium3 = 40.dp,
-        large = 110.dp,
+        small1 = 8.dp,
+        small2 = 16.dp,
+        small3 = 32.dp,
+        medium1 = 48.dp,
+        medium2 = 64.dp,
+        medium3 = 80.dp,
+        large = 120.dp,
         //    logoSize = 55.dp
     )
 
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index d4750feac..b3c2f37a7 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -97,7 +97,7 @@ private val DarkColorScheme =
     )
 
 private const val COMPACT_S = 360
-private const val COMPACT_M = 500
+private const val COMPACT_M = 420
 
 @OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
 @Composable
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
index 2f66d8f02..62d050308 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
@@ -133,25 +133,38 @@ val CompactLargeTypography =
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 32.sp),
-        headlineMedium =
+                fontSize = 48.sp,
+                lineHeight = 72.sp),
+        titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Bold,
+                fontWeight = FontWeight.Medium,
+                fontStyle = FontStyle.Normal,
+                fontSize = 14.sp),
+        bodyLarge =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.SemiBold,
                 fontStyle = FontStyle.Normal,
                 fontSize = 24.sp),
-        titleMedium =
+        bodyMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 14.sp),
+                fontSize = 20.sp),
         labelMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,
                 fontStyle = FontStyle.Normal,
-                fontSize = 14.sp))
+                fontSize = 18.sp),
+        labelSmall =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Normal,
+                fontStyle = FontStyle.Normal,
+                fontSize = 16.sp))
 
 val MediumTypography =
     Typography(
@@ -160,25 +173,38 @@ val MediumTypography =
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 38.sp),
-        headlineMedium =
+                fontSize = 56.sp,
+                lineHeight = 84.sp),
+        titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Bold,
+                fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 30.sp),
-        titleMedium =
+                fontSize = 16.sp),
+        bodyLarge =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.SemiBold,
+                fontStyle = FontStyle.Normal,
+                fontSize = 24.sp),
+        bodyMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
+                fontSize = 22.sp),
         labelMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,
                 fontStyle = FontStyle.Normal,
-                fontSize = 16.sp))
+                fontSize = 20.sp),
+        labelSmall =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Normal,
+                fontStyle = FontStyle.Normal,
+                fontSize = 18.sp))
 
 val ExpandedTypography =
     Typography(

From 5b520233f9a7d4b910f313d2b170cdee6da45a67 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Wed, 6 Nov 2024 00:30:43 +0100
Subject: [PATCH 15/23] feat: adapt layout for all screen sizes

- Adjusted padding and typography for better display on extended screens.
---
 .../com/android/periodpals/ui/theme/Dimens.kt | 14 +++++------
 .../com/android/periodpals/ui/theme/Type.kt   | 25 ++++++++++++++-----
 2 files changed, 26 insertions(+), 13 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
index a300f90f6..15ac4cc13 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
@@ -73,12 +73,12 @@ val MediumDimens =
 
 val ExpandedDimens =
     Dimens(
-        small1 = 15.dp,
-        small2 = 20.dp,
-        small3 = 25.dp,
-        medium1 = 35.dp,
-        medium2 = 30.dp,
-        medium3 = 45.dp,
-        large = 130.dp,
+        small1 = 9.dp,
+        small2 = 18.dp,
+        small3 = 36.dp,
+        medium1 = 54.dp,
+        medium2 = 72.dp,
+        medium3 = 90.dp,
+        large = 135.dp,
         //    logoSize = 72.dp
     )
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
index 62d050308..655a66f05 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
@@ -213,20 +213,33 @@ val ExpandedTypography =
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Black,
                 fontStyle = FontStyle.Normal,
-                fontSize = 42.sp),
-        headlineMedium =
+                fontSize = 64.sp,
+                lineHeight = 96.sp),
+        titleMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Bold,
+                fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 34.sp),
-        titleMedium =
+                fontSize = 18.sp),
+        bodyLarge =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.SemiBold,
+                fontStyle = FontStyle.Normal,
+                fontSize = 24.sp),
+        bodyMedium =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Medium,
                 fontStyle = FontStyle.Normal,
-                fontSize = 18.sp),
+                fontSize = 22.sp),
         labelMedium =
+            TextStyle(
+                fontFamily = Nunito_Sans,
+                fontWeight = FontWeight.Normal,
+                fontStyle = FontStyle.Normal,
+                fontSize = 20.sp),
+        labelSmall =
             TextStyle(
                 fontFamily = Nunito_Sans,
                 fontWeight = FontWeight.Normal,

From f845e44b777cc016b143f7f4006bd51d48244b8a Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Wed, 6 Nov 2024 14:13:10 +0100
Subject: [PATCH 16/23] refactor: remove `dynamicColor` parameter from
 `PeriodPalsAppTheme`

---
 app/src/main/java/com/android/periodpals/ui/theme/Theme.kt | 2 --
 1 file changed, 2 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index b3c2f37a7..a403d9217 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -103,8 +103,6 @@ private const val COMPACT_M = 420
 @Composable
 fun PeriodPalsAppTheme(
     darkTheme: Boolean = isSystemInDarkTheme(),
-    // Dynamic color is available on Android 12+
-    dynamicColor: Boolean = true,
     activity: Activity = LocalContext.current as MainActivity,
     content: @Composable () -> Unit
 ) {

From b32f6f6c95a8ce304f1a21e5b9e1f016ff7bdb1d Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Wed, 6 Nov 2024 14:18:56 +0100
Subject: [PATCH 17/23] refactor: reduce code duplication in `Type.kt`

- Created a `createTypography` function to generate `Typography` instances.
- Used the `createTypography` function to define different typography styles.
- Centralized typography creation logic to reduce duplication.
---
 .../com/android/periodpals/ui/theme/Type.kt   | 337 ++++++------------
 1 file changed, 107 insertions(+), 230 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
index 655a66f05..868fd5f34 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
@@ -10,238 +10,115 @@ import androidx.compose.ui.unit.sp
 import com.android.periodpals.R
 
 // Nunuto Sans font family
-val Nunito_Sans =
-    FontFamily(
-        listOf(
-            Font(resId = R.font.nunito_sans_black, weight = FontWeight.Black),
-            Font(
-                resId = R.font.nunito_sans_black_italic,
-                weight = FontWeight.Black,
-                style = FontStyle.Italic),
-            Font(resId = R.font.nunito_sans_bold, weight = FontWeight.Bold),
-            Font(
-                resId = R.font.nunito_sans_bold_italic,
-                weight = FontWeight.Bold,
-                style = FontStyle.Italic),
-            Font(resId = R.font.nunito_sans_extra_bold, weight = FontWeight.ExtraBold),
-            Font(
-                resId = R.font.nunito_sans_extra_bold_italic,
-                weight = FontWeight.ExtraBold,
-                style = FontStyle.Italic),
-            Font(resId = R.font.nunito_sans_extra_light, weight = FontWeight.ExtraLight),
-            Font(
-                resId = R.font.nunito_sans_extra_light_italic,
-                weight = FontWeight.ExtraLight,
-                style = FontStyle.Italic),
-            Font(resId = R.font.nunito_sans_italic, style = FontStyle.Italic),
-            Font(resId = R.font.nunito_sans_light, weight = FontWeight.Light),
-            Font(
-                resId = R.font.nunito_sans_light_italic,
-                weight = FontWeight.Light,
-                style = FontStyle.Italic),
-            Font(resId = R.font.nunito_sans_regular),
-            Font(resId = R.font.nunito_sans_semi_bold, weight = FontWeight.SemiBold),
-            Font(
-                resId = R.font.nunito_sans_semi_bold_italic,
-                weight = FontWeight.SemiBold,
-                style = FontStyle.Italic)))
+val Nunito_Sans = FontFamily(
+    listOf(
+        Font(resId = R.font.nunito_sans_black, weight = FontWeight.Black),
+        Font(resId = R.font.nunito_sans_black_italic, weight = FontWeight.Black, style = FontStyle.Italic),
+        Font(resId = R.font.nunito_sans_bold, weight = FontWeight.Bold),
+        Font(resId = R.font.nunito_sans_bold_italic, weight = FontWeight.Bold, style = FontStyle.Italic),
+        Font(resId = R.font.nunito_sans_extra_bold, weight = FontWeight.ExtraBold),
+        Font(resId = R.font.nunito_sans_extra_bold_italic, weight = FontWeight.ExtraBold, style = FontStyle.Italic),
+        Font(resId = R.font.nunito_sans_extra_light, weight = FontWeight.ExtraLight),
+        Font(resId = R.font.nunito_sans_extra_light_italic, weight = FontWeight.ExtraLight, style = FontStyle.Italic),
+        Font(resId = R.font.nunito_sans_italic, style = FontStyle.Italic),
+        Font(resId = R.font.nunito_sans_light, weight = FontWeight.Light),
+        Font(resId = R.font.nunito_sans_light_italic, weight = FontWeight.Light, style = FontStyle.Italic),
+        Font(resId = R.font.nunito_sans_regular),
+        Font(resId = R.font.nunito_sans_semi_bold, weight = FontWeight.SemiBold),
+        Font(resId = R.font.nunito_sans_semi_bold_italic, weight = FontWeight.SemiBold, style = FontStyle.Italic)
+    )
+)
 
-val CompactSmallTypography =
-    Typography(
-        headlineLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Black,
-                fontStyle = FontStyle.Normal,
-                fontSize = 32.sp,
-                lineHeight = 48.sp),
-        titleMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 10.sp),
-        bodyLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.SemiBold,
-                fontStyle = FontStyle.Normal,
-                fontSize = 18.sp),
-        bodyMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
-        labelMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 14.sp),
-        labelSmall =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 12.sp))
+fun createTypography(
+    headlineLargeSize: Int,
+    titleMediumSize: Int,
+    bodyLargeSize: Int,
+    bodyMediumSize: Int,
+    labelMediumSize: Int,
+    labelSmallSize: Int
+): Typography {
+    return Typography(
+        headlineLarge = TextStyle(
+            fontFamily = Nunito_Sans,
+            fontWeight = FontWeight.Black,
+            fontStyle = FontStyle.Normal,
+            fontSize = headlineLargeSize.sp,
+            lineHeight = (headlineLargeSize * 1.5).sp
+        ),
+        titleMedium = TextStyle(
+            fontFamily = Nunito_Sans,
+            fontWeight = FontWeight.Medium,
+            fontStyle = FontStyle.Normal,
+            fontSize = titleMediumSize.sp
+        ),
+        bodyLarge = TextStyle(
+            fontFamily = Nunito_Sans,
+            fontWeight = FontWeight.SemiBold,
+            fontStyle = FontStyle.Normal,
+            fontSize = bodyLargeSize.sp
+        ),
+        bodyMedium = TextStyle(
+            fontFamily = Nunito_Sans,
+            fontWeight = FontWeight.Medium,
+            fontStyle = FontStyle.Normal,
+            fontSize = bodyMediumSize.sp
+        ),
+        labelMedium = TextStyle(
+            fontFamily = Nunito_Sans,
+            fontWeight = FontWeight.Normal,
+            fontStyle = FontStyle.Normal,
+            fontSize = labelMediumSize.sp
+        ),
+        labelSmall = TextStyle(
+            fontFamily = Nunito_Sans,
+            fontWeight = FontWeight.Normal,
+            fontStyle = FontStyle.Normal,
+            fontSize = labelSmallSize.sp
+        )
+    )
+}
 
-val CompactMediumTypography =
-    Typography(
-        headlineLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Black,
-                fontStyle = FontStyle.Normal,
-                fontSize = 40.sp,
-                lineHeight = 60.sp),
-        titleMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 14.sp),
-        bodyLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.SemiBold,
-                fontStyle = FontStyle.Normal,
-                fontSize = 20.sp),
-        bodyMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 18.sp),
-        labelMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
-        labelSmall =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 14.sp))
+val CompactSmallTypography = createTypography(
+    headlineLargeSize = 32,
+    titleMediumSize = 10,
+    bodyLargeSize = 18,
+    bodyMediumSize = 16,
+    labelMediumSize = 14,
+    labelSmallSize = 12
+)
 
-val CompactLargeTypography =
-    Typography(
-        headlineLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Black,
-                fontStyle = FontStyle.Normal,
-                fontSize = 48.sp,
-                lineHeight = 72.sp),
-        titleMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 14.sp),
-        bodyLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.SemiBold,
-                fontStyle = FontStyle.Normal,
-                fontSize = 24.sp),
-        bodyMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 20.sp),
-        labelMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 18.sp),
-        labelSmall =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 16.sp))
+val CompactMediumTypography = createTypography(
+    headlineLargeSize = 40,
+    titleMediumSize = 14,
+    bodyLargeSize = 20,
+    bodyMediumSize = 18,
+    labelMediumSize = 16,
+    labelSmallSize = 14
+)
 
-val MediumTypography =
-    Typography(
-        headlineLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Black,
-                fontStyle = FontStyle.Normal,
-                fontSize = 56.sp,
-                lineHeight = 84.sp),
-        titleMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 16.sp),
-        bodyLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.SemiBold,
-                fontStyle = FontStyle.Normal,
-                fontSize = 24.sp),
-        bodyMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 22.sp),
-        labelMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 20.sp),
-        labelSmall =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 18.sp))
+val CompactLargeTypography = createTypography(
+    headlineLargeSize = 48,
+    titleMediumSize = 14,
+    bodyLargeSize = 24,
+    bodyMediumSize = 20,
+    labelMediumSize = 18,
+    labelSmallSize = 16
+)
 
-val ExpandedTypography =
-    Typography(
-        headlineLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Black,
-                fontStyle = FontStyle.Normal,
-                fontSize = 64.sp,
-                lineHeight = 96.sp),
-        titleMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 18.sp),
-        bodyLarge =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.SemiBold,
-                fontStyle = FontStyle.Normal,
-                fontSize = 24.sp),
-        bodyMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Medium,
-                fontStyle = FontStyle.Normal,
-                fontSize = 22.sp),
-        labelMedium =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 20.sp),
-        labelSmall =
-            TextStyle(
-                fontFamily = Nunito_Sans,
-                fontWeight = FontWeight.Normal,
-                fontStyle = FontStyle.Normal,
-                fontSize = 18.sp))
+val MediumTypography = createTypography(
+    headlineLargeSize = 56,
+    titleMediumSize = 16,
+    bodyLargeSize = 24,
+    bodyMediumSize = 22,
+    labelMediumSize = 20,
+    labelSmallSize = 18
+)
+
+val ExpandedTypography = createTypography(
+    headlineLargeSize = 64,
+    titleMediumSize = 18,
+    bodyLargeSize = 24,
+    bodyMediumSize = 22,
+    labelMediumSize = 20,
+    labelSmallSize = 18
+)
\ No newline at end of file

From 65c5dcac54c9418e8ccbe49d040220734c5d7120 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Wed, 6 Nov 2024 21:03:04 +0100
Subject: [PATCH 18/23] style: ktfmt format

---
 .../com/android/periodpals/ui/theme/Type.kt   | 210 ++++++++++--------
 1 file changed, 113 insertions(+), 97 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
index 868fd5f34..6c173d410 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Type.kt
@@ -10,24 +10,41 @@ import androidx.compose.ui.unit.sp
 import com.android.periodpals.R
 
 // Nunuto Sans font family
-val Nunito_Sans = FontFamily(
-    listOf(
-        Font(resId = R.font.nunito_sans_black, weight = FontWeight.Black),
-        Font(resId = R.font.nunito_sans_black_italic, weight = FontWeight.Black, style = FontStyle.Italic),
-        Font(resId = R.font.nunito_sans_bold, weight = FontWeight.Bold),
-        Font(resId = R.font.nunito_sans_bold_italic, weight = FontWeight.Bold, style = FontStyle.Italic),
-        Font(resId = R.font.nunito_sans_extra_bold, weight = FontWeight.ExtraBold),
-        Font(resId = R.font.nunito_sans_extra_bold_italic, weight = FontWeight.ExtraBold, style = FontStyle.Italic),
-        Font(resId = R.font.nunito_sans_extra_light, weight = FontWeight.ExtraLight),
-        Font(resId = R.font.nunito_sans_extra_light_italic, weight = FontWeight.ExtraLight, style = FontStyle.Italic),
-        Font(resId = R.font.nunito_sans_italic, style = FontStyle.Italic),
-        Font(resId = R.font.nunito_sans_light, weight = FontWeight.Light),
-        Font(resId = R.font.nunito_sans_light_italic, weight = FontWeight.Light, style = FontStyle.Italic),
-        Font(resId = R.font.nunito_sans_regular),
-        Font(resId = R.font.nunito_sans_semi_bold, weight = FontWeight.SemiBold),
-        Font(resId = R.font.nunito_sans_semi_bold_italic, weight = FontWeight.SemiBold, style = FontStyle.Italic)
-    )
-)
+val Nunito_Sans =
+    FontFamily(
+        listOf(
+            Font(resId = R.font.nunito_sans_black, weight = FontWeight.Black),
+            Font(
+                resId = R.font.nunito_sans_black_italic,
+                weight = FontWeight.Black,
+                style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_bold, weight = FontWeight.Bold),
+            Font(
+                resId = R.font.nunito_sans_bold_italic,
+                weight = FontWeight.Bold,
+                style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_extra_bold, weight = FontWeight.ExtraBold),
+            Font(
+                resId = R.font.nunito_sans_extra_bold_italic,
+                weight = FontWeight.ExtraBold,
+                style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_extra_light, weight = FontWeight.ExtraLight),
+            Font(
+                resId = R.font.nunito_sans_extra_light_italic,
+                weight = FontWeight.ExtraLight,
+                style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_italic, style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_light, weight = FontWeight.Light),
+            Font(
+                resId = R.font.nunito_sans_light_italic,
+                weight = FontWeight.Light,
+                style = FontStyle.Italic),
+            Font(resId = R.font.nunito_sans_regular),
+            Font(resId = R.font.nunito_sans_semi_bold, weight = FontWeight.SemiBold),
+            Font(
+                resId = R.font.nunito_sans_semi_bold_italic,
+                weight = FontWeight.SemiBold,
+                style = FontStyle.Italic)))
 
 fun createTypography(
     headlineLargeSize: Int,
@@ -37,88 +54,87 @@ fun createTypography(
     labelMediumSize: Int,
     labelSmallSize: Int
 ): Typography {
-    return Typography(
-        headlineLarge = TextStyle(
-            fontFamily = Nunito_Sans,
-            fontWeight = FontWeight.Black,
-            fontStyle = FontStyle.Normal,
-            fontSize = headlineLargeSize.sp,
-            lineHeight = (headlineLargeSize * 1.5).sp
-        ),
-        titleMedium = TextStyle(
-            fontFamily = Nunito_Sans,
-            fontWeight = FontWeight.Medium,
-            fontStyle = FontStyle.Normal,
-            fontSize = titleMediumSize.sp
-        ),
-        bodyLarge = TextStyle(
-            fontFamily = Nunito_Sans,
-            fontWeight = FontWeight.SemiBold,
-            fontStyle = FontStyle.Normal,
-            fontSize = bodyLargeSize.sp
-        ),
-        bodyMedium = TextStyle(
-            fontFamily = Nunito_Sans,
-            fontWeight = FontWeight.Medium,
-            fontStyle = FontStyle.Normal,
-            fontSize = bodyMediumSize.sp
-        ),
-        labelMedium = TextStyle(
-            fontFamily = Nunito_Sans,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            fontSize = labelMediumSize.sp
-        ),
-        labelSmall = TextStyle(
-            fontFamily = Nunito_Sans,
-            fontWeight = FontWeight.Normal,
-            fontStyle = FontStyle.Normal,
-            fontSize = labelSmallSize.sp
-        )
-    )
+  return Typography(
+      headlineLarge =
+          TextStyle(
+              fontFamily = Nunito_Sans,
+              fontWeight = FontWeight.Black,
+              fontStyle = FontStyle.Normal,
+              fontSize = headlineLargeSize.sp,
+              lineHeight = (headlineLargeSize * 1.5).sp),
+      titleMedium =
+          TextStyle(
+              fontFamily = Nunito_Sans,
+              fontWeight = FontWeight.Medium,
+              fontStyle = FontStyle.Normal,
+              fontSize = titleMediumSize.sp),
+      bodyLarge =
+          TextStyle(
+              fontFamily = Nunito_Sans,
+              fontWeight = FontWeight.SemiBold,
+              fontStyle = FontStyle.Normal,
+              fontSize = bodyLargeSize.sp),
+      bodyMedium =
+          TextStyle(
+              fontFamily = Nunito_Sans,
+              fontWeight = FontWeight.Medium,
+              fontStyle = FontStyle.Normal,
+              fontSize = bodyMediumSize.sp),
+      labelMedium =
+          TextStyle(
+              fontFamily = Nunito_Sans,
+              fontWeight = FontWeight.Normal,
+              fontStyle = FontStyle.Normal,
+              fontSize = labelMediumSize.sp),
+      labelSmall =
+          TextStyle(
+              fontFamily = Nunito_Sans,
+              fontWeight = FontWeight.Normal,
+              fontStyle = FontStyle.Normal,
+              fontSize = labelSmallSize.sp))
 }
 
-val CompactSmallTypography = createTypography(
-    headlineLargeSize = 32,
-    titleMediumSize = 10,
-    bodyLargeSize = 18,
-    bodyMediumSize = 16,
-    labelMediumSize = 14,
-    labelSmallSize = 12
-)
+val CompactSmallTypography =
+    createTypography(
+        headlineLargeSize = 32,
+        titleMediumSize = 10,
+        bodyLargeSize = 18,
+        bodyMediumSize = 16,
+        labelMediumSize = 14,
+        labelSmallSize = 12)
 
-val CompactMediumTypography = createTypography(
-    headlineLargeSize = 40,
-    titleMediumSize = 14,
-    bodyLargeSize = 20,
-    bodyMediumSize = 18,
-    labelMediumSize = 16,
-    labelSmallSize = 14
-)
+val CompactMediumTypography =
+    createTypography(
+        headlineLargeSize = 40,
+        titleMediumSize = 14,
+        bodyLargeSize = 20,
+        bodyMediumSize = 18,
+        labelMediumSize = 16,
+        labelSmallSize = 14)
 
-val CompactLargeTypography = createTypography(
-    headlineLargeSize = 48,
-    titleMediumSize = 14,
-    bodyLargeSize = 24,
-    bodyMediumSize = 20,
-    labelMediumSize = 18,
-    labelSmallSize = 16
-)
+val CompactLargeTypography =
+    createTypography(
+        headlineLargeSize = 48,
+        titleMediumSize = 14,
+        bodyLargeSize = 24,
+        bodyMediumSize = 20,
+        labelMediumSize = 18,
+        labelSmallSize = 16)
 
-val MediumTypography = createTypography(
-    headlineLargeSize = 56,
-    titleMediumSize = 16,
-    bodyLargeSize = 24,
-    bodyMediumSize = 22,
-    labelMediumSize = 20,
-    labelSmallSize = 18
-)
+val MediumTypography =
+    createTypography(
+        headlineLargeSize = 56,
+        titleMediumSize = 16,
+        bodyLargeSize = 24,
+        bodyMediumSize = 22,
+        labelMediumSize = 20,
+        labelSmallSize = 18)
 
-val ExpandedTypography = createTypography(
-    headlineLargeSize = 64,
-    titleMediumSize = 18,
-    bodyLargeSize = 24,
-    bodyMediumSize = 22,
-    labelMediumSize = 20,
-    labelSmallSize = 18
-)
\ No newline at end of file
+val ExpandedTypography =
+    createTypography(
+        headlineLargeSize = 64,
+        titleMediumSize = 18,
+        bodyLargeSize = 24,
+        bodyMediumSize = 22,
+        labelMediumSize = 20,
+        labelSmallSize = 18)

From ca28df2a21999ad0bfa7a67c03501ce130aab773 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Thu, 7 Nov 2024 10:38:38 +0100
Subject: [PATCH 19/23] fix: typo

---
 .../periodpals/ui/authentication/SignIn.kt    | 232 +++++++++---------
 1 file changed, 117 insertions(+), 115 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
index b2d015ad7..4b86e471a 100644
--- a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
+++ b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
@@ -91,129 +91,131 @@ fun SignInScreen(
                         vertical = MaterialTheme.dimens.medium3),
             horizontalAlignment = Alignment.CenterHorizontally,
             verticalArrangement =
-                Arrangement.spacedBy(MaterialTheme.dimens.medium1, Alignment.CenterVertically),
-        ) {
-          // Welcome text
-          item {
-            AuthWelcomeText(
-                text = "Welcome to PeriodPals",
-                color = Color.Black,
-                testTag = SignInScreen.TITLE_TEXT,
-            )
-          }
+                Arrangement.spacedBy(MaterialTheme.dimens.medium1, Alignment.CenterVertically)) {
+              // Welcome text
+              item {
+                AuthWelcomeText(
+                    text = "Welcome to PeriodPals",
+                    color = Color.Black,
+                    testTag = SignInScreen.TITLE_TEXT,
+                )
+              }
 
-          // Rectangle with login fields and button
-          item {
-            Box(
-                modifier =
-                    Modifier.fillMaxWidth()
-                        .wrapContentHeight()
-                        .border(MaterialTheme.dimens.borderLine, Color.Gray, RectangleShape)
-                        .background(Color.White)
-                        .padding(
-                            horizontal = MaterialTheme.dimens.medium1,
-                            vertical = MaterialTheme.dimens.small3)) {
-                  Column(
-                      modifier = Modifier.fillMaxWidth().wrapContentHeight(),
-                      horizontalAlignment = Alignment.CenterHorizontally,
-                      verticalArrangement =
-                          Arrangement.spacedBy(
-                              MaterialTheme.dimens.small2, Alignment.CenterVertically),
-                  ) {
-                    // Sign in instruction
-                    AuthInstruction(
-                        text = "Sign in to your account",
-                        testTag = SignInScreen.INSTRUCTION_TEXT,
-                    )
+              // Rectangle with login fields and button
+              item {
+                Box(
+                    modifier =
+                        Modifier.fillMaxWidth()
+                            .wrapContentHeight()
+                            .border(MaterialTheme.dimens.borderLine, Color.Gray, RectangleShape)
+                            .background(Color.White)
+                            .padding(
+                                horizontal = MaterialTheme.dimens.medium1,
+                                vertical = MaterialTheme.dimens.small3)) {
+                      Column(
+                          modifier = Modifier.fillMaxWidth().wrapContentHeight(),
+                          horizontalAlignment = Alignment.CenterHorizontally,
+                          verticalArrangement =
+                              Arrangement.spacedBy(
+                                  MaterialTheme.dimens.small2, Alignment.CenterVertically),
+                      ) {
+                        // Sign in instruction
+                        AuthInstruction(
+                            text = "Sign in to your account",
+                            testTag = SignInScreen.INSTRUCTION_TEXT,
+                        )
 
-                    // Email input and error message
-                    AuthEmailInput(
-                        email = email,
-                        onEmailChange = { email = it },
-                        testTag = SignInScreen.EMAIL_FIELD,
-                    )
-                    if (emailErrorMessage.isNotEmpty()) {
-                      ErrorText(emailErrorMessage, SignInScreen.EMAIL_ERROR_TEXT)
-                    }
+                        // Email input and error message
+                        AuthEmailInput(
+                            email = email,
+                            onEmailChange = { email = it },
+                            testTag = SignInScreen.EMAIL_FIELD,
+                        )
+                        if (emailErrorMessage.isNotEmpty()) {
+                          ErrorText(emailErrorMessage, SignInScreen.EMAIL_ERROR_TEXT)
+                        }
 
-                    // Password input and error message
-                    AuthPasswordInput(
-                        password = password,
-                        onPasswordChange = { password = it },
-                        passwordVisible = passwordVisible,
-                        onPasswordVisibilityChange = { passwordVisible = !passwordVisible },
-                        testTag = SignInScreen.PASSWORD_FIELD,
-                        visibilityTestTag = SignInScreen.PASSWORD_VISIBILITY_BUTTON,
-                    )
-                    if (passwordErrorMessage.isNotEmpty()) {
-                      ErrorText(passwordErrorMessage, SignInScreen.PASSWORD_ERROR_TEXT)
-                    }
+                        // Password input and error message
+                        AuthPasswordInput(
+                            password = password,
+                            onPasswordChange = { password = it },
+                            passwordVisible = passwordVisible,
+                            onPasswordVisibilityChange = { passwordVisible = !passwordVisible },
+                            testTag = SignInScreen.PASSWORD_FIELD,
+                            visibilityTestTag = SignInScreen.PASSWORD_VISIBILITY_BUTTON,
+                        )
+                        if (passwordErrorMessage.isNotEmpty()) {
+                          ErrorText(passwordErrorMessage, SignInScreen.PASSWORD_ERROR_TEXT)
+                        }
 
-                    // Sign in button
-                    AuthButton(
-                        text = "Sign in",
-                        onClick = {
-                          emailErrorMessage = validateEmail(email)
-                          passwordErrorMessage = validatePassword(password)
+                        // Sign in button
+                        AuthButton(
+                            text = "Sign in",
+                            onClick = {
+                              emailErrorMessage = validateEmail(email)
+                              passwordErrorMessage = validatePassword(password)
 
-                          if (emailErrorMessage.isEmpty() && passwordErrorMessage.isEmpty()) {
-                            authenticationViewModel.logInWithEmail(email, password)
-                            authenticationViewModel.isUserLoggedIn()
-                            val loginSuccess = userState is UserAuthState.Success
-                            if (loginSuccess) {
-                              // with supabase
-                              Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT).show()
-                              navigationActions.navigateTo(Screen.PROFILE)
-                            } else {
-                              Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
-                            }
-                          } else {
-                            Toast.makeText(
-                                    context, "Invalid email or password.", Toast.LENGTH_SHORT)
-                                .show()
-                          }
-                        },
-                        testTag = SignInScreen.SIGN_IN_BUTTON,
-                    )
+                              if (emailErrorMessage.isEmpty() && passwordErrorMessage.isEmpty()) {
+                                authenticationViewModel.logInWithEmail(email, password)
+                                authenticationViewModel.isUserLoggedIn()
+                                val loginSuccess = userState is UserAuthState.Success
+                                if (loginSuccess) {
+                                  // with supabase
+                                  Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT)
+                                      .show()
+                                  navigationActions.navigateTo(Screen.PROFILE)
+                                } else {
+                                  Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
+                                }
+                              } else {
+                                Toast.makeText(
+                                        context, "Invalid email or password.", Toast.LENGTH_SHORT)
+                                    .show()
+                              }
+                            },
+                            testTag = SignInScreen.SIGN_IN_BUTTON,
+                        )
 
-                    // Or continue with text
-                    AuthSecondInstruction(
-                        text = "Or continue with",
-                        testTag = SignInScreen.CONTINUE_WITH_TEXT,
-                    )
+                        // Or continue with text
+                        AuthSecondInstruction(
+                            text = "Or continue with",
+                            testTag = SignInScreen.CONTINUE_WITH_TEXT,
+                        )
 
-                    // Google sign in button
-                    GoogleButton(
-                        onClick = {
-                          Toast.makeText(
-                                  context,
-                                  "Use other login method for now, thanks!",
-                                  Toast.LENGTH_SHORT,
-                              )
-                              .show()
-                        },
-                        testTag = SignInScreen.GOOGLE_BUTTON,
-                    )
-                  }
-                }
-          }
+                        // Google sign in button
+                        GoogleButton(
+                            onClick = {
+                              Toast.makeText(
+                                      context,
+                                      "Use other login method for now, thanks!",
+                                      Toast.LENGTH_SHORT,
+                                  )
+                                  .show()
+                            },
+                            testTag = SignInScreen.GOOGLE_BUTTON,
+                        )
+                      }
+                    }
+              }
 
-          item {
-            Row(
-                modifier = Modifier.fillMaxWidth().wrapContentHeight(),
-                horizontalArrangement = Arrangement.Center,
-                verticalAlignment = Alignment.CenterVertically) {
-                  Text(text = "Not registered yet? ", style = MaterialTheme.typography.bodyMedium)
-                  Text(
-                      text = "Sign up here!",
-                      modifier =
-                          Modifier.clickable { navigationActions.navigateTo(Screen.SIGN_UP) }
-                              .testTag(SignInScreen.NOT_REGISTERED_BUTTON),
-                      color = Color.Blue,
-                      style = MaterialTheme.typography.bodyMedium)
-                }
-          }
-        }
+              item {
+                Row(
+                    modifier = Modifier.fillMaxWidth().wrapContentHeight(),
+                    horizontalArrangement = Arrangement.Center,
+                    verticalAlignment = Alignment.CenterVertically) {
+                      Text(
+                          text = "Not registered yet? ",
+                          style = MaterialTheme.typography.bodyMedium)
+                      Text(
+                          text = "Sign up here!",
+                          modifier =
+                              Modifier.clickable { navigationActions.navigateTo(Screen.SIGN_UP) }
+                                  .testTag(SignInScreen.NOT_REGISTERED_BUTTON),
+                          color = Color.Blue,
+                          style = MaterialTheme.typography.bodyMedium)
+                    }
+              }
+            }
       },
   )
 }

From 0352aba32c580aa5ff84ed3c4418d497bf5783dd Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Thu, 7 Nov 2024 14:21:28 +0100
Subject: [PATCH 20/23] fix: merge in `MainActivity`

---
 .../java/com/android/periodpals/ui/authentication/SignIn.kt     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
index bc22d4a38..7f8bd2343 100644
--- a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
+++ b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
@@ -173,7 +173,7 @@ fun SignInScreen(
                             },
                             testTag = SignInScreen.SIGN_IN_BUTTON,
                         )
-                          
+
                         // Or continue with text
                         AuthSecondInstruction(
                             text = "Or continue with",

From be07bbe5d85c32ac7ee06838546d543dc5a0daee Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Thu, 7 Nov 2024 14:48:09 +0100
Subject: [PATCH 21/23] fix: remove toggled `logoSize`

---
 app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
index 15ac4cc13..24e523660 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Dimens.kt
@@ -21,8 +21,7 @@ data class Dimens(
     val large: Dp = 0.dp,
     val borderLine: Dp = 1.dp,
     val buttonHeight: Dp = 40.dp,
-    val iconSize: Dp = 24.dp,
-    //    val logoSize: Dp = 42.dp
+    val iconSize: Dp = 24.dp
 )
 
 // Width <= 360dp
@@ -35,7 +34,6 @@ val CompactSmallDimens =
         medium2 = 24.dp,
         medium3 = 30.dp,
         large = 45.dp,
-        //    logoSize = 36.dp
     )
 
 // 360dp < Width <= 500dp
@@ -49,6 +47,7 @@ val CompactMediumDimens =
         medium3 = 40.dp,
         large = 60.dp)
 
+// 500dp < Width
 val CompactLargeDimens =
     Dimens(
         small1 = 5.dp,

From b2c7fe3e6362d6c12421b43fab19986742fa3a78 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Thu, 7 Nov 2024 14:50:21 +0100
Subject: [PATCH 22/23] object `PeriodPalsColor` with `LightTheme` and
 `DarkTheme` in Color.kt

---
 .../com/android/periodpals/ui/theme/Color.kt  | 151 +++++++++---------
 .../com/android/periodpals/ui/theme/Theme.kt  |  87 +---------
 2 files changed, 83 insertions(+), 155 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
index eaac43d36..a8d985b95 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
@@ -1,5 +1,8 @@
 package com.android.periodpals.ui.theme
 
+import androidx.compose.material3.ColorScheme
+import androidx.compose.material3.darkColorScheme
+import androidx.compose.material3.lightColorScheme
 import androidx.compose.ui.graphics.Color
 
 // TODO: delete
@@ -11,76 +14,80 @@ val Purple40 = Color(0xFF6650a4)
 val PurpleGrey40 = Color(0xFF625b71)
 val Pink40 = Color(0xFF7D5260)
 
-/* Light theme */
-val primaryLight = Color(0xFF415F91)
-val onPrimaryLight = Color(0xFFFFFFFF)
-val primaryContainerLight = Color(0xFFD6E3FF)
-val onPrimaryContainerLight = Color(0xFF001B3E)
-val secondaryLight = Color(0xFF565F71)
-val onSecondaryLight = Color(0xFFFFFFFF)
-val secondaryContainerLight = Color(0xFFDAE2F9)
-val onSecondaryContainerLight = Color(0xFF131C2B)
-val tertiaryLight = Color(0xFF5C5891)
-val onTertiaryLight = Color(0xFFFFFFFF)
-val tertiaryContainerLight = Color(0xFFE3DFFF)
-val onTertiaryContainerLight = Color(0xFF18124A)
-val errorLight = Color(0xFFBA1A1A)
-val onErrorLight = Color(0xFFFFFFFF)
-val errorContainerLight = Color(0xFFFFDAD6)
-val onErrorContainerLight = Color(0xFF410002)
-val backgroundLight = Color(0xFFF9F9FF)
-val onBackgroundLight = Color(0xFF191C20)
-val surfaceLight = Color(0xFFF9F9FF)
-val onSurfaceLight = Color(0xFF191C20)
-val surfaceVariantLight = Color(0xFFE0E2EC)
-val onSurfaceVariantLight = Color(0xFF44474E)
-val outlineLight = Color(0xFF74777F)
-val outlineVariantLight = Color(0xFFC4C6D0)
-val scrimLight = Color(0xFF000000)
-val inverseSurfaceLight = Color(0xFF2E3036)
-val inverseOnSurfaceLight = Color(0xFFF0F0F7)
-val inversePrimaryLight = Color(0xFFAAC7FF)
-val surfaceDimLight = Color(0xFFD9D9E0)
-val surfaceBrightLight = Color(0xFFF9F9FF)
-val surfaceContainerLowestLight = Color(0xFFFFFFFF)
-val surfaceContainerLowLight = Color(0xFFF3F3FA)
-val surfaceContainerLight = Color(0xFFEDEDF4)
-val surfaceContainerHighLight = Color(0xFFE7E8EE)
-val surfaceContainerHighestLight = Color(0xFFE2E2E9)
+object PeriodPalsColor {
+    val LightTheme: ColorScheme = lightColorScheme(
+        primary = Color(0xFF415F91),
+        onPrimary = Color(0xFFFFFFFF),
+        primaryContainer = Color(0xFFD6E3FF),
+        onPrimaryContainer = Color(0xFF001B3E),
+        secondary = Color(0xFF565F71),
+        onSecondary = Color(0xFFFFFFFF),
+        secondaryContainer = Color(0xFFDAE2F9),
+        onSecondaryContainer = Color(0xFF131C2B),
+        tertiary = Color(0xFF5C5891),
+        onTertiary = Color(0xFFFFFFFF),
+        tertiaryContainer = Color(0xFFE3DFFF),
+        onTertiaryContainer = Color(0xFF18124A),
+        error = Color(0xFFBA1A1A),
+        onError = Color(0xFFFFFFFF),
+        errorContainer = Color(0xFFFFDAD6),
+        onErrorContainer = Color(0xFF410002),
+        background = Color(0xFFF9F9FF),
+        onBackground = Color(0xFF191C20),
+        surface = Color(0xFFF9F9FF),
+        onSurface = Color(0xFF191C20),
+        surfaceVariant = Color(0xFFE0E2EC),
+        onSurfaceVariant = Color(0xFF44474E),
+        outline = Color(0xFF74777F),
+        outlineVariant = Color(0xFFC4C6D0),
+        scrim = Color(0xFF000000),
+        inverseSurface = Color(0xFF2E3036),
+        inverseOnSurface = Color(0xFFF0F0F7),
+        inversePrimary = Color(0xFFAAC7FF),
+        surfaceDim = Color(0xFFD9D9E0),
+        surfaceBright = Color(0xFFF9F9FF),
+        surfaceContainerLowest = Color(0xFFFFFFFF),
+        surfaceContainerLow = Color(0xFFF3F3FA),
+        surfaceContainer = Color(0xFFEDEDF4),
+        surfaceContainerHigh = Color(0xFFE7E8EE),
+        surfaceContainerHighest = Color(0xFFE2E2E9)
+    )
 
-/* Dark theme */
-val primaryDark = Color(0xFFAAC7FF)
-val onPrimaryDark = Color(0xFF0A305F)
-val primaryContainerDark = Color(0xFF284777)
-val onPrimaryContainerDark = Color(0xFFD6E3FF)
-val secondaryDark = Color(0xFFBEC6DC)
-val onSecondaryDark = Color(0xFF283141)
-val secondaryContainerDark = Color(0xFF3E4759)
-val onSecondaryContainerDark = Color(0xFFDAE2F9)
-val tertiaryDark = Color(0xFFC5C0FF)
-val onTertiaryDark = Color(0xFF2D2960)
-val tertiaryContainerDark = Color(0xFF444078)
-val onTertiaryContainerDark = Color(0xFFE3DFFF)
-val errorDark = Color(0xFFFFB4AB)
-val onErrorDark = Color(0xFF690005)
-val errorContainerDark = Color(0xFF93000A)
-val onErrorContainerDark = Color(0xFFFFDAD6)
-val backgroundDark = Color(0xFF111318)
-val onBackgroundDark = Color(0xFFE2E2E9)
-val surfaceDark = Color(0xFF111318)
-val onSurfaceDark = Color(0xFFE2E2E9)
-val surfaceVariantDark = Color(0xFF44474E)
-val onSurfaceVariantDark = Color(0xFFC4C6D0)
-val outlineDark = Color(0xFF8E9099)
-val outlineVariantDark = Color(0xFF44474E)
-val scrimDark = Color(0xFF000000)
-val inverseSurfaceDark = Color(0xFFE2E2E9)
-val inverseOnSurfaceDark = Color(0xFF2E3036)
-val inversePrimaryDark = Color(0xFF415F91)
-val surfaceDimDark = Color(0xFF111318)
-val surfaceBrightDark = Color(0xFF37393E)
-val surfaceContainerLowestDark = Color(0xFF0C0E13)
-val surfaceContainerLowDark = Color(0xFF191C20)
-val surfaceContainerDark = Color(0xFF1D2024)
-val surfaceContainerHighDark = Color(0xFF282A2F)
-val surfaceContainerHighestDark = Color(0xFF33353A)
+    val DarkTheme: ColorScheme = darkColorScheme(
+        primary = Color(0xFFAAC7FF),
+        onPrimary = Color(0xFF0A305F),
+        primaryContainer = Color(0xFF284777),
+        onPrimaryContainer = Color(0xFFD6E3FF),
+        secondary = Color(0xFFBEC6DC),
+        onSecondary = Color(0xFF283141),
+        secondaryContainer = Color(0xFF3E4759),
+        onSecondaryContainer = Color(0xFFDAE2F9),
+        tertiary = Color(0xFFC5C0FF),
+        onTertiary = Color(0xFF2D2960),
+        tertiaryContainer = Color(0xFF444078),
+        onTertiaryContainer = Color(0xFFE3DFFF),
+        error = Color(0xFFFFB4AB),
+        onError = Color(0xFF690005),
+        errorContainer = Color(0xFF93000A),
+        onErrorContainer = Color(0xFFFFDAD6),
+        background = Color(0xFF111318),
+        onBackground = Color(0xFFE2E2E9),
+        surface = Color(0xFF111318),
+        onSurface = Color(0xFFE2E2E9),
+        surfaceVariant = Color(0xFF44474E),
+        onSurfaceVariant = Color(0xFFC4C6D0),
+        outline = Color(0xFF8E9099),
+        outlineVariant = Color(0xFF44474E),
+        scrim = Color(0xFF000000),
+        inverseSurface = Color(0xFFE2E2E9),
+        inverseOnSurface = Color(0xFF2E3036),
+        inversePrimary = Color(0xFF415F91),
+        surfaceDim = Color(0xFF111318),
+        surfaceBright = Color(0xFF37393E),
+        surfaceContainerLowest = Color(0xFF0C0E13),
+        surfaceContainerLow = Color(0xFF191C20),
+        surfaceContainer = Color(0xFF1D2024),
+        surfaceContainerHigh = Color(0xFF282A2F),
+        surfaceContainerHighest = Color(0xFF33353A)
+    )
+}
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index a403d9217..440c9764f 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -3,6 +3,7 @@ package com.android.periodpals.ui.theme
 import android.app.Activity
 import android.widget.Toast
 import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.material3.ColorScheme
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.darkColorScheme
 import androidx.compose.material3.lightColorScheme
@@ -18,85 +19,9 @@ import androidx.compose.ui.platform.LocalView
 import androidx.core.view.WindowCompat
 import com.android.periodpals.MainActivity
 
-private val LightColorScheme =
-    lightColorScheme(
-        primary = primaryLight,
-        onPrimary = onPrimaryLight,
-        primaryContainer = primaryContainerLight,
-        onPrimaryContainer = onPrimaryContainerLight,
-        secondary = secondaryLight,
-        onSecondary = onSecondaryLight,
-        secondaryContainer = secondaryContainerLight,
-        onSecondaryContainer = onSecondaryContainerLight,
-        tertiary = tertiaryLight,
-        onTertiary = onTertiaryLight,
-        tertiaryContainer = tertiaryContainerLight,
-        onTertiaryContainer = onTertiaryContainerLight,
-        error = errorLight,
-        onError = onErrorLight,
-        errorContainer = errorContainerLight,
-        onErrorContainer = onErrorContainerLight,
-        background = backgroundLight,
-        onBackground = onBackgroundLight,
-        surface = surfaceLight,
-        onSurface = onSurfaceLight,
-        surfaceVariant = surfaceVariantLight,
-        onSurfaceVariant = onSurfaceVariantLight,
-        outline = outlineLight,
-        outlineVariant = outlineVariantLight,
-        scrim = scrimLight,
-        inverseSurface = inverseSurfaceLight,
-        inverseOnSurface = inverseOnSurfaceLight,
-        inversePrimary = inversePrimaryLight,
-        surfaceDim = surfaceDimLight,
-        surfaceBright = surfaceBrightLight,
-        surfaceContainerLowest = surfaceContainerLowestLight,
-        surfaceContainerLow = surfaceContainerLowLight,
-        surfaceContainer = surfaceContainerLight,
-        surfaceContainerHigh = surfaceContainerHighLight,
-        surfaceContainerHighest = surfaceContainerHighestLight,
-    )
-
-private val DarkColorScheme =
-    darkColorScheme(
-        primary = primaryDark,
-        onPrimary = onPrimaryDark,
-        primaryContainer = primaryContainerDark,
-        onPrimaryContainer = onPrimaryContainerDark,
-        secondary = secondaryDark,
-        onSecondary = onSecondaryDark,
-        secondaryContainer = secondaryContainerDark,
-        onSecondaryContainer = onSecondaryContainerDark,
-        tertiary = tertiaryDark,
-        onTertiary = onTertiaryDark,
-        tertiaryContainer = tertiaryContainerDark,
-        onTertiaryContainer = onTertiaryContainerDark,
-        error = errorDark,
-        onError = onErrorDark,
-        errorContainer = errorContainerDark,
-        onErrorContainer = onErrorContainerDark,
-        background = backgroundDark,
-        onBackground = onBackgroundDark,
-        surface = surfaceDark,
-        onSurface = onSurfaceDark,
-        surfaceVariant = surfaceVariantDark,
-        onSurfaceVariant = onSurfaceVariantDark,
-        outline = outlineDark,
-        outlineVariant = outlineVariantDark,
-        scrim = scrimDark,
-        inverseSurface = inverseSurfaceDark,
-        inverseOnSurface = inverseOnSurfaceDark,
-        inversePrimary = inversePrimaryDark,
-        surfaceDim = surfaceDimDark,
-        surfaceBright = surfaceBrightDark,
-        surfaceContainerLowest = surfaceContainerLowestDark,
-        surfaceContainerLow = surfaceContainerLowDark,
-        surfaceContainer = surfaceContainerDark,
-        surfaceContainerHigh = surfaceContainerHighDark,
-        surfaceContainerHighest = surfaceContainerHighestDark,
-    )
-
+// Largest compact S width
 private const val COMPACT_S = 360
+// Largest compact M width
 private const val COMPACT_M = 420
 
 @OptIn(ExperimentalMaterial3WindowSizeClassApi::class)
@@ -106,11 +31,7 @@ fun PeriodPalsAppTheme(
     activity: Activity = LocalContext.current as MainActivity,
     content: @Composable () -> Unit
 ) {
-  val colorScheme =
-      when {
-        darkTheme -> DarkColorScheme
-        else -> LightColorScheme
-      }
+  val colorScheme = if (darkTheme) PeriodPalsColor.DarkTheme else PeriodPalsColor.LightTheme
 
   // Match the system bar to the primary color of the app when the app isn't in edit mode (that is,
   // actually running in a device/emulator)

From cfa4d3e5d99caa84c67865275e2b415a8418c433 Mon Sep 17 00:00:00 2001
From: francelu <france.lu@epfl.ch>
Date: Thu, 7 Nov 2024 14:51:43 +0100
Subject: [PATCH 23/23] style: ktfmt format

---
 .../periodpals/ui/authentication/SignIn.kt    |  28 ++--
 .../com/android/periodpals/ui/theme/Color.kt  | 148 +++++++++---------
 .../com/android/periodpals/ui/theme/Theme.kt  |   3 -
 3 files changed, 89 insertions(+), 90 deletions(-)

diff --git a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
index 7f8bd2343..bfd25d9f3 100644
--- a/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
+++ b/app/src/main/java/com/android/periodpals/ui/authentication/SignIn.kt
@@ -155,21 +155,23 @@ fun SignInScreen(
                               emailErrorMessage = validateEmail(email)
                               passwordErrorMessage = validatePassword(password)
 
-                                if (emailErrorMessage.isEmpty() && passwordErrorMessage.isEmpty()) {
-                                    authenticationViewModel.logInWithEmail(email, password)
-                                    authenticationViewModel.isUserLoggedIn()
-                                    val loginSuccess = userState is UserAuthenticationState.Success
-                                    if (loginSuccess) {
-                                        // with supabase
-                                        Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT).show()
-                                        navigationActions.navigateTo(Screen.PROFILE)
-                                    } else {
-                                        Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
-                                    }
+                              if (emailErrorMessage.isEmpty() && passwordErrorMessage.isEmpty()) {
+                                authenticationViewModel.logInWithEmail(email, password)
+                                authenticationViewModel.isUserLoggedIn()
+                                val loginSuccess = userState is UserAuthenticationState.Success
+                                if (loginSuccess) {
+                                  // with supabase
+                                  Toast.makeText(context, "Login Successful", Toast.LENGTH_SHORT)
+                                      .show()
+                                  navigationActions.navigateTo(Screen.PROFILE)
                                 } else {
-                                    Toast.makeText(context, "Invalid email or password.", Toast.LENGTH_SHORT)
-                                        .show()
+                                  Toast.makeText(context, "Login Failed", Toast.LENGTH_SHORT).show()
                                 }
+                              } else {
+                                Toast.makeText(
+                                        context, "Invalid email or password.", Toast.LENGTH_SHORT)
+                                    .show()
+                              }
                             },
                             testTag = SignInScreen.SIGN_IN_BUTTON,
                         )
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
index a8d985b95..89dde425b 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Color.kt
@@ -15,79 +15,79 @@ val PurpleGrey40 = Color(0xFF625b71)
 val Pink40 = Color(0xFF7D5260)
 
 object PeriodPalsColor {
-    val LightTheme: ColorScheme = lightColorScheme(
-        primary = Color(0xFF415F91),
-        onPrimary = Color(0xFFFFFFFF),
-        primaryContainer = Color(0xFFD6E3FF),
-        onPrimaryContainer = Color(0xFF001B3E),
-        secondary = Color(0xFF565F71),
-        onSecondary = Color(0xFFFFFFFF),
-        secondaryContainer = Color(0xFFDAE2F9),
-        onSecondaryContainer = Color(0xFF131C2B),
-        tertiary = Color(0xFF5C5891),
-        onTertiary = Color(0xFFFFFFFF),
-        tertiaryContainer = Color(0xFFE3DFFF),
-        onTertiaryContainer = Color(0xFF18124A),
-        error = Color(0xFFBA1A1A),
-        onError = Color(0xFFFFFFFF),
-        errorContainer = Color(0xFFFFDAD6),
-        onErrorContainer = Color(0xFF410002),
-        background = Color(0xFFF9F9FF),
-        onBackground = Color(0xFF191C20),
-        surface = Color(0xFFF9F9FF),
-        onSurface = Color(0xFF191C20),
-        surfaceVariant = Color(0xFFE0E2EC),
-        onSurfaceVariant = Color(0xFF44474E),
-        outline = Color(0xFF74777F),
-        outlineVariant = Color(0xFFC4C6D0),
-        scrim = Color(0xFF000000),
-        inverseSurface = Color(0xFF2E3036),
-        inverseOnSurface = Color(0xFFF0F0F7),
-        inversePrimary = Color(0xFFAAC7FF),
-        surfaceDim = Color(0xFFD9D9E0),
-        surfaceBright = Color(0xFFF9F9FF),
-        surfaceContainerLowest = Color(0xFFFFFFFF),
-        surfaceContainerLow = Color(0xFFF3F3FA),
-        surfaceContainer = Color(0xFFEDEDF4),
-        surfaceContainerHigh = Color(0xFFE7E8EE),
-        surfaceContainerHighest = Color(0xFFE2E2E9)
-    )
+  val LightTheme: ColorScheme =
+      lightColorScheme(
+          primary = Color(0xFF415F91),
+          onPrimary = Color(0xFFFFFFFF),
+          primaryContainer = Color(0xFFD6E3FF),
+          onPrimaryContainer = Color(0xFF001B3E),
+          secondary = Color(0xFF565F71),
+          onSecondary = Color(0xFFFFFFFF),
+          secondaryContainer = Color(0xFFDAE2F9),
+          onSecondaryContainer = Color(0xFF131C2B),
+          tertiary = Color(0xFF5C5891),
+          onTertiary = Color(0xFFFFFFFF),
+          tertiaryContainer = Color(0xFFE3DFFF),
+          onTertiaryContainer = Color(0xFF18124A),
+          error = Color(0xFFBA1A1A),
+          onError = Color(0xFFFFFFFF),
+          errorContainer = Color(0xFFFFDAD6),
+          onErrorContainer = Color(0xFF410002),
+          background = Color(0xFFF9F9FF),
+          onBackground = Color(0xFF191C20),
+          surface = Color(0xFFF9F9FF),
+          onSurface = Color(0xFF191C20),
+          surfaceVariant = Color(0xFFE0E2EC),
+          onSurfaceVariant = Color(0xFF44474E),
+          outline = Color(0xFF74777F),
+          outlineVariant = Color(0xFFC4C6D0),
+          scrim = Color(0xFF000000),
+          inverseSurface = Color(0xFF2E3036),
+          inverseOnSurface = Color(0xFFF0F0F7),
+          inversePrimary = Color(0xFFAAC7FF),
+          surfaceDim = Color(0xFFD9D9E0),
+          surfaceBright = Color(0xFFF9F9FF),
+          surfaceContainerLowest = Color(0xFFFFFFFF),
+          surfaceContainerLow = Color(0xFFF3F3FA),
+          surfaceContainer = Color(0xFFEDEDF4),
+          surfaceContainerHigh = Color(0xFFE7E8EE),
+          surfaceContainerHighest = Color(0xFFE2E2E9))
 
-    val DarkTheme: ColorScheme = darkColorScheme(
-        primary = Color(0xFFAAC7FF),
-        onPrimary = Color(0xFF0A305F),
-        primaryContainer = Color(0xFF284777),
-        onPrimaryContainer = Color(0xFFD6E3FF),
-        secondary = Color(0xFFBEC6DC),
-        onSecondary = Color(0xFF283141),
-        secondaryContainer = Color(0xFF3E4759),
-        onSecondaryContainer = Color(0xFFDAE2F9),
-        tertiary = Color(0xFFC5C0FF),
-        onTertiary = Color(0xFF2D2960),
-        tertiaryContainer = Color(0xFF444078),
-        onTertiaryContainer = Color(0xFFE3DFFF),
-        error = Color(0xFFFFB4AB),
-        onError = Color(0xFF690005),
-        errorContainer = Color(0xFF93000A),
-        onErrorContainer = Color(0xFFFFDAD6),
-        background = Color(0xFF111318),
-        onBackground = Color(0xFFE2E2E9),
-        surface = Color(0xFF111318),
-        onSurface = Color(0xFFE2E2E9),
-        surfaceVariant = Color(0xFF44474E),
-        onSurfaceVariant = Color(0xFFC4C6D0),
-        outline = Color(0xFF8E9099),
-        outlineVariant = Color(0xFF44474E),
-        scrim = Color(0xFF000000),
-        inverseSurface = Color(0xFFE2E2E9),
-        inverseOnSurface = Color(0xFF2E3036),
-        inversePrimary = Color(0xFF415F91),
-        surfaceDim = Color(0xFF111318),
-        surfaceBright = Color(0xFF37393E),
-        surfaceContainerLowest = Color(0xFF0C0E13),
-        surfaceContainerLow = Color(0xFF191C20),
-        surfaceContainer = Color(0xFF1D2024),
-        surfaceContainerHigh = Color(0xFF282A2F),
-        surfaceContainerHighest = Color(0xFF33353A)
-    )
+  val DarkTheme: ColorScheme =
+      darkColorScheme(
+          primary = Color(0xFFAAC7FF),
+          onPrimary = Color(0xFF0A305F),
+          primaryContainer = Color(0xFF284777),
+          onPrimaryContainer = Color(0xFFD6E3FF),
+          secondary = Color(0xFFBEC6DC),
+          onSecondary = Color(0xFF283141),
+          secondaryContainer = Color(0xFF3E4759),
+          onSecondaryContainer = Color(0xFFDAE2F9),
+          tertiary = Color(0xFFC5C0FF),
+          onTertiary = Color(0xFF2D2960),
+          tertiaryContainer = Color(0xFF444078),
+          onTertiaryContainer = Color(0xFFE3DFFF),
+          error = Color(0xFFFFB4AB),
+          onError = Color(0xFF690005),
+          errorContainer = Color(0xFF93000A),
+          onErrorContainer = Color(0xFFFFDAD6),
+          background = Color(0xFF111318),
+          onBackground = Color(0xFFE2E2E9),
+          surface = Color(0xFF111318),
+          onSurface = Color(0xFFE2E2E9),
+          surfaceVariant = Color(0xFF44474E),
+          onSurfaceVariant = Color(0xFFC4C6D0),
+          outline = Color(0xFF8E9099),
+          outlineVariant = Color(0xFF44474E),
+          scrim = Color(0xFF000000),
+          inverseSurface = Color(0xFFE2E2E9),
+          inverseOnSurface = Color(0xFF2E3036),
+          inversePrimary = Color(0xFF415F91),
+          surfaceDim = Color(0xFF111318),
+          surfaceBright = Color(0xFF37393E),
+          surfaceContainerLowest = Color(0xFF0C0E13),
+          surfaceContainerLow = Color(0xFF191C20),
+          surfaceContainer = Color(0xFF1D2024),
+          surfaceContainerHigh = Color(0xFF282A2F),
+          surfaceContainerHighest = Color(0xFF33353A))
 }
diff --git a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
index 440c9764f..95462e20a 100644
--- a/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
+++ b/app/src/main/java/com/android/periodpals/ui/theme/Theme.kt
@@ -3,10 +3,7 @@ package com.android.periodpals.ui.theme
 import android.app.Activity
 import android.widget.Toast
 import androidx.compose.foundation.isSystemInDarkTheme
-import androidx.compose.material3.ColorScheme
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.darkColorScheme
-import androidx.compose.material3.lightColorScheme
 import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi
 import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
 import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass