diff options
author | Harsh Shandilya <me@msfjarvis.dev> | 2021-11-01 01:47:34 +0530 |
---|---|---|
committer | Harsh Shandilya <me@msfjarvis.dev> | 2021-11-03 15:07:00 +0530 |
commit | 0834c979a5c6a41106282ffc8a8be72255f780fa (patch) | |
tree | b69ea97ce2b5eab290f78d749001f0384deed788 /app | |
parent | 494cb5fc4fbe90d7a4b27e1d1114cb20840883d3 (diff) |
app: add Material3 themes
Diffstat (limited to 'app')
-rw-r--r-- | app/build.gradle.kts | 1 | ||||
-rw-r--r-- | app/src/main/java/dev/msfjarvis/aps/ui/theme/Color.kt | 58 | ||||
-rw-r--r-- | app/src/main/java/dev/msfjarvis/aps/ui/theme/Theme.kt | 76 | ||||
-rw-r--r-- | app/src/main/java/dev/msfjarvis/aps/ui/theme/Type.kt | 134 | ||||
-rw-r--r-- | app/src/main/res/values-night/themes_material3.xml | 36 | ||||
-rw-r--r-- | app/src/main/res/values/colors_material3.xml | 61 | ||||
-rw-r--r-- | app/src/main/res/values/themes_material3.xml | 36 |
7 files changed, 402 insertions, 0 deletions
diff --git a/app/build.gradle.kts b/app/build.gradle.kts index 54042fb7..1c75d139 100644 --- a/app/build.gradle.kts +++ b/app/build.gradle.kts @@ -92,6 +92,7 @@ dependencies { implementation(libs.compose.foundation.core) implementation(libs.compose.foundation.layout) implementation(libs.compose.material) + implementation(libs.compose.material3) implementation(libs.compose.ui.core) implementation(libs.compose.ui.viewbinding) compileOnly(libs.compose.ui.tooling) diff --git a/app/src/main/java/dev/msfjarvis/aps/ui/theme/Color.kt b/app/src/main/java/dev/msfjarvis/aps/ui/theme/Color.kt new file mode 100644 index 00000000..8566e734 --- /dev/null +++ b/app/src/main/java/dev/msfjarvis/aps/ui/theme/Color.kt @@ -0,0 +1,58 @@ +package dev.msfjarvis.aps.ui.theme + +import androidx.compose.ui.graphics.Color + +val md_theme_light_primary = Color(0xFF006591) +val md_theme_light_onPrimary = Color(0xFFffffff) +val md_theme_light_primaryContainer = Color(0xFFc7e6ff) +val md_theme_light_onPrimaryContainer = Color(0xFF001e30) +val md_theme_light_secondary = Color(0xFF4f606e) +val md_theme_light_onSecondary = Color(0xFFffffff) +val md_theme_light_secondaryContainer = Color(0xFFd3e5f5) +val md_theme_light_onSecondaryContainer = Color(0xFF0b1d29) +val md_theme_light_tertiary = Color(0xFF006494) +val md_theme_light_onTertiary = Color(0xFFffffff) +val md_theme_light_tertiaryContainer = Color(0xFFc8e6ff) +val md_theme_light_onTertiaryContainer = Color(0xFF001e31) +val md_theme_light_error = Color(0xFFba1b1b) +val md_theme_light_errorContainer = Color(0xFFffdad4) +val md_theme_light_onError = Color(0xFFffffff) +val md_theme_light_onErrorContainer = Color(0xFF410001) +val md_theme_light_background = Color(0xFFfcfcff) +val md_theme_light_onBackground = Color(0xFF1a1c1e) +val md_theme_light_surface = Color(0xFFfcfcff) +val md_theme_light_onSurface = Color(0xFF1a1c1e) +val md_theme_light_surfaceVariant = Color(0xFFdde3ea) +val md_theme_light_onSurfaceVariant = Color(0xFF41474d) +val md_theme_light_outline = Color(0xFF72787e) +val md_theme_light_inverseOnSurface = Color(0xFFf0f0f3) +val md_theme_light_inverseSurface = Color(0xFF2e3133) + +val md_theme_dark_primary = Color(0xFF85ceff) +val md_theme_dark_onPrimary = Color(0xFF00344e) +val md_theme_dark_primaryContainer = Color(0xFF004c6f) +val md_theme_dark_onPrimaryContainer = Color(0xFFc7e6ff) +val md_theme_dark_secondary = Color(0xFFb7c9d9) +val md_theme_dark_onSecondary = Color(0xFF21323e) +val md_theme_dark_secondaryContainer = Color(0xFF384956) +val md_theme_dark_onSecondaryContainer = Color(0xFFd3e5f5) +val md_theme_dark_tertiary = Color(0xFF8aceff) +val md_theme_dark_onTertiary = Color(0xFF003450) +val md_theme_dark_tertiaryContainer = Color(0xFF004b70) +val md_theme_dark_onTertiaryContainer = Color(0xFFc8e6ff) +val md_theme_dark_error = Color(0xFFffb4a9) +val md_theme_dark_errorContainer = Color(0xFF930006) +val md_theme_dark_onError = Color(0xFF680003) +val md_theme_dark_onErrorContainer = Color(0xFFffdad4) +val md_theme_dark_background = Color(0xFF1a1c1e) +val md_theme_dark_onBackground = Color(0xFFe1e2e5) +val md_theme_dark_surface = Color(0xFF1a1c1e) +val md_theme_dark_onSurface = Color(0xFFe1e2e5) +val md_theme_dark_surfaceVariant = Color(0xFF41474d) +val md_theme_dark_onSurfaceVariant = Color(0xFFc1c7ce) +val md_theme_dark_outline = Color(0xFF8b9197) +val md_theme_dark_inverseOnSurface = Color(0xFF1a1c1e) +val md_theme_dark_inverseSurface = Color(0xFFe1e2e5) + +val seed = Color(0xFF003e5b) +val error = Color(0xFFba1b1b) diff --git a/app/src/main/java/dev/msfjarvis/aps/ui/theme/Theme.kt b/app/src/main/java/dev/msfjarvis/aps/ui/theme/Theme.kt new file mode 100644 index 00000000..55fb600d --- /dev/null +++ b/app/src/main/java/dev/msfjarvis/aps/ui/theme/Theme.kt @@ -0,0 +1,76 @@ +package dev.msfjarvis.aps.ui.theme + +import androidx.compose.foundation.isSystemInDarkTheme +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.darkColorScheme +import androidx.compose.material3.lightColorScheme +import androidx.compose.runtime.Composable + +private val LightThemeColors = + lightColorScheme( + primary = md_theme_light_primary, + onPrimary = md_theme_light_onPrimary, + primaryContainer = md_theme_light_primaryContainer, + onPrimaryContainer = md_theme_light_onPrimaryContainer, + secondary = md_theme_light_secondary, + onSecondary = md_theme_light_onSecondary, + secondaryContainer = md_theme_light_secondaryContainer, + onSecondaryContainer = md_theme_light_onSecondaryContainer, + tertiary = md_theme_light_tertiary, + onTertiary = md_theme_light_onTertiary, + tertiaryContainer = md_theme_light_tertiaryContainer, + onTertiaryContainer = md_theme_light_onTertiaryContainer, + error = md_theme_light_error, + errorContainer = md_theme_light_errorContainer, + onError = md_theme_light_onError, + onErrorContainer = md_theme_light_onErrorContainer, + background = md_theme_light_background, + onBackground = md_theme_light_onBackground, + surface = md_theme_light_surface, + onSurface = md_theme_light_onSurface, + surfaceVariant = md_theme_light_surfaceVariant, + onSurfaceVariant = md_theme_light_onSurfaceVariant, + outline = md_theme_light_outline, + inverseOnSurface = md_theme_light_inverseOnSurface, + inverseSurface = md_theme_light_inverseSurface, + ) +private val DarkThemeColors = + darkColorScheme( + primary = md_theme_dark_primary, + onPrimary = md_theme_dark_onPrimary, + primaryContainer = md_theme_dark_primaryContainer, + onPrimaryContainer = md_theme_dark_onPrimaryContainer, + secondary = md_theme_dark_secondary, + onSecondary = md_theme_dark_onSecondary, + secondaryContainer = md_theme_dark_secondaryContainer, + onSecondaryContainer = md_theme_dark_onSecondaryContainer, + tertiary = md_theme_dark_tertiary, + onTertiary = md_theme_dark_onTertiary, + tertiaryContainer = md_theme_dark_tertiaryContainer, + onTertiaryContainer = md_theme_dark_onTertiaryContainer, + error = md_theme_dark_error, + errorContainer = md_theme_dark_errorContainer, + onError = md_theme_dark_onError, + onErrorContainer = md_theme_dark_onErrorContainer, + background = md_theme_dark_background, + onBackground = md_theme_dark_onBackground, + surface = md_theme_dark_surface, + onSurface = md_theme_dark_onSurface, + surfaceVariant = md_theme_dark_surfaceVariant, + onSurfaceVariant = md_theme_dark_onSurfaceVariant, + outline = md_theme_dark_outline, + inverseOnSurface = md_theme_dark_inverseOnSurface, + inverseSurface = md_theme_dark_inverseSurface, + ) + +@Composable +fun APSTheme(useDarkTheme: Boolean = isSystemInDarkTheme(), content: @Composable () -> Unit) { + val colors = + if (!useDarkTheme) { + LightThemeColors + } else { + DarkThemeColors + } + + MaterialTheme(colorScheme = colors, typography = AppTypography, content = content) +} diff --git a/app/src/main/java/dev/msfjarvis/aps/ui/theme/Type.kt b/app/src/main/java/dev/msfjarvis/aps/ui/theme/Type.kt new file mode 100644 index 00000000..a8472f00 --- /dev/null +++ b/app/src/main/java/dev/msfjarvis/aps/ui/theme/Type.kt @@ -0,0 +1,134 @@ +package dev.msfjarvis.aps.ui.theme + +import androidx.compose.material3.Typography +import androidx.compose.ui.text.TextStyle +import androidx.compose.ui.text.font.FontFamily +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.unit.sp + +// Replace with your font locations +val Roboto = FontFamily.Default + +val AppTypography = + Typography( + displayLarge = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 57.sp, + lineHeight = 64.sp, + letterSpacing = (-0.25).sp, + ), + displayMedium = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 45.sp, + lineHeight = 52.sp, + letterSpacing = 0.sp, + ), + displaySmall = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 36.sp, + lineHeight = 44.sp, + letterSpacing = 0.sp, + ), + headlineLarge = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 32.sp, + lineHeight = 40.sp, + letterSpacing = 0.sp, + ), + headlineMedium = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 28.sp, + lineHeight = 36.sp, + letterSpacing = 0.sp, + ), + headlineSmall = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 24.sp, + lineHeight = 32.sp, + letterSpacing = 0.sp, + ), + titleLarge = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 22.sp, + lineHeight = 28.sp, + letterSpacing = 0.sp, + ), + titleMedium = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.Medium, + fontSize = 16.sp, + lineHeight = 24.sp, + letterSpacing = 0.1.sp, + ), + titleSmall = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.Medium, + fontSize = 14.sp, + lineHeight = 20.sp, + letterSpacing = 0.1.sp, + ), + labelLarge = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.Medium, + fontSize = 14.sp, + lineHeight = 20.sp, + letterSpacing = 0.1.sp, + ), + bodyLarge = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 16.sp, + lineHeight = 24.sp, + letterSpacing = 0.5.sp, + ), + bodyMedium = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 14.sp, + lineHeight = 20.sp, + letterSpacing = 0.25.sp, + ), + bodySmall = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.W400, + fontSize = 12.sp, + lineHeight = 16.sp, + letterSpacing = 0.4.sp, + ), + labelMedium = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.Medium, + fontSize = 12.sp, + lineHeight = 16.sp, + letterSpacing = 0.5.sp, + ), + labelSmall = + TextStyle( + fontFamily = Roboto, + fontWeight = FontWeight.Medium, + fontSize = 11.sp, + lineHeight = 16.sp, + letterSpacing = 0.5.sp, + ), + ) diff --git a/app/src/main/res/values-night/themes_material3.xml b/app/src/main/res/values-night/themes_material3.xml new file mode 100644 index 00000000..a06aefe8 --- /dev/null +++ b/app/src/main/res/values-night/themes_material3.xml @@ -0,0 +1,36 @@ +<?xml version="1.0" encoding="utf-8"?><!-- + ~ Copyright © 2014-2021 The Android Password Store Authors. All Rights Reserved. + ~ SPDX-License-Identifier: GPL-3.0-only + --> + +<resources> + + <style name="APSThemeM3" parent="Theme.Material3.DayNight"> + <item name="colorPrimary">@color/md_theme_dark_primary</item> + <item name="colorOnPrimary">@color/md_theme_dark_onPrimary</item> + <item name="colorPrimaryContainer">@color/md_theme_dark_primaryContainer</item> + <item name="colorOnPrimaryContainer">@color/md_theme_dark_onPrimaryContainer</item> + <item name="colorSecondary">@color/md_theme_dark_secondary</item> + <item name="colorOnSecondary">@color/md_theme_dark_onSecondary</item> + <item name="colorSecondaryContainer">@color/md_theme_dark_secondaryContainer</item> + <item name="colorOnSecondaryContainer">@color/md_theme_dark_onSecondaryContainer</item> + <item name="colorTertiary">@color/md_theme_dark_tertiary</item> + <item name="colorOnTertiary">@color/md_theme_dark_onTertiary</item> + <item name="colorTertiaryContainer">@color/md_theme_dark_tertiaryContainer</item> + <item name="colorOnTertiaryContainer">@color/md_theme_dark_onTertiaryContainer</item> + <item name="colorError">@color/md_theme_dark_error</item> + <item name="colorErrorContainer">@color/md_theme_dark_errorContainer</item> + <item name="colorOnError">@color/md_theme_dark_onError</item> + <item name="colorOnErrorContainer">@color/md_theme_dark_onErrorContainer</item> + <item name="android:colorBackground">@color/md_theme_dark_background</item> + <item name="colorOnBackground">@color/md_theme_dark_onBackground</item> + <item name="colorSurface">@color/md_theme_dark_surface</item> + <item name="colorOnSurface">@color/md_theme_dark_onSurface</item> + <item name="colorSurfaceVariant">@color/md_theme_dark_surfaceVariant</item> + <item name="colorOnSurfaceVariant">@color/md_theme_dark_onSurfaceVariant</item> + <item name="colorOutline">@color/md_theme_dark_outline</item> + <item name="colorOnSurfaceInverse">@color/md_theme_dark_inverseOnSurface</item> + <item name="colorSurfaceInverse">@color/md_theme_dark_inverseSurface</item> + <item name="colorPrimaryInverse">@color/md_theme_dark_primaryInverse</item> + </style> +</resources> diff --git a/app/src/main/res/values/colors_material3.xml b/app/src/main/res/values/colors_material3.xml new file mode 100644 index 00000000..d8082f89 --- /dev/null +++ b/app/src/main/res/values/colors_material3.xml @@ -0,0 +1,61 @@ +<?xml version="1.0" encoding="utf-8"?><!-- + ~ Copyright © 2014-2021 The Android Password Store Authors. All Rights Reserved. + ~ SPDX-License-Identifier: GPL-3.0-only + --> + +<resources> + <color name="md_theme_light_primary">#006591</color> + <color name="md_theme_light_onPrimary">#FFFFFF</color> + <color name="md_theme_light_primaryContainer">#C7E6FF</color> + <color name="md_theme_light_onPrimaryContainer">#001E30</color> + <color name="md_theme_light_secondary">#4F606E</color> + <color name="md_theme_light_onSecondary">#FFFFFF</color> + <color name="md_theme_light_secondaryContainer">#D3E5F5</color> + <color name="md_theme_light_onSecondaryContainer">#0B1D29</color> + <color name="md_theme_light_tertiary">#006494</color> + <color name="md_theme_light_onTertiary">#FFFFFF</color> + <color name="md_theme_light_tertiaryContainer">#C8E6FF</color> + <color name="md_theme_light_onTertiaryContainer">#001E31</color> + <color name="md_theme_light_error">#BA1B1B</color> + <color name="md_theme_light_errorContainer">#FFDAD4</color> + <color name="md_theme_light_onError">#FFFFFF</color> + <color name="md_theme_light_onErrorContainer">#410001</color> + <color name="md_theme_light_background">#FCFCFF</color> + <color name="md_theme_light_onBackground">#1A1C1E</color> + <color name="md_theme_light_surface">#FCFCFF</color> + <color name="md_theme_light_onSurface">#1A1C1E</color> + <color name="md_theme_light_surfaceVariant">#DDE3EA</color> + <color name="md_theme_light_onSurfaceVariant">#41474D</color> + <color name="md_theme_light_outline">#72787E</color> + <color name="md_theme_light_inverseOnSurface">#F0F0F3</color> + <color name="md_theme_light_inverseSurface">#2E3133</color> + <color name="md_theme_light_primaryInverse">#85CEFF</color> + <color name="md_theme_dark_primary">#85CEFF</color> + <color name="md_theme_dark_onPrimary">#00344E</color> + <color name="md_theme_dark_primaryContainer">#004C6F</color> + <color name="md_theme_dark_onPrimaryContainer">#C7E6FF</color> + <color name="md_theme_dark_secondary">#B7C9D9</color> + <color name="md_theme_dark_onSecondary">#21323E</color> + <color name="md_theme_dark_secondaryContainer">#384956</color> + <color name="md_theme_dark_onSecondaryContainer">#D3E5F5</color> + <color name="md_theme_dark_tertiary">#8ACEFF</color> + <color name="md_theme_dark_onTertiary">#003450</color> + <color name="md_theme_dark_tertiaryContainer">#004B70</color> + <color name="md_theme_dark_onTertiaryContainer">#C8E6FF</color> + <color name="md_theme_dark_error">#FFB4A9</color> + <color name="md_theme_dark_errorContainer">#930006</color> + <color name="md_theme_dark_onError">#680003</color> + <color name="md_theme_dark_onErrorContainer">#FFDAD4</color> + <color name="md_theme_dark_background">#1A1C1E</color> + <color name="md_theme_dark_onBackground">#E1E2E5</color> + <color name="md_theme_dark_surface">#1A1C1E</color> + <color name="md_theme_dark_onSurface">#E1E2E5</color> + <color name="md_theme_dark_surfaceVariant">#41474D</color> + <color name="md_theme_dark_onSurfaceVariant">#C1C7CE</color> + <color name="md_theme_dark_outline">#8B9197</color> + <color name="md_theme_dark_inverseOnSurface">#1A1C1E</color> + <color name="md_theme_dark_inverseSurface">#E1E2E5</color> + <color name="md_theme_dark_primaryInverse">#006591</color> + <color name="seed">#003E5B</color> + <color name="error">#BA1B1B</color> +</resources> diff --git a/app/src/main/res/values/themes_material3.xml b/app/src/main/res/values/themes_material3.xml new file mode 100644 index 00000000..047fce33 --- /dev/null +++ b/app/src/main/res/values/themes_material3.xml @@ -0,0 +1,36 @@ +<?xml version="1.0" encoding="utf-8"?><!-- + ~ Copyright © 2014-2021 The Android Password Store Authors. All Rights Reserved. + ~ SPDX-License-Identifier: GPL-3.0-only + --> + +<resources> + + <style name="APSThemeM3" parent="Theme.Material3.DayNight"> + <item name="colorPrimary">@color/md_theme_light_primary</item> + <item name="colorOnPrimary">@color/md_theme_light_onPrimary</item> + <item name="colorPrimaryContainer">@color/md_theme_light_primaryContainer</item> + <item name="colorOnPrimaryContainer">@color/md_theme_light_onPrimaryContainer</item> + <item name="colorSecondary">@color/md_theme_light_secondary</item> + <item name="colorOnSecondary">@color/md_theme_light_onSecondary</item> + <item name="colorSecondaryContainer">@color/md_theme_light_secondaryContainer</item> + <item name="colorOnSecondaryContainer">@color/md_theme_light_onSecondaryContainer</item> + <item name="colorTertiary">@color/md_theme_light_tertiary</item> + <item name="colorOnTertiary">@color/md_theme_light_onTertiary</item> + <item name="colorTertiaryContainer">@color/md_theme_light_tertiaryContainer</item> + <item name="colorOnTertiaryContainer">@color/md_theme_light_onTertiaryContainer</item> + <item name="colorError">@color/md_theme_light_error</item> + <item name="colorErrorContainer">@color/md_theme_light_errorContainer</item> + <item name="colorOnError">@color/md_theme_light_onError</item> + <item name="colorOnErrorContainer">@color/md_theme_light_onErrorContainer</item> + <item name="android:colorBackground">@color/md_theme_light_background</item> + <item name="colorOnBackground">@color/md_theme_light_onBackground</item> + <item name="colorSurface">@color/md_theme_light_surface</item> + <item name="colorOnSurface">@color/md_theme_light_onSurface</item> + <item name="colorSurfaceVariant">@color/md_theme_light_surfaceVariant</item> + <item name="colorOnSurfaceVariant">@color/md_theme_light_onSurfaceVariant</item> + <item name="colorOutline">@color/md_theme_light_outline</item> + <item name="colorOnSurfaceInverse">@color/md_theme_light_inverseOnSurface</item> + <item name="colorSurfaceInverse">@color/md_theme_light_inverseSurface</item> + <item name="colorPrimaryInverse">@color/md_theme_light_primaryInverse</item> + </style> +</resources> |