Menú
How to apply consistent M3 high-contrast styling to chips throughout the app
Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.
Basado en la clasificación ocupacional SOC
Guidelines for managing Varisankya releases across Beta and Production tracks.
How to safely record extra payments without advancing the Varisankya subscription next due date.
Instructions for extracting the Play Store upload keystore, Firebase JSON, and passwords from Bitwarden.
Standard operating procedure for concluding an AI agent session and ensuring workspace integrity.
Guidelines for compiling Varisankya from the CLI without Android Studio.
How to correctly handle custom dates for extra subscription payments using MaterialDatePicker.
| name | High-Contrast Chip Styling |
| description | How to apply consistent M3 high-contrast styling to chips throughout the app |
This skill documents the M3E Expressive standard for chips in Varisankya.
| State | Background | Text | Shape | Stroke |
|---|---|---|---|---|
| Selected | colorPrimary | colorOnPrimary | 20dp Rounded Rect | 0dp |
| Unselected | colorSurfaceContainerHigh | colorOnSurface | Pill (100dp) | 0.8dp (colorTertiary) |
In M3E, selected states are more pronounced. We move away from the standard 8-12dp radius to a 20dp corner for selected chips. This creates a more distinct "morphed" feeling when toggling.
Standardized logic for programmatic chips:
fun styleChip(chip: Chip) {
// ... styling logic ...
// M3E Expressive: Tactile Spring
AnimationHelper.applySpringOnTouch(chip)
}
All chips MUST include AnimationHelper.applySpringOnTouch(). This provides a "morphed" squish effect when toggling, making the selection feel physical.
Never use sharp corners (< 12dp) for interactive chips. They must feel fluid and touchable.