Skip to content

Commit

Permalink
Feature/designsystem (#249)
Browse files Browse the repository at this point in the history 
* Added Chai Title texts

* Added Chai Extra small body texts

* Added Chai small body texts

* Added Chai medium body texts

* Added Chai large body texts

* Added Chai buttons texts

* Added Chai label texts

* Updated the color design tokens

* Added more Chai DS color tokens

* Updated the bottom navigation bar to match the designs

* Updated the homeScreen text and color tokens

* Updated the FeedComponent to match the designs with the text and color tokens

* Updated the FeedShareSection with Design system texts and colors

* Updated the FeedScreen with the Design System texts and colors

* Updated the app's statusBarColor and content color

* Updated the SessionsCard with Chai texts and colors

* Added the sessions page title

* Updated the session screen loading and error components with Chai atoms

* Updated the FeedLoading component colors

* Updated the EventDaySelector Button texts

* Updated the CustomSwitch to match the designs with chai colors and text

* Added the SessionsCardWithBanner component for the agenda layout of the sessions screen

* Updated the about screen with chai texts and colors

* Updated the Speaker component with Chai atoms

* Updated the speaker screen with chai atoms

* Updated the speaker details screen with Chai texts and colors

* Updated the session details screen to match the designs

* Updated the feedbackscreen to match the design colors and text tokens

* Updated the filter bottom sheet view position

* Updated the SessionsFilterPanel with Chai color and text tokens

* Updated the Share modal background color

* Updated the AuthDialog with Chai color and text tokens

* Updated the OrganizedBySection with Chai tokens

* Cleaned up the usage of the DroidconKE2023 Theme in the components

* Cleaned up the usage of the DroidconKE2023 Theme in the tests

* Updated the Feedback screen to pass tests

* Removed the Theme package in the presentation module

* Cleaned up the ChaiDCKE22Theme: removed unused color scheme

* Updated all screens background

* Updated the droidcon Appbars with Chai tokens to match the designs

* Solved merge conflicts
  • Loading branch information
@janewaitara
janewaitara authored Nov 6, 2023
1 parent 11a5fdc commit 17eb9fa
Show file tree
Hide file tree
Showing 60 changed files with 1,737 additions and 1,895 deletions.
86 changes: 4 additions & 82 deletions chai/src/main/java/com/droidconke/chai/Theme.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,119 +18,41 @@ package com.droidconke.chai
import android.app.Activity
import android.content.Context
import android.content.ContextWrapper
import android.os.Build
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.darkColorScheme
import androidx.compose.material3.dynamicDarkColorScheme
import androidx.compose.material3.dynamicLightColorScheme
import androidx.compose.material3.lightColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.ReadOnlyComposable
import androidx.compose.runtime.SideEffect
import androidx.compose.ui.graphics.toArgb
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalView
import androidx.core.view.WindowCompat
import com.droidconke.chai.atoms.*
import com.droidconke.chai.colors.ChaiColors
import com.droidconke.chai.colors.ChaiDarkColorPalette
import com.droidconke.chai.colors.ChaiLightColorPalette
import com.droidconke.chai.colors.LocalChaiColorsPalette

private val LightColors = 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,
onError = md_theme_light_onError,
errorContainer = md_theme_light_errorContainer,
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,
inverseSurface = md_theme_light_inverseSurface,
inverseOnSurface = md_theme_light_inverseOnSurface,
inversePrimary = md_theme_light_inversePrimary,
surfaceTint = md_theme_light_surfaceTint
)

private val DarkColors = 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,
onError = md_theme_dark_onError,
errorContainer = md_theme_dark_errorContainer,
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,
inverseSurface = md_theme_dark_inverseSurface,
inverseOnSurface = md_theme_dark_inverseOnSurface,
inversePrimary = md_theme_dark_inversePrimary,
surfaceTint = md_theme_dark_surfaceTint
)

@Composable
fun ChaiDCKE22Theme(
darkTheme: Boolean = isSystemInDarkTheme(),
dynamicColor: Boolean = true,
content: @Composable () -> Unit
) {
val colorScheme = when {
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
val context = LocalContext.current
if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
}

darkTheme -> DarkColors
else -> LightColors
}
val view = LocalView.current
val customColorsPalette = if (darkTheme) ChaiDarkColorPalette else ChaiLightColorPalette

if (!view.isInEditMode) {
SideEffect {
val activity = view.context.findActivity()
activity.window.statusBarColor = colorScheme.primary.toArgb()
activity.window.statusBarColor = customColorsPalette.background.toArgb()
WindowCompat.getInsetsController(activity.window, view).isAppearanceLightStatusBars =
darkTheme
!darkTheme
}
}

val customColorsPalette = if (darkTheme) ChaiDarkColorPalette else ChaiLightColorPalette

CompositionLocalProvider(
LocalChaiColorsPalette provides customColorsPalette
) {
MaterialTheme(
colorScheme = colorScheme,
content = content
)
}
Expand Down
181 changes: 2 additions & 179 deletions chai/src/main/java/com/droidconke/chai/atoms/Color.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,190 +35,13 @@ val ChaiTeal = Color(0xFF00E2C3)
* these are the Neutrals from the Chai's Design spec document
*/

val ChaiLightGrey90 = Color(0xFFF6F6F8)
val ChaiLightGrey = Color(0xFFF5F5F5)
val ChaiGrey = Color(0xFFB1B1B1)
val ChaiSmokeyGrey = Color(0xFF707070)
val ChaiDarkGrey = Color(0xFF5A5A5A)
val ChaiDarkerGrey = Color(0xFF191d1d)
val ChaiCoal = Color(0xFF191D1D)
val ChaiBlack = Color(0xFF000000)
val ChaiGrey90 = Color(0xFF20201E)
val ChaiTeal90 = Color(0xFF7DE1C3)

/**
* LIGHT PRIMARY
*/
val md_theme_light_primary = Color(0xFF000CEB)
val md_theme_light_onPrimary = Color(0xFFFFFFFF)

/**
* LIGHT PRIMARY CONTAINER
*/
val md_theme_light_primaryContainer = Color(0xFFbabeff)
val md_theme_light_onPrimaryContainer = Color(0xFF00033b)

/**
* LIGHT SECONDARY
*/
val md_theme_light_secondary = Color(0xFFFF6E4D)
val md_theme_light_onSecondary = Color(0xFF000000)

/**
* LIGHT SECONDARY CONTAINER
*/
val md_theme_light_secondaryContainer = Color(0xFFFFDBD2)
val md_theme_light_onSecondaryContainer = Color(0xFF530F00)

/**
* LIGHT TERTIARY
*/
val md_theme_light_tertiary = Color(0xFF00E2C3)
val md_theme_light_onTertiary = Color(0xFF000000)

/**
* LIGHT TERTIARY CONTAINER
*/
val md_theme_light_tertiaryContainer = Color(0xFFb8fff5)
val md_theme_light_onTertiaryContainer = Color(0xFF003831)

/**
* LIGHT ERROR
*/
val md_theme_light_error = Color(0xFFBA1A1A)
val md_theme_light_onError = Color(0xFFFFFFFF)

/**
* LIGHT ERROR CONTAINER
*/
val md_theme_light_errorContainer = Color(0xFFFFDAD6)
val md_theme_light_onErrorContainer = Color(0xFF410002)

/**
* LIGHT BACKGROUND
*/
val md_theme_light_background = Color(0xFFFFFFFF)
val md_theme_light_onBackground = Color(0xFF000000)

/**
* LIGHT SURFACE
*/
val md_theme_light_surface = Color(0xFFEFF7FF)
val md_theme_light_onSurface = Color(0xFF1B1B1F)

/**
* LIGHT SURFACE VARIANT
*/
val md_theme_light_surfaceVariant = Color(0xFFE1E2EC)
val md_theme_light_onSurfaceVariant = Color(0xFF45454f)

/**
* LIGHT SURFACE TINT
*/
val md_theme_light_surfaceTint = Color(0xFF000CEB)
val md_theme_light_surfaceTintColor = Color(0xFF000CEB)

/**
* LIGHT INVERSE COLORS
*/
val md_theme_light_inversePrimary = Color(0xFF9197ff)
val md_theme_light_inverseSurface = Color(0xFF303033)
val md_theme_light_inverseOnSurface = Color(0xFFF2F0F4)

/**
* LIGHT OUTLINE
*/
val md_theme_light_outline = Color(0xFFF5F5F5)

/**
* LIGHT SHADOW
*/
val md_theme_light_shadow = Color(0xFFFAFAFA)

/**
* DARK PRIMARY
*/
val md_theme_dark_primary = Color(0xFFc8cbff)
val md_theme_dark_onPrimary = Color(0xFF00022f)

/**
* DARK PRIMARY CONTAINER
*/
val md_theme_dark_primaryContainer = Color(0xFF00033b)
val md_theme_dark_onPrimaryContainer = Color(0xFFbabeff)

/**
* DARK SECONDARY
*/
val md_theme_dark_secondary = Color(0xFFFF6E4D)
val md_theme_dark_onSecondary = Color(0xFF000000)

/**
* DARK SECONDARY CONTAINER
*/
val md_theme_dark_secondaryContainer = Color(0xFF530F00)
val md_theme_dark_onSecondaryContainer = Color(0xFFFFDBD2)

/**
* DARK TERTIARY
*/
val md_theme_dark_tertiary = Color(0xFF00E2C3)
val md_theme_dark_onTertiary = Color(0xFF000000)

/**
* DARK TERTIARY CONTAINER
*/
val md_theme_dark_tertiaryContainer = Color(0xFF003831)
val md_theme_dark_onTertiaryContainer = Color(0xFFb8fff5)

/**
* DARK ERROR
*/
val md_theme_dark_error = Color(0xFFF19D9D)
val md_theme_dark_onError = Color(0xFF000000)

/**
* DARK ERROR CONTAINER
*/
val md_theme_dark_errorContainer = Color(0xFF410002)
val md_theme_dark_onErrorContainer = Color(0xFFFFDAD6)

/**
* DARK BACKGROUND
*/
val md_theme_dark_background = Color(0xFF20201E)
val md_theme_dark_onBackground = Color(0xFFFFFFFF)

/**
* DARK SURFACE
*/
val md_theme_dark_surface = Color(0xFF000000)
val md_theme_dark_onSurface = Color(0xFFFFFFFF)

/**
* DARK SURFACE VARIANT
*/
val md_theme_dark_surfaceVariant = Color(0xFFE1E2EC)
val md_theme_dark_onSurfaceVariant = Color(0xFF45454f)

/**
* DARK SURFACE TINT
*/
val md_theme_dark_surfaceTint = Color(0xFF7DE1C3)
val md_theme_dark_surfaceTintColor = Color(0xFF7DE1C3)

/**
* DARK INVERSE COLORS
*/
val md_theme_dark_inversePrimary = Color(0xFF9197ff)
val md_theme_dark_inverseSurface = Color(0xFF303033)
val md_theme_dark_inverseOnSurface = Color(0xFFF2F0F4)

/**
* DARK OUTLINE
*/
val md_theme_dark_outline = Color(0xFF000000)

/**
* DARK SHADOW
*/
val md_theme_dark_shadow = Color(0xFFFAFAFA)
val ChaiSubtleGrey = Color(0xFF383836)
Loading

0 comments on commit 17eb9fa

Please sign in to comment.