commonize design

DatL4g · May 11, 2024 · 1329c56 · 1329c56
1 parent 39af1ee
commit 1329c56
Show file tree

Hide file tree

Showing 14 changed files with 66 additions and 40 deletions.
diff --git a/...tlag/aniflow/ui/navigation/screen/home/dialog/settings/component/DomainSection.android.kt b/...tlag/aniflow/ui/navigation/screen/home/dialog/settings/component/DomainSection.android.kt
@@ -7,6 +7,8 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Check
 import androidx.compose.material.icons.filled.Share
+import androidx.compose.material.icons.rounded.Check
+import androidx.compose.material.icons.rounded.Share
 import androidx.compose.material3.Icon
 import androidx.compose.material3.Switch
 import androidx.compose.material3.SwitchDefaults
@@ -18,8 +20,10 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.unit.dp
+import dev.datlag.aniflow.SharedRes
 import dev.datlag.aniflow.other.DomainVerifier
 import dev.datlag.tooling.decompose.lifecycle.collectAsStateWithLifecycle
+import dev.icerock.moko.resources.compose.stringResource
 
 @Composable
 actual fun DomainSection(modifier: Modifier) {
@@ -37,11 +41,11 @@ actual fun DomainSection(modifier: Modifier) {
             horizontalArrangement = Arrangement.spacedBy(8.dp)
         ) {
             Icon(
-                imageVector = Icons.Filled.Share,
+                imageVector = Icons.Rounded.Share,
                 contentDescription = null,
             )
             Text(
-                text = "Open Links"
+                text = stringResource(SharedRes.strings.open_links)
             )
             Spacer(modifier = Modifier.weight(1F))
             Switch(
@@ -54,7 +58,7 @@ actual fun DomainSection(modifier: Modifier) {
                     if (verified) {
                         Icon(
                             modifier = Modifier.size(SwitchDefaults.IconSize),
-                            imageVector = Icons.Default.Check,
+                            imageVector = Icons.Rounded.Check,
                             contentDescription = null
                         )
                     }

diff --git a/...otlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/TranslateButton.android.kt b/...otlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/TranslateButton.android.kt
@@ -4,6 +4,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.size
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Translate
+import androidx.compose.material.icons.rounded.Translate
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
@@ -102,7 +103,7 @@ actual fun TranslateButton(
         } else {
             Icon(
                 modifier = Modifier.size(ButtonDefaults.IconSize),
-                imageVector = Icons.Default.Translate,
+                imageVector = Icons.Rounded.Translate,
                 contentDescription = null
             )
         }

diff --git a/...commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/component/airing/Airing.kt b/...commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/component/airing/Airing.kt
@@ -3,6 +3,7 @@ package dev.datlag.aniflow.ui.navigation.screen.home.component.airing
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Schedule
+import androidx.compose.material.icons.rounded.Schedule
 import androidx.compose.material3.Icon
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
@@ -28,7 +29,7 @@ fun Airing(airingAt: Int, color: Color = LocalContentColor.current) {
         verticalAlignment = Alignment.CenterVertically
     ) {
         Icon(
-            imageVector = Icons.Default.Schedule,
+            imageVector = Icons.Rounded.Schedule,
             contentDescription = null,
             modifier = Modifier.size(24.dp),
             tint = color

diff --git a/...ommonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/component/airing/Episode.kt b/...ommonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/component/airing/Episode.kt
@@ -3,6 +3,7 @@ package dev.datlag.aniflow.ui.navigation.screen.home.component.airing
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Slideshow
+import androidx.compose.material.icons.rounded.Slideshow
 import androidx.compose.material3.Icon
 import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
@@ -13,6 +14,8 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
+import dev.datlag.aniflow.SharedRes
+import dev.icerock.moko.resources.compose.stringResource
 
 @Composable
 fun Episode(value: Int, color: Color = LocalContentColor.current) {
@@ -23,13 +26,13 @@ fun Episode(value: Int, color: Color = LocalContentColor.current) {
         verticalAlignment = Alignment.CenterVertically
     ) {
         Icon(
-            imageVector = Icons.Default.Slideshow,
+            imageVector = Icons.Rounded.Slideshow,
             contentDescription = null,
             modifier = Modifier.size(24.dp),
             tint = color
         )
         Text(
-            text = "Episode $value",
+            text = stringResource(SharedRes.strings.episode_number, value),
             style = MaterialTheme.typography.titleMedium,
             textAlign = TextAlign.Center,
             color = color

diff --git a/...ain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/SettingsDialog.kt b/...ain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/SettingsDialog.kt
@@ -12,6 +12,7 @@ import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.*
 import androidx.compose.material.icons.rounded.ArrowBackIosNew
 import androidx.compose.material.icons.rounded.Code
+import androidx.compose.material.icons.rounded.NotInterested
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
@@ -120,17 +121,17 @@ fun SettingsScreen(component: SettingsComponent) {
                 ) {
                     if (isLoggedIn) {
                         Icon(
-                            imageVector = Icons.Default.NotInterested,
+                            imageVector = Icons.Rounded.NotInterested,
                             contentDescription = null,
                         )
-                        Text(text = "Logout")
+                        Text(text = stringResource(SharedRes.strings.logout))
                     } else {
                         Image(
                             modifier = Modifier.size(24.dp).clip(CircleShape),
                             painter = painterResource(SharedRes.images.anilist),
                             contentDescription = null,
                         )
-                        Text(text = "Login")
+                        Text(text = stringResource(SharedRes.strings.login))
                     }
                 }
             }

diff --git a/...in/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/AdultSection.kt b/...in/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/AdultSection.kt
@@ -7,6 +7,8 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Check
 import androidx.compose.material.icons.filled.NoAdultContent
+import androidx.compose.material.icons.rounded.Check
+import androidx.compose.material.icons.rounded.NoAdultContent
 import androidx.compose.material3.Icon
 import androidx.compose.material3.Switch
 import androidx.compose.material3.Text
@@ -35,7 +37,7 @@ fun AdultSection(
         horizontalArrangement = Arrangement.spacedBy(8.dp)
     ) {
         Icon(
-            imageVector = Icons.Default.NoAdultContent,
+            imageVector = Icons.Rounded.NoAdultContent,
             contentDescription = null,
         )
         Text(
@@ -49,7 +51,7 @@ fun AdultSection(
                 if (adultContent) {
                     Icon(
                         modifier = Modifier.size(SwitchDefaults.IconSize),
-                        imageVector = Icons.Default.Check,
+                        imageVector = Icons.Rounded.Check,
                         contentDescription = null
                     )
                 }

diff --git a/...ev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/CharacterSection.kt b/...ev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/CharacterSection.kt
@@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ExpandMore
 import androidx.compose.material.icons.filled.PersonPin
+import androidx.compose.material.icons.rounded.ExpandMore
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
@@ -22,6 +23,7 @@ import com.maxkeppeler.sheets.option.models.DisplayMode
 import com.maxkeppeler.sheets.option.models.Option
 import com.maxkeppeler.sheets.option.models.OptionConfig
 import com.maxkeppeler.sheets.option.models.OptionSelection
+import dev.datlag.aniflow.SharedRes
 import dev.datlag.aniflow.common.toComposeString
 import dev.datlag.tooling.decompose.lifecycle.collectAsStateWithLifecycle
 import dev.datlag.aniflow.settings.model.CharLanguage as SettingsChar
@@ -67,14 +69,14 @@ fun CharacterSection(
             contentDescription = null
         )
         Text(
-            text = "Character Language"
+            text = stringResource(SharedRes.strings.char_language)
         )
         Spacer(modifier = Modifier.weight(1F))
         IconButton(
             onClick = { useCase.show() }
         ) {
             Icon(
-                imageVector = Icons.Default.ExpandMore,
+                imageVector = Icons.Rounded.ExpandMore,
                 contentDescription = null
             )
         }

diff --git a/...in/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/ColorSection.kt b/...in/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/ColorSection.kt
@@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Circle
 import androidx.compose.material.icons.filled.Palette
+import androidx.compose.material.icons.rounded.Palette
 import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -86,7 +87,7 @@ fun ColorSection(
         horizontalArrangement = Arrangement.spacedBy(8.dp)
     ) {
         Icon(
-            imageVector = Icons.Default.Palette,
+            imageVector = Icons.Rounded.Palette,
             contentDescription = null,
         )
         Text(

diff --git a/...in/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/TitleSection.kt b/...in/dev/datlag/aniflow/ui/navigation/screen/home/dialog/settings/component/TitleSection.kt
@@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ExpandMore
+import androidx.compose.material.icons.rounded.ExpandMore
 import androidx.compose.material.icons.rounded.Title
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
@@ -22,6 +23,7 @@ import com.maxkeppeler.sheets.option.models.DisplayMode
 import com.maxkeppeler.sheets.option.models.Option
 import com.maxkeppeler.sheets.option.models.OptionConfig
 import com.maxkeppeler.sheets.option.models.OptionSelection
+import dev.datlag.aniflow.SharedRes
 import dev.datlag.aniflow.common.toComposeString
 import dev.datlag.aniflow.settings.model.TitleLanguage as SettingsTitle
 import dev.datlag.tooling.decompose.lifecycle.collectAsStateWithLifecycle
@@ -67,14 +69,14 @@ fun TitleSection(
             contentDescription = null
         )
         Text(
-            text = "Title Language"
+            text = stringResource(SharedRes.strings.title_language)
         )
         Spacer(modifier = Modifier.weight(1F))
         IconButton(
             onClick = { useCase.show() }
         ) {
             Icon(
-                imageVector = Icons.Default.ExpandMore,
+                imageVector = Icons.Rounded.ExpandMore,
                 contentDescription = null
             )
         }

diff --git a/...ommonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/AdultSection.kt b/...ommonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/AdultSection.kt
@@ -4,6 +4,7 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowBackIosNew
+import androidx.compose.material.icons.rounded.ArrowBackIosNew
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Icon
@@ -60,7 +61,7 @@ fun AdultSection(
                 ) {
                     Icon(
                         modifier = Modifier.size(ButtonDefaults.IconSize),
-                        imageVector = Icons.Default.ArrowBackIosNew,
+                        imageVector = Icons.Rounded.ArrowBackIosNew,
                         contentDescription = null
                     )
                     Spacer(modifier = Modifier.size(ButtonDefaults.IconSpacing))

diff --git a/...Main/kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/CollapsingToolbar.kt b/...Main/kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/CollapsingToolbar.kt
@@ -15,6 +15,7 @@ import androidx.compose.material.icons.filled.Share
 import androidx.compose.material.icons.rounded.ArrowBackIosNew
 import androidx.compose.material.icons.rounded.Favorite
 import androidx.compose.material.icons.rounded.FavoriteBorder
+import androidx.compose.material.icons.rounded.Share
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
@@ -210,7 +211,7 @@ fun CollapsingToolbar(
                             }
                         ) {
                             Icon(
-                                imageVector = Icons.Default.Share,
+                                imageVector = Icons.Rounded.Share,
                                 contentDescription = null
                             )
                         }

diff --git a/...ain/kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/DescriptionSection.kt b/...ain/kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/component/DescriptionSection.kt
@@ -3,9 +3,12 @@ package dev.datlag.aniflow.ui.navigation.screen.medium.component
 import androidx.compose.animation.core.animateIntAsState
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.text.selection.SelectionContainer
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ExpandLess
 import androidx.compose.material.icons.filled.ExpandMore
+import androidx.compose.material.icons.rounded.ExpandLess
+import androidx.compose.material.icons.rounded.ExpandMore
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
@@ -68,20 +71,20 @@ fun DescriptionSection(
                 animationSpec = tween()
             )
 
-            Text(
-                modifier = Modifier.padding(horizontal = 16.dp).onClick {
-                    descriptionExpanded = !descriptionExpanded
-                },
-                text = (translatedDescription ?: description)!!.htmlToAnnotatedString(),
-                maxLines = max(animatedLines, 1),
-                softWrap = true,
-                overflow = TextOverflow.Ellipsis,
-                onTextLayout = { result ->
-                    if (!descriptionExpanded) {
-                        descriptionExpandable = result.hasVisualOverflow
+            SelectionContainer {
+                Text(
+                    modifier = Modifier.padding(horizontal = 16.dp),
+                    text = (translatedDescription ?: description)!!.htmlToAnnotatedString(),
+                    maxLines = max(animatedLines, 1),
+                    softWrap = true,
+                    overflow = TextOverflow.Ellipsis,
+                    onTextLayout = { result ->
+                        if (!descriptionExpanded) {
+                            descriptionExpandable = result.hasVisualOverflow
+                        }
                     }
-                }
-            )
+                )
+            }
             if (descriptionExpandable) {
                 IconButton(
                     modifier = Modifier.fillMaxWidth(),
@@ -90,9 +93,9 @@ fun DescriptionSection(
                     }
                 ) {
                     val icon = if (descriptionExpanded) {
-                        Icons.Default.ExpandLess
+                        Icons.Rounded.ExpandLess
                     } else {
-                        Icons.Default.ExpandMore
+                        Icons.Rounded.ExpandMore
                     }
 
                     Icon(

diff --git a/...kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/dialog/character/CharacterDialog.kt b/...kotlin/dev/datlag/aniflow/ui/navigation/screen/medium/dialog/character/CharacterDialog.kt
@@ -10,9 +10,7 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.*
-import androidx.compose.material.icons.rounded.ArrowBackIosNew
-import androidx.compose.material.icons.rounded.Favorite
-import androidx.compose.material.icons.rounded.FavoriteBorder
+import androidx.compose.material.icons.rounded.*
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
@@ -185,7 +183,7 @@ fun CharacterDialog(component: CharacterComponent) {
                         horizontalAlignment = Alignment.CenterHorizontally,
                     ) {
                         Icon(
-                            imageVector = Icons.Filled.Bloodtype,
+                            imageVector = Icons.Rounded.Bloodtype,
                             contentDescription = null
                         )
                         Text(
@@ -206,7 +204,7 @@ fun CharacterDialog(component: CharacterComponent) {
                         horizontalAlignment = Alignment.CenterHorizontally,
                     ) {
                         Icon(
-                            imageVector = Icons.Filled.Man4,
+                            imageVector = Icons.Rounded.Man4,
                             contentDescription = null
                         )
                         Text(
@@ -227,7 +225,7 @@ fun CharacterDialog(component: CharacterComponent) {
                         horizontalAlignment = Alignment.CenterHorizontally,
                     ) {
                         Icon(
-                            imageVector = Icons.Filled.Cake,
+                            imageVector = Icons.Rounded.Cake,
                             contentDescription = null
                         )
                         Text(

diff --git a/composeApp/src/commonMain/moko-resources/base/strings.xml b/composeApp/src/commonMain/moko-resources/base/strings.xml
@@ -72,4 +72,10 @@
     <string name="repeating">Repeating</string>
     <string name="install">Install</string>
     <string name="duration_per_episode">%dmin / Episode</string>
+    <string name="episode_number">Episode %d</string>
+    <string name="title_language">Title Language</string>
+    <string name="char_language">Character Language</string>
+    <string name="login">Login</string>
+    <string name="logout">Logout</string>
+    <string name="open_links">Open Links</string>
 </resources>