feat(theme): tema Compose con paleta Rachita y fuentes descargables
- Color.kt: paleta completa del PRD §6.1 (coral/menta/sol/lila/crema/tinta/noche) - Type.kt: Baloo 2 + Nunito vía Google Fonts provider, escala del PRD §6.2 - Shape.kt: radios 14-24dp + píldora; Theme.kt: MaterialTheme light único
This commit is contained in:
@@ -0,0 +1,46 @@
|
|||||||
|
package mx.paputec.rachita.ui.theme
|
||||||
|
|
||||||
|
import androidx.compose.ui.graphics.Color
|
||||||
|
|
||||||
|
// Primary brand colors (PRD §6.1) — used by CTAs, mascot, streak flame.
|
||||||
|
val Coral = Color(0xFFFF8A66)
|
||||||
|
val CoralIntense = Color(0xFFFF6B3D)
|
||||||
|
val CoralSoft = Color(0xFFFFE0D5)
|
||||||
|
|
||||||
|
// Secondary — habits, cat mascot, gallery CTA.
|
||||||
|
val Mint = Color(0xFF3FB8AE)
|
||||||
|
val MintSoft = Color(0xFFD6F3F0)
|
||||||
|
|
||||||
|
// Sun / XP / rabbit mascot.
|
||||||
|
val Sun = Color(0xFFFBC24E)
|
||||||
|
val SunDeep = Color(0xFFF4B63E)
|
||||||
|
|
||||||
|
// Museum, charging notifications.
|
||||||
|
val Lilac = Color(0xFF8C7CE8)
|
||||||
|
val LilacSoft = Color(0xFFE7E3FB)
|
||||||
|
|
||||||
|
// Success + charging bar.
|
||||||
|
val SuccessGreen = Color(0xFF46C98B)
|
||||||
|
val ChargingGreen = Color(0xFF9BE36D)
|
||||||
|
|
||||||
|
// Alerts item.
|
||||||
|
val Pink = Color(0xFFFF6B8A)
|
||||||
|
|
||||||
|
// Backgrounds.
|
||||||
|
val CreamBackground = Color(0xFFFFF6EE)
|
||||||
|
val CreamCard = Color(0xFFFFE9DF)
|
||||||
|
val CreamCardSoft = Color(0xFFFFF1E8)
|
||||||
|
|
||||||
|
// Text.
|
||||||
|
val Ink = Color(0xFF43352F)
|
||||||
|
val WarmGrey = Color(0xFFA4938A)
|
||||||
|
val WarmGreyDeep = Color(0xFF8A7A72)
|
||||||
|
|
||||||
|
// Card border for secondary CTAs.
|
||||||
|
val CardBorder = Color(0xFFEBDFD7)
|
||||||
|
|
||||||
|
// Night palette for charging lock screen (module 3, later step).
|
||||||
|
val Night = Color(0xFF2A2350)
|
||||||
|
val NightGradientStart = Color(0xFF39306E)
|
||||||
|
val NightGradientMid = Color(0xFF5A4E97)
|
||||||
|
val NightGradientEnd = Color(0xFFB98FC4)
|
||||||
@@ -0,0 +1,16 @@
|
|||||||
|
package mx.paputec.rachita.ui.theme
|
||||||
|
|
||||||
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||||
|
import androidx.compose.material3.Shapes
|
||||||
|
import androidx.compose.ui.unit.dp
|
||||||
|
|
||||||
|
// Radii scale from PRD §6.3: 14–24 dp on cards, 999 dp on pills.
|
||||||
|
val RachitaShapes = Shapes(
|
||||||
|
extraSmall = RoundedCornerShape(8.dp),
|
||||||
|
small = RoundedCornerShape(14.dp),
|
||||||
|
medium = RoundedCornerShape(18.dp),
|
||||||
|
large = RoundedCornerShape(24.dp),
|
||||||
|
extraLarge = RoundedCornerShape(32.dp),
|
||||||
|
)
|
||||||
|
|
||||||
|
val PillShape = RoundedCornerShape(999.dp)
|
||||||
@@ -0,0 +1,48 @@
|
|||||||
|
package mx.paputec.rachita.ui.theme
|
||||||
|
|
||||||
|
import androidx.compose.material3.MaterialTheme
|
||||||
|
import androidx.compose.material3.lightColorScheme
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
|
||||||
|
// Rachita is landscape, single light theme in v1 — no dark mode yet (out of scope
|
||||||
|
// per sprint 1). Colors resolved via the palette in Color.kt.
|
||||||
|
private val LightColors = lightColorScheme(
|
||||||
|
primary = Coral,
|
||||||
|
onPrimary = CreamBackground,
|
||||||
|
primaryContainer = CoralSoft,
|
||||||
|
onPrimaryContainer = Ink,
|
||||||
|
|
||||||
|
secondary = Mint,
|
||||||
|
onSecondary = CreamBackground,
|
||||||
|
secondaryContainer = MintSoft,
|
||||||
|
onSecondaryContainer = Ink,
|
||||||
|
|
||||||
|
tertiary = Lilac,
|
||||||
|
onTertiary = CreamBackground,
|
||||||
|
tertiaryContainer = LilacSoft,
|
||||||
|
onTertiaryContainer = Ink,
|
||||||
|
|
||||||
|
background = CreamBackground,
|
||||||
|
onBackground = Ink,
|
||||||
|
|
||||||
|
surface = CreamBackground,
|
||||||
|
onSurface = Ink,
|
||||||
|
surfaceVariant = CreamCardSoft,
|
||||||
|
onSurfaceVariant = WarmGreyDeep,
|
||||||
|
|
||||||
|
outline = CardBorder,
|
||||||
|
outlineVariant = CardBorder,
|
||||||
|
|
||||||
|
error = CoralIntense,
|
||||||
|
onError = CreamBackground,
|
||||||
|
)
|
||||||
|
|
||||||
|
@Composable
|
||||||
|
fun RachitaTheme(content: @Composable () -> Unit) {
|
||||||
|
MaterialTheme(
|
||||||
|
colorScheme = LightColors,
|
||||||
|
typography = RachitaTypography,
|
||||||
|
shapes = RachitaShapes,
|
||||||
|
content = content,
|
||||||
|
)
|
||||||
|
}
|
||||||
@@ -0,0 +1,58 @@
|
|||||||
|
package mx.paputec.rachita.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.text.googlefonts.Font
|
||||||
|
import androidx.compose.ui.text.googlefonts.GoogleFont
|
||||||
|
import androidx.compose.ui.unit.sp
|
||||||
|
import mx.paputec.rachita.R
|
||||||
|
|
||||||
|
// Downloadable Fonts via Google Fonts provider (androidx.compose.ui:ui-text-google-fonts).
|
||||||
|
// The provider certs live in res/values/font_certs.xml. Baloo 2 for display / headings,
|
||||||
|
// Nunito for body copy — matches PRD §6.2.
|
||||||
|
private val GoogleFontsProvider = GoogleFont.Provider(
|
||||||
|
providerAuthority = "com.google.android.gms.fonts",
|
||||||
|
providerPackage = "com.google.android.gms",
|
||||||
|
certificates = R.array.com_google_android_gms_fonts_certs,
|
||||||
|
)
|
||||||
|
|
||||||
|
private val Baloo2 = FontFamily(
|
||||||
|
Font(googleFont = GoogleFont("Baloo 2"), fontProvider = GoogleFontsProvider, weight = FontWeight.Medium),
|
||||||
|
Font(googleFont = GoogleFont("Baloo 2"), fontProvider = GoogleFontsProvider, weight = FontWeight.SemiBold),
|
||||||
|
Font(googleFont = GoogleFont("Baloo 2"), fontProvider = GoogleFontsProvider, weight = FontWeight.Bold),
|
||||||
|
Font(googleFont = GoogleFont("Baloo 2"), fontProvider = GoogleFontsProvider, weight = FontWeight.ExtraBold),
|
||||||
|
)
|
||||||
|
|
||||||
|
private val Nunito = FontFamily(
|
||||||
|
Font(googleFont = GoogleFont("Nunito"), fontProvider = GoogleFontsProvider, weight = FontWeight.Normal),
|
||||||
|
Font(googleFont = GoogleFont("Nunito"), fontProvider = GoogleFontsProvider, weight = FontWeight.Medium),
|
||||||
|
Font(googleFont = GoogleFont("Nunito"), fontProvider = GoogleFontsProvider, weight = FontWeight.SemiBold),
|
||||||
|
Font(googleFont = GoogleFont("Nunito"), fontProvider = GoogleFontsProvider, weight = FontWeight.Bold),
|
||||||
|
Font(googleFont = GoogleFont("Nunito"), fontProvider = GoogleFontsProvider, weight = FontWeight.ExtraBold),
|
||||||
|
)
|
||||||
|
|
||||||
|
// Type scale from PRD §6.2: display/title 26–34 sp, streak numbers 42–92 sp,
|
||||||
|
// habit names ~23 sp, body 13–16 sp, captions 11–12 sp.
|
||||||
|
val RachitaTypography = Typography(
|
||||||
|
displayLarge = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.ExtraBold, fontSize = 92.sp, color = Ink),
|
||||||
|
displayMedium = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.ExtraBold, fontSize = 64.sp, color = Ink),
|
||||||
|
displaySmall = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.Bold, fontSize = 42.sp, color = Ink),
|
||||||
|
|
||||||
|
headlineLarge = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.Bold, fontSize = 34.sp, color = Ink),
|
||||||
|
headlineMedium = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.Bold, fontSize = 30.sp, color = Ink),
|
||||||
|
headlineSmall = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.Bold, fontSize = 26.sp, color = Ink),
|
||||||
|
|
||||||
|
titleLarge = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.SemiBold, fontSize = 23.sp, color = Ink),
|
||||||
|
titleMedium = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.SemiBold, fontSize = 20.sp, color = Ink),
|
||||||
|
titleSmall = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.SemiBold, fontSize = 16.sp, color = Ink),
|
||||||
|
|
||||||
|
bodyLarge = TextStyle(fontFamily = Nunito, fontWeight = FontWeight.SemiBold, fontSize = 16.sp, color = Ink),
|
||||||
|
bodyMedium = TextStyle(fontFamily = Nunito, fontWeight = FontWeight.Medium, fontSize = 14.sp, color = Ink),
|
||||||
|
bodySmall = TextStyle(fontFamily = Nunito, fontWeight = FontWeight.Medium, fontSize = 13.sp, color = WarmGreyDeep),
|
||||||
|
|
||||||
|
labelLarge = TextStyle(fontFamily = Baloo2, fontWeight = FontWeight.Bold, fontSize = 16.sp, color = Ink),
|
||||||
|
labelMedium = TextStyle(fontFamily = Nunito, fontWeight = FontWeight.Bold, fontSize = 12.sp, color = Ink),
|
||||||
|
labelSmall = TextStyle(fontFamily = Nunito, fontWeight = FontWeight.SemiBold, fontSize = 11.sp, color = WarmGreyDeep),
|
||||||
|
)
|
||||||
Reference in New Issue
Block a user