diff --git a/NOTICE.txt b/NOTICE.txt index f5ebed33..376eef05 100644 --- a/NOTICE.txt +++ b/NOTICE.txt @@ -21,6 +21,36 @@ app/src/main/res/drawable/ic_spacing.xml app/src/main/res/drawable/ic_ui_dark_mode.xml app/src/main/res/drawable/ic_ui_light_mode.xml app/src/main/res/drawable/il_opacity_union.xml +app/src/main/res/drawable-hdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-hdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-hdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-mdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-mdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-mdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-xhdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-xhdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-xhdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-xxhdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-xxhdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-xxhdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-xxxhdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-xxxhdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-xxxhdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-night-hdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-night-hdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-night-hdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-night-mdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-night-mdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-night-mdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-night-xhdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-night-xhdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-night-xhdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_min_width.png +app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_column_margin.png +app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_max_width.png +app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_min_width.png docs/images/favicon-16x16.png docs/images/orange-logo.svg diff --git a/app/src/main/java/com/orange/ouds/app/ui/tokens/TokenCategoryDetailScreen.kt b/app/src/main/java/com/orange/ouds/app/ui/tokens/TokenCategoryDetailScreen.kt index 1a758cfd..3e1313eb 100644 --- a/app/src/main/java/com/orange/ouds/app/ui/tokens/TokenCategoryDetailScreen.kt +++ b/app/src/main/java/com/orange/ouds/app/ui/tokens/TokenCategoryDetailScreen.kt @@ -12,6 +12,8 @@ package com.orange.ouds.app.ui.tokens +import androidx.compose.foundation.Image +import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues @@ -25,6 +27,7 @@ import androidx.compose.foundation.lazy.items import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.TextStyle import androidx.compose.ui.text.style.TextOverflow @@ -52,6 +55,10 @@ fun TokenCategoryDetailScreen(tokenCategory: TokenCategory, onSubcategoryClick: descriptionRes = tokenCategory.descriptionRes, imageRes = tokenCategory.imageRes ) + + if (tokenCategory == TokenCategory.Grid) { + GridIllustrations() + } } if (tokenCategory.subcategories.isNotEmpty()) { @@ -169,6 +176,36 @@ private fun TokenIllustration(tokenProperty: TokenProperty, token: Token) = is TokenProperty.Typography, TokenProperty.Grid -> Unit } +@Composable +private fun GridIllustrations() { + Image( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = OudsSpacingFixedKeyToken.Medium.value) + .background(OudsColorKeyToken.OnSurface.value), //TODO use BgEmphasizedPrimary token when available + painter = painterResource(id = R.drawable.il_tokens_grid_column_margin), + contentDescription = null + ) + Image( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = OudsSpacingFixedKeyToken.Medium.value) + .padding(top = OudsSpacingFixedKeyToken.Medium.value) + .background(OudsColorKeyToken.OnSurface.value), //TODO use BgEmphasizedPrimary token when available + painter = painterResource(id = R.drawable.il_tokens_grid_min_width), + contentDescription = null + ) + Image( + modifier = Modifier + .fillMaxWidth() + .padding(horizontal = OudsSpacingFixedKeyToken.Medium.value) + .padding(top = OudsSpacingFixedKeyToken.Medium.value) + .background(OudsColorKeyToken.OnSurface.value), //TODO use BgEmphasizedPrimary token when available + painter = painterResource(id = R.drawable.il_tokens_grid_max_width), + contentDescription = null + ) +} + @UiModePreviews.Default @Composable private fun PreviewTokenCategoryDetailScreen( @@ -182,5 +219,6 @@ private class TokenCategoryDetailScreenPreviewParameterProvider : BasicPreviewPa private val previewParameterValues: List get() = listOf( TokenCategory.Opacity, - TokenCategory.Elevation + TokenCategory.Elevation, + TokenCategory.Grid ) \ No newline at end of file diff --git a/app/src/main/res/drawable-hdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-hdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..1ae4ef4a Binary files /dev/null and b/app/src/main/res/drawable-hdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-hdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-hdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..b285e6a5 Binary files /dev/null and b/app/src/main/res/drawable-hdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-hdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-hdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..b61e5cad Binary files /dev/null and b/app/src/main/res/drawable-hdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-mdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-mdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..5b8ac22f Binary files /dev/null and b/app/src/main/res/drawable-mdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-mdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-mdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..2984b8e8 Binary files /dev/null and b/app/src/main/res/drawable-mdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-mdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-mdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..4ebc3c11 Binary files /dev/null and b/app/src/main/res/drawable-mdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-night-hdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-night-hdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..311d3a7c Binary files /dev/null and b/app/src/main/res/drawable-night-hdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-night-hdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-night-hdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..0daae302 Binary files /dev/null and b/app/src/main/res/drawable-night-hdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-night-hdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-night-hdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..7dda0312 Binary files /dev/null and b/app/src/main/res/drawable-night-hdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-night-mdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-night-mdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..aecea085 Binary files /dev/null and b/app/src/main/res/drawable-night-mdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-night-mdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-night-mdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..0c394643 Binary files /dev/null and b/app/src/main/res/drawable-night-mdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-night-mdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-night-mdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..2c28a0c1 Binary files /dev/null and b/app/src/main/res/drawable-night-mdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..741f740a Binary files /dev/null and b/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..817fb52d Binary files /dev/null and b/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..0585141b Binary files /dev/null and b/app/src/main/res/drawable-night-xhdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..d1c5bb1b Binary files /dev/null and b/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..0dd45f94 Binary files /dev/null and b/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..5f0d109c Binary files /dev/null and b/app/src/main/res/drawable-night-xxhdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..d1c5bb1b Binary files /dev/null and b/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..0dd45f94 Binary files /dev/null and b/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..5f0d109c Binary files /dev/null and b/app/src/main/res/drawable-night-xxxhdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-xhdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-xhdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..09f936f9 Binary files /dev/null and b/app/src/main/res/drawable-xhdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-xhdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-xhdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..dd885145 Binary files /dev/null and b/app/src/main/res/drawable-xhdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-xhdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-xhdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..d35067db Binary files /dev/null and b/app/src/main/res/drawable-xhdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-xxhdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-xxhdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..381ad2f5 Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-xxhdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-xxhdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..140a3ea2 Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-xxhdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-xxhdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..856d1384 Binary files /dev/null and b/app/src/main/res/drawable-xxhdpi/il_tokens_grid_min_width.png differ diff --git a/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_column_margin.png b/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_column_margin.png new file mode 100644 index 00000000..bca049c3 Binary files /dev/null and b/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_column_margin.png differ diff --git a/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_max_width.png b/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_max_width.png new file mode 100644 index 00000000..5d984120 Binary files /dev/null and b/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_max_width.png differ diff --git a/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_min_width.png b/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_min_width.png new file mode 100644 index 00000000..f189a900 Binary files /dev/null and b/app/src/main/res/drawable-xxxhdpi/il_tokens_grid_min_width.png differ