Repo created

app-ui-catalog/README.md

@@ -0,0 +1,7 @@
+# Thunderbird UI Catalog
+
+Uses [`:core:ui:compose:designsystem`](../core/ui/compose/designsystem/README.md)
+
+This is a catalog of all the components in the Thunderbird design system.
+
+It is a work in progress, and will be updated as the design system evolves.

app-ui-catalog/build.gradle.kts

@@ -0,0 +1,21 @@
+plugins {
+    id(ThunderbirdPlugins.App.androidCompose)
+}
+
+android {
+    namespace = "app.k9mail.ui.catalog"
+
+    defaultConfig {
+        applicationId = "app.k9mail.ui.catalog"
+        versionCode = 1
+        versionName = "1.0"
+    }
+}
+
+dependencies {
+    implementation(projects.core.ui.compose.designsystem)
+    implementation(libs.androidx.compose.material)
+
+    androidTestImplementation(libs.androidx.test.ext.junit.ktx)
+    androidTestImplementation(libs.androidx.test.espresso.core)
+}

app-ui-catalog/proguard-rules.pro

@@ -0,0 +1,21 @@
+# Add project specific ProGuard rules here.
+# You can control the set of applied configuration files using the
+# proguardFiles setting in build.gradle.
+#
+# For more details, see
+#   http://developer.android.com/guide/developing/tools/proguard.html
+
+# If your project uses WebView with JS, uncomment the following
+# and specify the fully qualified class name to the JavaScript interface
+# class:
+#-keepclassmembers class fqcn.of.javascript.interface.for.webview {
+#   public *;
+#}
+
+# Uncomment this to preserve the line number information for
+# debugging stack traces.
+#-keepattributes SourceFile,LineNumberTable
+
+# If you keep the line number information, uncomment this to
+# hide the original source file name.
+#-renamesourcefileattribute SourceFile

app-ui-catalog/src/main/AndroidManifest.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <application
+        android:allowBackup="true"
+        android:icon="@mipmap/ic_launcher"
+        android:roundIcon="@mipmap/ic_launcher_round"
+        android:label="@string/app_name"
+        android:supportsRtl="true"
+        android:theme="@style/Theme.Thunderbird"
+        >
+        <activity
+            android:name=".CatalogActivity"
+            android:exported="true">
+            <intent-filter>
+                <action android:name="android.intent.action.MAIN" />
+
+                <category android:name="android.intent.category.LAUNCHER" />
+            </intent-filter>
+        </activity>
+    </application>
+
+</manifest>

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogActivity.kt

@@ -0,0 +1,18 @@
+package app.k9mail.ui.catalog
+
+import android.os.Bundle
+import androidx.activity.ComponentActivity
+import androidx.activity.compose.setContent
+import androidx.core.view.WindowCompat
+
+class CatalogActivity : ComponentActivity() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+
+        setContent {
+            CatalogScreen()
+        }
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogContent.kt

@@ -0,0 +1,89 @@
+package app.k9mail.ui.catalog
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.grid.GridCells
+import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import app.k9mail.core.ui.compose.common.DevicePreviews
+import app.k9mail.core.ui.compose.designsystem.atom.Surface
+import app.k9mail.core.ui.compose.designsystem.template.ResponsiveContent
+import app.k9mail.core.ui.compose.theme.K9Theme
+import app.k9mail.core.ui.compose.theme.MainTheme
+import app.k9mail.core.ui.compose.theme.ThunderbirdTheme
+import app.k9mail.ui.catalog.items.buttonItems
+import app.k9mail.ui.catalog.items.colorItems
+import app.k9mail.ui.catalog.items.imageItems
+import app.k9mail.ui.catalog.items.selectionControlItems
+import app.k9mail.ui.catalog.items.textFieldItems
+import app.k9mail.ui.catalog.items.themeHeaderItem
+import app.k9mail.ui.catalog.items.themeSelectorItems
+import app.k9mail.ui.catalog.items.typographyItems
+
+@Composable
+fun CatalogContent(
+    catalogTheme: CatalogTheme,
+    catalogThemeVariant: CatalogThemeVariant,
+    onThemeChange: () -> Unit,
+    onThemeVariantChange: () -> Unit,
+    contentPadding: PaddingValues,
+    modifier: Modifier = Modifier,
+) {
+    Surface {
+        ResponsiveContent {
+            LazyVerticalGrid(
+                columns = GridCells.Adaptive(300.dp),
+                contentPadding = contentPadding,
+                horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.double),
+                verticalArrangement = Arrangement.spacedBy(MainTheme.spacings.double),
+                modifier = modifier.padding(MainTheme.spacings.double),
+            ) {
+                themeHeaderItem(text = "Thunderbird Catalog")
+                themeSelectorItems(
+                    catalogTheme = catalogTheme,
+                    catalogThemeVariant = catalogThemeVariant,
+                    onThemeChange = onThemeChange,
+                    onThemeVariantChange = onThemeVariantChange,
+                )
+
+                typographyItems()
+                colorItems()
+                buttonItems()
+                selectionControlItems()
+                textFieldItems()
+                imageItems()
+            }
+        }
+    }
+}
+
+@DevicePreviews
+@Composable
+internal fun CatalogContentK9ThemePreview() {
+    K9Theme {
+        CatalogContent(
+            catalogTheme = CatalogTheme.K9,
+            catalogThemeVariant = CatalogThemeVariant.LIGHT,
+            onThemeChange = {},
+            onThemeVariantChange = {},
+            contentPadding = PaddingValues(),
+        )
+    }
+}
+
+@DevicePreviews
+@Composable
+internal fun CatalogContentThunderbirdThemePreview() {
+    ThunderbirdTheme {
+        CatalogContent(
+            catalogTheme = CatalogTheme.THUNDERBIRD,
+            catalogThemeVariant = CatalogThemeVariant.LIGHT,
+            onThemeChange = {},
+            onThemeVariantChange = {},
+            contentPadding = PaddingValues(),
+        )
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogScreen.kt

@@ -0,0 +1,50 @@
+package app.k9mail.ui.catalog
+
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.systemBars
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import app.k9mail.core.ui.compose.common.DevicePreviews
+
+@Composable
+fun CatalogScreen(
+    modifier: Modifier = Modifier,
+) {
+    val themeState = remember { mutableStateOf(CatalogTheme.K9) }
+    val themeVariantState = remember { mutableStateOf(CatalogThemeVariant.LIGHT) }
+
+    CatalogThemeSwitch(theme = themeState.value, themeVariation = themeVariantState.value) {
+        val contentPadding = WindowInsets.systemBars.asPaddingValues()
+
+        CatalogContent(
+            catalogTheme = themeState.value,
+            catalogThemeVariant = themeVariantState.value,
+            onThemeChange = {
+                themeState.value = when (themeState.value) {
+                    CatalogTheme.K9 -> CatalogTheme.THUNDERBIRD
+                    CatalogTheme.THUNDERBIRD -> CatalogTheme.K9
+                }
+            },
+            onThemeVariantChange = {
+                themeVariantState.value = when (themeVariantState.value) {
+                    CatalogThemeVariant.LIGHT -> CatalogThemeVariant.DARK
+                    CatalogThemeVariant.DARK -> CatalogThemeVariant.LIGHT
+                }
+            },
+            contentPadding = contentPadding,
+            modifier = Modifier
+                .fillMaxSize()
+                .then(modifier),
+        )
+    }
+}
+
+@DevicePreviews
+@Composable
+internal fun CatalogScreenPreview() {
+    CatalogScreen()
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogTheme.kt

@@ -0,0 +1,13 @@
+package app.k9mail.ui.catalog
+
+enum class CatalogTheme(
+    private val displayName: String,
+) {
+    K9("K-9"),
+    THUNDERBIRD("Thunderbird"),
+    ;
+
+    override fun toString(): String {
+        return displayName
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogThemeSelector.kt

@@ -0,0 +1,29 @@
+package app.k9mail.ui.catalog
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import app.k9mail.core.ui.compose.designsystem.atom.button.Button
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextBody1
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+@Composable
+fun CatalogThemeSelector(
+    catalogTheme: CatalogTheme,
+    modifier: Modifier = Modifier,
+    onThemeChangeClick: () -> Unit,
+) {
+    Row(
+        modifier = modifier,
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.default),
+    ) {
+        TextBody1(text = "Change theme:")
+        Button(
+            text = catalogTheme.toString(),
+            onClick = onThemeChangeClick,
+        )
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogThemeSwitch.kt

@@ -0,0 +1,26 @@
+package app.k9mail.ui.catalog
+
+import androidx.compose.runtime.Composable
+import app.k9mail.core.ui.compose.theme.K9Theme
+import app.k9mail.core.ui.compose.theme.ThunderbirdTheme
+
+@Composable
+fun CatalogThemeSwitch(
+    theme: CatalogTheme,
+    themeVariation: CatalogThemeVariant,
+    content: @Composable () -> Unit,
+) {
+    when (theme) {
+        CatalogTheme.K9 -> K9Theme(
+            darkTheme = isDarkVariation(themeVariation),
+            content = content,
+        )
+        CatalogTheme.THUNDERBIRD -> ThunderbirdTheme(
+            darkTheme = isDarkVariation(themeVariation),
+            content = content,
+        )
+    }
+}
+
+private fun isDarkVariation(themeVariation: CatalogThemeVariant): Boolean =
+    themeVariation == CatalogThemeVariant.DARK

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogThemeVariant.kt

@@ -0,0 +1,5 @@
+package app.k9mail.ui.catalog
+
+enum class CatalogThemeVariant {
+    LIGHT, DARK
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/CatalogThemeVariantSelector.kt

@@ -0,0 +1,29 @@
+package app.k9mail.ui.catalog
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import app.k9mail.core.ui.compose.designsystem.atom.Checkbox
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextBody1
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+@Composable
+fun CatalogThemeVariantSelector(
+    catalogThemeVariant: CatalogThemeVariant,
+    modifier: Modifier = Modifier,
+    onThemeVariantChange: () -> Unit,
+) {
+    Row(
+        modifier = modifier,
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.default),
+    ) {
+        TextBody1(text = "Set dark mode:")
+        Checkbox(
+            checked = catalogThemeVariant == CatalogThemeVariant.DARK,
+            onCheckedChange = { onThemeVariantChange() },
+        )
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/ButtonItems.kt

@@ -0,0 +1,40 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import app.k9mail.core.ui.compose.designsystem.atom.button.Button
+import app.k9mail.core.ui.compose.designsystem.atom.button.ButtonOutlined
+import app.k9mail.core.ui.compose.designsystem.atom.button.ButtonText
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+fun LazyGridScope.buttonItems() {
+    sectionHeaderItem(text = "Buttons")
+    sectionSubtitleItem(text = "Contained")
+    item {
+        Row(
+            horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.default),
+        ) {
+            Button(text = "Enabled", onClick = { })
+            Button(text = "Disabled", onClick = { }, enabled = false)
+        }
+    }
+    sectionSubtitleItem(text = "Outlined")
+    item {
+        Row(
+            horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.default),
+        ) {
+            ButtonOutlined(text = "Enabled", onClick = { })
+            ButtonOutlined(text = "Disabled", onClick = { }, enabled = false)
+        }
+    }
+    sectionSubtitleItem(text = "Text")
+    item {
+        Row(
+            horizontalArrangement = Arrangement.spacedBy(MainTheme.spacings.default),
+        ) {
+            ButtonText(text = "Enabled", onClick = { })
+            ButtonText(text = "Disabled", onClick = { }, enabled = false)
+        }
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/ColorItems.kt

@@ -0,0 +1,78 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import app.k9mail.core.ui.compose.designsystem.atom.Surface
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextBody1
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+fun LazyGridScope.colorItems() {
+    sectionHeaderItem(text = "Colors")
+    item {
+        ColorContent(
+            name = "Primary",
+            color = MainTheme.colors.primary,
+        )
+    }
+    item {
+        ColorContent(
+            name = "Primary Variant",
+            color = MainTheme.colors.primaryVariant,
+        )
+    }
+    item {
+        ColorContent(
+            name = "Secondary",
+            color = MainTheme.colors.secondary,
+        )
+    }
+    item {
+        ColorContent(
+            name = "Secondary Variant",
+            color = MainTheme.colors.secondaryVariant,
+        )
+    }
+    item {
+        ColorContent(
+            name = "Background",
+            color = MainTheme.colors.background,
+        )
+    }
+    item {
+        ColorContent(
+            name = "Surface",
+            color = MainTheme.colors.surface,
+        )
+    }
+    item {
+        ColorContent(
+            name = "Error",
+            color = MainTheme.colors.error,
+        )
+    }
+}
+
+@Composable
+private fun ColorContent(
+    name: String,
+    color: Color,
+    modifier: Modifier = Modifier,
+) {
+    Surface(
+        color = color,
+    ) {
+        Row(
+            verticalAlignment = Alignment.CenterVertically,
+            horizontalArrangement = Arrangement.Center,
+            modifier = modifier.padding(MainTheme.spacings.double),
+        ) {
+            TextBody1(text = name)
+        }
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/ImageItems.kt

@@ -0,0 +1,13 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.ui.res.painterResource
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+fun LazyGridScope.imageItems() {
+    sectionHeaderItem(text = "Images")
+    item {
+        Image(painter = painterResource(id = MainTheme.images.logo), contentDescription = "logo")
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/SectionHeaderItem.kt

@@ -0,0 +1,16 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.grid.GridItemSpan
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.ui.Modifier
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline6
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+fun LazyGridScope.sectionHeaderItem(
+    text: String,
+) {
+    item(span = { GridItemSpan(maxLineSpan) }) {
+        TextHeadline6(text = text, modifier = Modifier.padding(top = MainTheme.spacings.default))
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/SectionSubtitleItem.kt

@@ -0,0 +1,16 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.grid.GridItemSpan
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.ui.Modifier
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextSubtitle1
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+fun LazyGridScope.sectionSubtitleItem(
+    text: String,
+) {
+    item(span = { GridItemSpan(maxLineSpan) }) {
+        TextSubtitle1(text = text, modifier = Modifier.padding(top = MainTheme.spacings.default))
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/SelectionControlItems.kt

@@ -0,0 +1,39 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import app.k9mail.core.ui.compose.designsystem.atom.Checkbox
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextCaption
+
+fun LazyGridScope.selectionControlItems() {
+    sectionHeaderItem(text = "Selection Controls")
+    sectionSubtitleItem(text = "Checkbox")
+    captionItem(caption = "Checked") {
+        Checkbox(checked = true, onCheckedChange = {})
+    }
+    captionItem(caption = "Unchecked") {
+        Checkbox(checked = false, onCheckedChange = {})
+    }
+    captionItem(caption = "Disabled Checked") {
+        Checkbox(checked = true, onCheckedChange = {}, enabled = false)
+    }
+    captionItem(caption = "Disabled") {
+        Checkbox(checked = false, onCheckedChange = {}, enabled = false)
+    }
+}
+
+private fun LazyGridScope.captionItem(
+    caption: String,
+    content: @Composable () -> Unit,
+) {
+    item {
+        Column(
+            horizontalAlignment = Alignment.CenterHorizontally,
+        ) {
+            content()
+            TextCaption(text = caption)
+        }
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/TextFieldItems.kt

@@ -0,0 +1,90 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.MutableState
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import app.k9mail.core.ui.compose.designsystem.atom.textfield.PasswordTextFieldOutlined
+import app.k9mail.core.ui.compose.designsystem.atom.textfield.TextFieldOutlined
+
+fun LazyGridScope.textFieldItems() {
+    sectionHeaderItem(text = "Text fields")
+    textFieldOutlinedItems()
+    passwordTextFieldOutlinedItems()
+}
+
+private fun LazyGridScope.textFieldOutlinedItems() {
+    sectionSubtitleItem(text = "Outlined")
+    item {
+        WithRememberedInput(text = "Initial text") { input ->
+            TextFieldOutlined(
+                value = input.value,
+                label = "Label",
+                onValueChange = { input.value = it },
+            )
+        }
+    }
+    item {
+        WithRememberedInput(text = "Input text with error") { input ->
+            TextFieldOutlined(
+                value = input.value,
+                label = "Label",
+                onValueChange = { input.value = it },
+                isError = true,
+            )
+        }
+    }
+    item {
+        WithRememberedInput(text = "Input text disabled") { input ->
+            TextFieldOutlined(
+                value = input.value,
+                label = "Label",
+                onValueChange = { input.value = it },
+                enabled = false,
+            )
+        }
+    }
+}
+
+private fun LazyGridScope.passwordTextFieldOutlinedItems() {
+    sectionSubtitleItem(text = "Password outlined")
+    item {
+        WithRememberedInput(text = "Input text") { input ->
+            PasswordTextFieldOutlined(
+                value = input.value,
+                label = "Label",
+                onValueChange = { input.value = it },
+            )
+        }
+    }
+    item {
+        WithRememberedInput(text = "Input text with error") { input ->
+            PasswordTextFieldOutlined(
+                value = input.value,
+                label = "Label",
+                onValueChange = { input.value = it },
+                isError = true,
+            )
+        }
+    }
+    item {
+        WithRememberedInput(text = "Input text disabled") { input ->
+            PasswordTextFieldOutlined(
+                value = input.value,
+                label = "Label",
+                onValueChange = { input.value = it },
+                enabled = false,
+            )
+        }
+    }
+}
+
+@Composable
+private fun WithRememberedInput(
+    text: String,
+    content: @Composable (text: MutableState<String>) -> Unit,
+) {
+    val inputText = remember { mutableStateOf(text) }
+    content(inputText)
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/ThemeHeaderItem.kt

@@ -0,0 +1,16 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.grid.GridItemSpan
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.ui.Modifier
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline4
+import app.k9mail.core.ui.compose.theme.MainTheme
+
+fun LazyGridScope.themeHeaderItem(
+    text: String,
+) {
+    item(span = { GridItemSpan(maxLineSpan) }) {
+        TextHeadline4(text = text, modifier = Modifier.padding(top = MainTheme.spacings.default))
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/ThemeSelectorItems.kt

@@ -0,0 +1,31 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import androidx.compose.ui.Modifier
+import app.k9mail.ui.catalog.CatalogTheme
+import app.k9mail.ui.catalog.CatalogThemeSelector
+import app.k9mail.ui.catalog.CatalogThemeVariant
+import app.k9mail.ui.catalog.CatalogThemeVariantSelector
+
+fun LazyGridScope.themeSelectorItems(
+    catalogTheme: CatalogTheme,
+    catalogThemeVariant: CatalogThemeVariant,
+    onThemeChange: () -> Unit,
+    onThemeVariantChange: () -> Unit,
+) {
+    item {
+        CatalogThemeSelector(
+            catalogTheme = catalogTheme,
+            modifier = Modifier.fillMaxWidth(),
+            onThemeChangeClick = onThemeChange,
+        )
+    }
+    item {
+        CatalogThemeVariantSelector(
+            catalogThemeVariant = catalogThemeVariant,
+            modifier = Modifier.fillMaxWidth(),
+            onThemeVariantChange = onThemeVariantChange,
+        )
+    }
+}

app-ui-catalog/src/main/java/app/k9mail/ui/catalog/items/TypographyItems.kt

@@ -0,0 +1,33 @@
+package app.k9mail.ui.catalog.items
+
+import androidx.compose.foundation.lazy.grid.LazyGridScope
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextBody1
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextBody2
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextButton
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextCaption
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline1
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline2
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline3
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline4
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline5
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextHeadline6
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextOverline
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextSubtitle1
+import app.k9mail.core.ui.compose.designsystem.atom.text.TextSubtitle2
+
+fun LazyGridScope.typographyItems() {
+    sectionHeaderItem(text = "Typography")
+    item { TextHeadline1(text = "Headline1") }
+    item { TextHeadline2(text = "Headline2") }
+    item { TextHeadline3(text = "Headline3") }
+    item { TextHeadline4(text = "Headline4") }
+    item { TextHeadline5(text = "Headline5") }
+    item { TextHeadline6(text = "Headline6") }
+    item { TextSubtitle1(text = "Subtitle1") }
+    item { TextSubtitle2(text = "Subtitle2") }
+    item { TextBody1(text = "Body1") }
+    item { TextBody2(text = "Body2") }
+    item { TextButton(text = "Button") }
+    item { TextCaption(text = "Caption") }
+    item { TextOverline(text = "Overline") }
+}

app-ui-catalog/src/main/res/drawable-v24/ic_launcher_foreground.xml

@@ -0,0 +1,149 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="192"
+    android:viewportHeight="192">
+  <group android:scaleX="0.52411765"
+      android:scaleY="0.52411765"
+      android:translateX="45.684708"
+      android:translateY="44.75294">
+    <path
+        android:pathData="M50,12C46.68,12 44,14.68 44,18V26C44,29.32 46.68,32 50,32H64V48H72V32H74C77.32,32 80,29.32 80,26V18C80,14.68 77.32,12 74,12H50ZM118,12C114.68,12 112,14.68 112,18V26C112,29.32 114.68,32 118,32H120V48H128V32H142C145.32,32 148,29.32 148,26V18C148,14.68 145.32,12 142,12H118ZM32,120V132L57.61,170C59.68,173.59 63.54,176 68,176H124C128.46,176 132.32,173.59 134.39,170H134.4L160,132V120H32Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#000000"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M50,8C46.68,8 44,10.68 44,14V22C44,25.32 46.68,28 50,28H64V44H72V28H74C77.32,28 80,25.32 80,22V14C80,10.68 77.32,8 74,8H50ZM118,8C114.68,8 112,10.68 112,14V22C112,25.32 114.68,28 118,28H120V44H128V28H142C145.32,28 148,25.32 148,22V14C148,10.68 145.32,8 142,8H118ZM32,116V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128V116H32Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#000000"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M24,116L32,128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128L168,116H24Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#000000"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M32,116V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160.01,128V116H32Z"
+        android:fillColor="#607D8B"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="M72,16H64V44H72V16Z"
+        android:fillColor="#263238"/>
+    <path
+        android:pathData="M128,16H120V44H128V16Z"
+        android:fillColor="#263238"/>
+    <path
+        android:pathData="M32,127V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128V127L134.4,165H134.39C132.32,168.59 128.46,171 124,171H68C63.54,171 59.68,168.59 57.61,165L32,127Z"
+        android:fillColor="#4D6570"/>
+    <path
+        android:pathData="M80,22V14C80,10.69 77.31,8 74,8L50,8C46.69,8 44,10.69 44,14V22C44,25.31 46.69,28 50,28L74,28C77.31,28 80,25.31 80,22Z"
+        android:fillColor="#607D8B"/>
+    <path
+        android:pathData="M148,22V14C148,10.69 145.31,8 142,8L118,8C114.69,8 112,10.69 112,14V22C112,25.31 114.69,28 118,28L142,28C145.31,28 148,25.31 148,22Z"
+        android:fillColor="#607D8B"/>
+    <path
+        android:pathData="M44,21V22C44,25.32 46.68,28 50,28H74C77.32,28 80,25.32 80,22V21C80,24.32 77.32,27 74,27H50C46.68,27 44,24.32 44,21Z"
+        android:fillColor="#4D6570"/>
+    <path
+        android:pathData="M112,21V22C112,25.32 114.68,28 118,28H142C145.32,28 148,25.32 148,22V21C148,24.32 145.32,27 142,27H118C114.68,27 112,24.32 112,21Z"
+        android:fillColor="#4D6570"/>
+    <path
+        android:pathData="M50,8C46.68,8 44,10.68 44,14V15C44,11.68 46.68,9 50,9H74C77.32,9 80,11.68 80,15V14C80,10.68 77.32,8 74,8H50Z"
+        android:fillColor="#8097A2"/>
+    <path
+        android:pathData="M118,8C114.68,8 112,10.68 112,14V15C112,11.68 114.68,9 118,9H142C145.32,9 148,11.68 148,15V14C148,10.68 145.32,8 142,8H118Z"
+        android:fillColor="#8097A2"/>
+    <path
+        android:pathData="M32,116V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128V116H32Z"
+        android:fillType="evenOdd">
+      <aapt:attr name="android:fillColor">
+        <gradient 
+            android:startX="80"
+            android:startY="112"
+            android:endX="80"
+            android:endY="140"
+            android:type="linear">
+          <item android:offset="0" android:color="#FF4D6570"/>
+          <item android:offset="1" android:color="#0F4D6570"/>
+        </gradient>
+      </aapt:attr>
+    </path>
+    <path
+        android:pathData="M171.99,120V52C171.99,45.37 166.62,40 159.99,40L31.99,40C25.37,40 19.99,45.37 19.99,52V120C19.99,126.62 25.37,132 31.99,132H159.99C166.62,132 171.99,126.62 171.99,120Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#37abc8"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M171.99,116V48C171.99,41.37 166.62,36 159.99,36L31.99,36C25.37,36 19.99,41.37 19.99,48V116C19.99,122.62 25.37,128 31.99,128L159.99,128C166.62,128 171.99,122.62 171.99,116Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#5fbcd3"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M172,116V48C172,41.37 166.63,36 160,36L32,36C25.37,36 20,41.37 20,48V116C20,122.63 25.37,128 32,128H160C166.63,128 172,122.63 172,116Z"
+        android:fillColor="#ff9955"/>
+    <path
+        android:pathData="M36,52L96,84L156,52"
+        android:strokeWidth="6"
+        android:fillColor="#00000000"
+        android:strokeColor="#FBE9E7"
+        android:strokeLineCap="round"/>
+    <path
+        android:pathData="M32,36C25.35,36 20,41.35 20,48V49C20,42.35 25.35,37 32,37H160C166.65,37 172,42.35 172,49V48C172,41.35 166.65,36 160,36H32Z"
+        android:fillColor="#ff9955"/>
+    <path
+        android:pathData="M20,115V116C20,122.65 25.35,128 32,128H160C166.65,128 172,122.65 172,116V115C172,121.65 166.65,127 160,127H32C25.35,127 20,121.65 20,115Z"
+        android:fillColor="#ff7f2a"/>
+    <path
+        android:pathData="M90,156C86.68,156 84,158.68 84,162V174C84,174.27 84.03,174.54 84.06,174.8C84.06,174.8 84.06,174.81 84.06,174.81C84.02,175.2 84,175.6 84,176C84,179.18 85.26,182.23 87.51,184.48C89.77,186.73 92.82,188 96,188C99.18,188 102.24,186.73 104.49,184.48C106.74,182.23 108,179.18 108,176C108,175.61 107.97,175.23 107.93,174.85C107.97,174.57 108,174.29 108,174V162C108,158.67 105.33,156 102,156L90,156Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#000000"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M90,152C86.68,152 84,154.68 84,158V170C84,170.27 84.03,170.54 84.06,170.8C84.06,170.8 84.06,170.81 84.06,170.81C84.02,171.2 84,171.6 84,172C84,175.18 85.26,178.23 87.51,180.48C89.77,182.73 92.82,184 96,184C99.18,184 102.24,182.73 104.49,180.48C106.74,178.23 108,175.18 108,172C108,171.61 107.97,171.23 107.93,170.85C107.97,170.57 108,170.29 108,170V158C108,154.67 105.33,152 102,152L90,152Z"
+        android:strokeAlpha="0.2"
+        android:fillColor="#000000"
+        android:fillAlpha="0.2"/>
+    <path
+        android:pathData="M108,170V158C108,154.69 105.31,152 102,152H90C86.69,152 84,154.69 84,158V170C84,173.31 86.69,176 90,176H102C105.31,176 108,173.31 108,170Z"
+        android:fillColor="#263238"/>
+    <path
+        android:pathData="M96,184C102.63,184 108,178.63 108,172C108,165.37 102.63,160 96,160C89.37,160 84,165.37 84,172C84,178.63 89.37,184 96,184Z"
+        android:fillColor="#263238"/>
+    <path
+        android:pathData="M90,152C86.68,152 84,154.68 84,158V159C84,155.68 86.68,153 90,153H102C105.32,153 108,155.68 108,159V158C108,154.68 105.32,152 102,152H90Z"
+        android:fillColor="#37474F"/>
+    <path
+        android:pathData="M84.02,171.43C84.01,171.62 84,171.81 84,172C84,175.18 85.26,178.24 87.51,180.49C89.77,182.74 92.82,184 96,184C99.18,184 102.24,182.74 104.49,180.49C106.74,178.24 108,175.18 108,172C108,171.86 107.99,171.73 107.98,171.59C107.83,174.67 106.5,177.57 104.27,179.69C102.04,181.81 99.08,183 96,183C92.89,183 89.91,181.79 87.68,179.63C85.44,177.47 84.13,174.53 84.02,171.43Z"
+        android:fillColor="#1A252A"/>
+    <path
+        android:pathData="M50,8C46.68,8 44,10.68 44,14V22C44,25.32 46.68,28 50,28H64V36H32C25.35,36 20,41.35 20,48V116C20,122.65 25.35,128 32,128L57.61,166C59.68,169.59 63.54,172 68,172H84C84,175.18 85.26,178.24 87.51,180.49C89.77,182.74 92.82,184 96,184C99.18,184 102.23,182.74 104.48,180.49C106.73,178.23 108,175.18 108,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128C166.65,128 172,122.65 172,116V48C172,41.35 166.65,36 160,36H128V28H142C145.32,28 148,25.32 148,22V14C148,10.68 145.32,8 142,8H118C114.68,8 112,10.68 112,14V22C112,25.32 114.68,28 118,28H120V36H72V28H74C77.32,28 80,25.32 80,22V14C80,10.68 77.32,8 74,8H50Z"
+        android:fillType="evenOdd">
+      <aapt:attr name="android:fillColor">
+        <gradient 
+            android:centerX="-0"
+            android:centerY="0"
+            android:gradientRadius="271.53"
+            android:type="radial">
+          <item android:offset="0" android:color="#19FBFCFC"/>
+          <item android:offset="1" android:color="#00FBFCFC"/>
+        </gradient>
+      </aapt:attr>
+    </path>
+    <path
+        android:pathData="m50,8.72c-3.32,0 -6,2.68 -6,6v8c0,3.32 2.68,6 6,6h14v8H32c-3.34,0 -6.35,1.35 -8.53,3.54C21.32,42.43 20,45.41 20,48.72v68c0,6.65 5.35,12 12,12l25.61,38c2.07,3.59 5.94,6 10.39,6h16c0,3.18 1.26,6.24 3.51,8.48 2.25,2.25 5.3,3.52 8.49,3.52 3.18,-0 6.23,-1.26 8.48,-3.52 2.25,-2.25 3.51,-5.3 3.51,-8.48H124c4.46,0 8.32,-2.41 10.39,-6h0.01l25.6,-38c6.65,-0 12,-5.35 12,-12v-68c0,-6.65 -5.35,-12 -12,-12h-32v-8h14c3.32,0 6,-2.68 6,-6v-8c0,-3.32 -2.68,-6 -6,-6h-24c-3.32,0 -6,2.68 -6,6v8c0,3.32 2.68,6 6,6h2v8H72v-8h2c3.32,0 6,-2.68 6,-6v-8c0,-3.32 -2.68,-6 -6,-6z"
+        android:fillType="evenOdd">
+      <aapt:attr name="android:fillColor">
+        <gradient 
+            android:startX="192"
+            android:startY="0.72"
+            android:endX="192"
+            android:endY="192.72"
+            android:type="linear">
+          <item android:offset="0" android:color="#19FBFCFC"/>
+          <item android:offset="1" android:color="#00FBFCFC"/>
+        </gradient>
+      </aapt:attr>
+    </path>
+  </group>
+</vector>

app-ui-catalog/src/main/res/drawable/ic_launcher_foreground.xml

@@ -0,0 +1,104 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="192"
+    android:viewportHeight="192">
+    <group
+        android:scaleX="0.52411765"
+        android:scaleY="0.52411765"
+        android:translateX="45.684708"
+        android:translateY="44.75294">
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#000000"
+            android:pathData="M50,12C46.68,12 44,14.68 44,18V26C44,29.32 46.68,32 50,32H64V48H72V32H74C77.32,32 80,29.32 80,26V18C80,14.68 77.32,12 74,12H50ZM118,12C114.68,12 112,14.68 112,18V26C112,29.32 114.68,32 118,32H120V48H128V32H142C145.32,32 148,29.32 148,26V18C148,14.68 145.32,12 142,12H118ZM32,120V132L57.61,170C59.68,173.59 63.54,176 68,176H124C128.46,176 132.32,173.59 134.39,170H134.4L160,132V120H32Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#000000"
+            android:pathData="M50,8C46.68,8 44,10.68 44,14V22C44,25.32 46.68,28 50,28H64V44H72V28H74C77.32,28 80,25.32 80,22V14C80,10.68 77.32,8 74,8H50ZM118,8C114.68,8 112,10.68 112,14V22C112,25.32 114.68,28 118,28H120V44H128V28H142C145.32,28 148,25.32 148,22V14C148,10.68 145.32,8 142,8H118ZM32,116V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128V116H32Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#000000"
+            android:pathData="M24,116L32,128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128L168,116H24Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillColor="#607D8B"
+            android:pathData="M32,116V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160.01,128V116H32Z" />
+        <path
+            android:fillColor="#263238"
+            android:pathData="M72,16H64V44H72V16Z" />
+        <path
+            android:fillColor="#263238"
+            android:pathData="M128,16H120V44H128V16Z" />
+        <path
+            android:fillColor="#4D6570"
+            android:pathData="M32,127V128L57.61,166C59.68,169.59 63.54,172 68,172H124C128.46,172 132.32,169.59 134.39,166H134.4L160,128V127L134.4,165H134.39C132.32,168.59 128.46,171 124,171H68C63.54,171 59.68,168.59 57.61,165L32,127Z" />
+        <path
+            android:fillColor="#607D8B"
+            android:pathData="M80,22V14C80,10.69 77.31,8 74,8L50,8C46.69,8 44,10.69 44,14V22C44,25.31 46.69,28 50,28L74,28C77.31,28 80,25.31 80,22Z" />
+        <path
+            android:fillColor="#607D8B"
+            android:pathData="M148,22V14C148,10.69 145.31,8 142,8L118,8C114.69,8 112,10.69 112,14V22C112,25.31 114.69,28 118,28L142,28C145.31,28 148,25.31 148,22Z" />
+        <path
+            android:fillColor="#4D6570"
+            android:pathData="M44,21V22C44,25.32 46.68,28 50,28H74C77.32,28 80,25.32 80,22V21C80,24.32 77.32,27 74,27H50C46.68,27 44,24.32 44,21Z" />
+        <path
+            android:fillColor="#4D6570"
+            android:pathData="M112,21V22C112,25.32 114.68,28 118,28H142C145.32,28 148,25.32 148,22V21C148,24.32 145.32,27 142,27H118C114.68,27 112,24.32 112,21Z" />
+        <path
+            android:fillColor="#8097A2"
+            android:pathData="M50,8C46.68,8 44,10.68 44,14V15C44,11.68 46.68,9 50,9H74C77.32,9 80,11.68 80,15V14C80,10.68 77.32,8 74,8H50Z" />
+        <path
+            android:fillColor="#8097A2"
+            android:pathData="M118,8C114.68,8 112,10.68 112,14V15C112,11.68 114.68,9 118,9H142C145.32,9 148,11.68 148,15V14C148,10.68 145.32,8 142,8H118Z" />
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#37abc8"
+            android:pathData="M171.99,120V52C171.99,45.37 166.62,40 159.99,40L31.99,40C25.37,40 19.99,45.37 19.99,52V120C19.99,126.62 25.37,132 31.99,132H159.99C166.62,132 171.99,126.62 171.99,120Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#5fbcd3"
+            android:pathData="M171.99,116V48C171.99,41.37 166.62,36 159.99,36L31.99,36C25.37,36 19.99,41.37 19.99,48V116C19.99,122.62 25.37,128 31.99,128L159.99,128C166.62,128 171.99,122.62 171.99,116Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillColor="#ff9955"
+            android:pathData="M172,116V48C172,41.37 166.63,36 160,36L32,36C25.37,36 20,41.37 20,48V116C20,122.63 25.37,128 32,128H160C166.63,128 172,122.63 172,116Z" />
+        <path
+            android:fillColor="#00000000"
+            android:pathData="M36,52L96,84L156,52"
+            android:strokeWidth="6"
+            android:strokeColor="#FBE9E7"
+            android:strokeLineCap="round" />
+        <path
+            android:fillColor="#ff9955"
+            android:pathData="M32,36C25.35,36 20,41.35 20,48V49C20,42.35 25.35,37 32,37H160C166.65,37 172,42.35 172,49V48C172,41.35 166.65,36 160,36H32Z" />
+        <path
+            android:fillColor="#ff7f2a"
+            android:pathData="M20,115V116C20,122.65 25.35,128 32,128H160C166.65,128 172,122.65 172,116V115C172,121.65 166.65,127 160,127H32C25.35,127 20,121.65 20,115Z" />
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#000000"
+            android:pathData="M90,156C86.68,156 84,158.68 84,162V174C84,174.27 84.03,174.54 84.06,174.8C84.06,174.8 84.06,174.81 84.06,174.81C84.02,175.2 84,175.6 84,176C84,179.18 85.26,182.23 87.51,184.48C89.77,186.73 92.82,188 96,188C99.18,188 102.24,186.73 104.49,184.48C106.74,182.23 108,179.18 108,176C108,175.61 107.97,175.23 107.93,174.85C107.97,174.57 108,174.29 108,174V162C108,158.67 105.33,156 102,156L90,156Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillAlpha="0.2"
+            android:fillColor="#000000"
+            android:pathData="M90,152C86.68,152 84,154.68 84,158V170C84,170.27 84.03,170.54 84.06,170.8C84.06,170.8 84.06,170.81 84.06,170.81C84.02,171.2 84,171.6 84,172C84,175.18 85.26,178.23 87.51,180.48C89.77,182.73 92.82,184 96,184C99.18,184 102.24,182.73 104.49,180.48C106.74,178.23 108,175.18 108,172C108,171.61 107.97,171.23 107.93,170.85C107.97,170.57 108,170.29 108,170V158C108,154.67 105.33,152 102,152L90,152Z"
+            android:strokeAlpha="0.2" />
+        <path
+            android:fillColor="#263238"
+            android:pathData="M108,170V158C108,154.69 105.31,152 102,152H90C86.69,152 84,154.69 84,158V170C84,173.31 86.69,176 90,176H102C105.31,176 108,173.31 108,170Z" />
+        <path
+            android:fillColor="#263238"
+            android:pathData="M96,184C102.63,184 108,178.63 108,172C108,165.37 102.63,160 96,160C89.37,160 84,165.37 84,172C84,178.63 89.37,184 96,184Z" />
+        <path
+            android:fillColor="#37474F"
+            android:pathData="M90,152C86.68,152 84,154.68 84,158V159C84,155.68 86.68,153 90,153H102C105.32,153 108,155.68 108,159V158C108,154.68 105.32,152 102,152H90Z" />
+        <path
+            android:fillColor="#1A252A"
+            android:pathData="M84.02,171.43C84.01,171.62 84,171.81 84,172C84,175.18 85.26,178.24 87.51,180.49C89.77,182.74 92.82,184 96,184C99.18,184 102.24,182.74 104.49,180.49C106.74,178.24 108,175.18 108,172C108,171.86 107.99,171.73 107.98,171.59C107.83,174.67 106.5,177.57 104.27,179.69C102.04,181.81 99.08,183 96,183C92.89,183 89.91,181.79 87.68,179.63C85.44,177.47 84.13,174.53 84.02,171.43Z" />
+    </group>
+</vector>

app-ui-catalog/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/ic_launcher_background"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

app-ui-catalog/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
+    <background android:drawable="@color/ic_launcher_background"/>
+    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+</adaptive-icon>

app-ui-catalog/src/main/res/values/colors.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <color name="ic_launcher_background">#FCE8DC</color>
+</resources>

app-ui-catalog/src/main/res/values/strings.xml

@@ -0,0 +1,3 @@
+<resources>
+    <string name="app_name">Thunderbird Catalog</string>
+</resources>

app-ui-catalog/src/main/res/values/themes.xml

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <style name="Theme.Thunderbird" parent="android:Theme.Material.Light.NoActionBar" />
+</resources>