283375 · Oct 7, 2026 · Oct 5, 2026 · Oct 6, 2026 · Oct 6, 2026 · Oct 6, 2026
diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/EmergencyModeActivityUi.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/EmergencyModeActivityUi.kt
@@ -1,14 +1,15 @@
 package xyz.sevive.arcaeaoffline.ui.activities
 
 import android.content.Intent
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.ExperimentalLayoutApi
 import androidx.compose.foundation.layout.FlowRow
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.consumeWindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material.icons.Icons
@@ -34,7 +35,6 @@ import androidx.compose.runtime.getValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
@@ -45,7 +45,8 @@ import io.github.vinceglb.filekit.path
 import xyz.sevive.arcaeaoffline.R
 import xyz.sevive.arcaeaoffline.helpers.context.persistUriPermissions
 import xyz.sevive.arcaeaoffline.ui.components.IconRow
-import xyz.sevive.arcaeaoffline.ui.components.ListGroupHeader
+import xyz.sevive.arcaeaoffline.ui.components.SettingsGroupHeader
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
@@ -76,7 +77,6 @@ private fun UiTopAppBar(modifier: Modifier = Modifier) {
     )
 }
 
-@OptIn(ExperimentalLayoutApi::class)
 @Composable
 fun EmergencyModeActivityUi(
     modifier: Modifier = Modifier,
@@ -109,17 +109,15 @@ fun EmergencyModeActivityUi(
                 .consumeWindowInsets(padding),
             contentPadding =
                 PaddingValues(
-                    top = padding.calculateTopPadding() + dimensionResource(R.dimen.list_padding),
-                    bottom = padding.calculateBottomPadding() + dimensionResource(R.dimen.list_padding),
-                    start = dimensionResource(R.dimen.list_padding),
-                    end = dimensionResource(R.dimen.list_padding),
+                    top = padding.calculateTopPadding() + MaterialTheme.spacing.sm,
+                    bottom = padding.calculateBottomPadding() + MaterialTheme.spacing.sm,
                 ),
         ) {
             item {
-                ListGroupHeader(stringResource(R.string.emergency_mode_output_directory_title))
+                SettingsGroupHeader(stringResource(R.string.emergency_mode_output_directory_title))
             }
             item {
-                Column {
+                Column(Modifier.padding(horizontal = MaterialTheme.spacing.pagePadding)) {
                     IconRow {
                         Icon(Icons.Default.Code, contentDescription = null)
                         Text(
@@ -138,7 +136,7 @@ fun EmergencyModeActivityUi(
                             Text(stringResource(R.string.emergency_mode_output_directory_select_button))
                         }
 
-                        Spacer(Modifier.width(dimensionResource(R.dimen.list_padding)))
+                        Spacer(Modifier.width(MaterialTheme.spacing.sm))
 
                         CompositionLocalProvider(
                             LocalContentColor provides
@@ -163,10 +161,13 @@ fun EmergencyModeActivityUi(
             }
 
             item {
-                ListGroupHeader(stringResource(R.string.emergency_mode_ocr_title))
+                SettingsGroupHeader(stringResource(R.string.emergency_mode_ocr_title))
             }
             item {
-                FlowRow {
+                FlowRow(
+                    Modifier.padding(horizontal = MaterialTheme.spacing.pagePadding),
+                    horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
+                ) {
                     Button(onClick = { viewModel.deleteAllOcrDependencies() }) {
                         IconRow {
                             Icon(Icons.Default.DeleteForever, contentDescription = null)
@@ -184,10 +185,13 @@ fun EmergencyModeActivityUi(
             }
 
             item {
-                ListGroupHeader(stringResource(R.string.emergency_mode_database_title))
+                SettingsGroupHeader(stringResource(R.string.emergency_mode_database_title))
             }
             item {
-                FlowRow {
+                FlowRow(
+                    Modifier.padding(horizontal = MaterialTheme.spacing.pagePadding),
+                    horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
+                ) {
                     Button(
                         onClick = { viewModel.copyDatabase(context) },
                         enabled = outputDirectoryValid,

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/ocrfromshare/AppIconLabelButton.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/ocrfromshare/AppIconLabelButton.kt
@@ -10,12 +10,12 @@ import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonColors
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.unit.dp
-import xyz.sevive.arcaeaoffline.R
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 @Composable
 internal fun AppIconLabelButton(
@@ -34,14 +34,14 @@ internal fun AppIconLabelButton(
         shape = RoundedCornerShape(20.dp),
     ) {
         Row(
-            horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.action_button_icon_text_padding)),
+            horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
             verticalAlignment = Alignment.CenterVertically,
         ) {
             appIcon()
 
             Column(
                 Modifier.weight(1f),
-                verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.icon_text_padding)),
+                verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.iconTextGap),
             ) {
                 appLabel()
 

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/ocrfromshare/OcrFromShareActions.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/ocrfromshare/OcrFromShareActions.kt
@@ -23,14 +23,14 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.platform.LocalContext
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.stringResource
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import kotlinx.coroutines.launch
 import xyz.sevive.arcaeaoffline.R
 import xyz.sevive.arcaeaoffline.permissions.storage.SaveBitmapToGallery
 import xyz.sevive.arcaeaoffline.ui.common.PermissionRequiredDialog
 import xyz.sevive.arcaeaoffline.ui.components.IconRow
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 @Composable
 internal fun OcrFromShareActions(ocrFromShareViewModel: OcrFromShareViewModel) {
@@ -63,7 +63,7 @@ internal fun OcrFromShareActions(ocrFromShareViewModel: OcrFromShareViewModel) {
     val scoreCached by ocrFromShareViewModel.scoreCached.collectAsStateWithLifecycle()
 
     Column {
-        Row(horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding))) {
+        Row(horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm)) {
             Button(
                 onClick = { coroutineScope.launch { ocrFromShareViewModel.saveScore() } },
                 enabled = score != null && !scoreSaved && !scoreCached,

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/ocrfromshare/OcrFromShareScreen.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/activities/ocrfromshare/OcrFromShareScreen.kt
@@ -25,10 +25,10 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.stringResource
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import xyz.sevive.arcaeaoffline.R
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 @Composable
 internal fun OcrFromShareReturnToShareAppButton(
@@ -111,12 +111,12 @@ internal fun OcrFromShareScreenContentMedium(
                 .fillMaxSize()
                 .consumeWindowInsets(innerPadding)
                 .padding(innerPadding)
-                .padding(dimensionResource(R.dimen.page_padding)),
-            horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.page_padding)),
+                .padding(MaterialTheme.spacing.pagePadding),
+            horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.pagePadding),
         ) {
             Column(
                 Modifier.weight(1f),
-                verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding)),
+                verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
             ) {
                 OcrFromShareOcrDependencyStatusCard(ocrDependencyViewersUiState)
 
@@ -127,7 +127,7 @@ internal fun OcrFromShareScreenContentMedium(
 
             LazyColumn(
                 Modifier.weight(1f),
-                verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding)),
+                verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
             ) {
                 item {
                     OcrFromShareOcrResult(viewModel)
@@ -170,12 +170,12 @@ fun OcrFromShareScreenCompact(
                     .consumeWindowInsets(innerPadding),
             contentPadding =
                 PaddingValues(
-                    top = innerPadding.calculateTopPadding() + dimensionResource(R.dimen.page_padding),
-                    bottom = innerPadding.calculateBottomPadding() + dimensionResource(R.dimen.page_padding),
-                    start = dimensionResource(R.dimen.page_padding),
-                    end = dimensionResource(R.dimen.page_padding),
+                    top = innerPadding.calculateTopPadding() + MaterialTheme.spacing.pagePadding,
+                    bottom = innerPadding.calculateBottomPadding() + MaterialTheme.spacing.pagePadding,
+                    start = MaterialTheme.spacing.pagePadding,
+                    end = MaterialTheme.spacing.pagePadding,
                 ),
-            verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding)),
+            verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
         ) {
             item {
                 OcrFromShareOcrDependencyStatusCard(ocrDependencyViewersUiState)

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/common/PermissionRequiredDialog.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/common/PermissionRequiredDialog.kt
@@ -17,17 +17,17 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.platform.LocalContext
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.pluralStringResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import xyz.sevive.arcaeaoffline.R
 import xyz.sevive.arcaeaoffline.helpers.secondaryItemAlpha
+import xyz.sevive.arcaeaoffline.ui.components.BaseSettingsItem
 import xyz.sevive.arcaeaoffline.ui.components.dialogs.DialogConfirmButton
 import xyz.sevive.arcaeaoffline.ui.components.dialogs.DialogDismissTextButton
-import xyz.sevive.arcaeaoffline.ui.components.preferences.BasePreferencesWidget
 import xyz.sevive.arcaeaoffline.ui.theme.ArcaeaOfflineTheme
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 @Composable
 fun rememberPermissionIcon(permission: String): ImageVector? =
@@ -78,7 +78,7 @@ private fun PermissionWidget(
     val content = rememberPermissionDescription(permission)
     val icon = rememberPermissionIcon(permission)
 
-    BasePreferencesWidget(
+    BaseSettingsItem(
         title = { PermissionTitle(permission) },
         content = {
             Text(
@@ -110,7 +110,7 @@ fun PermissionRequiredDialog(
         icon = { Icon(Icons.Default.Flaky, contentDescription = null) },
         title = { Text(stringResource(R.string.permission_required_dialog_title)) },
         text = {
-            Column(verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding))) {
+            Column(verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm)) {
                 Text(
                     pluralStringResource(
                         R.plurals.permission_required_dialog_content,

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/common/datetimeeditor/DateTimeEditDialog.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/common/datetimeeditor/DateTimeEditDialog.kt
@@ -43,7 +43,6 @@ import androidx.compose.ui.text.TextRange
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.TextFieldValue
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
 import kotlinx.datetime.LocalDate
 import kotlinx.datetime.LocalDateTime
 import kotlinx.datetime.LocalTime
@@ -55,10 +54,11 @@ import kotlinx.datetime.toJavaLocalDate
 import kotlinx.datetime.toJavaLocalTime
 import kotlinx.datetime.toLocalDateTime
 import xyz.sevive.arcaeaoffline.R
+import xyz.sevive.arcaeaoffline.ui.components.TextItem
 import xyz.sevive.arcaeaoffline.ui.components.dialogs.DialogConfirmButton
 import xyz.sevive.arcaeaoffline.ui.components.dialogs.DialogDismissTextButton
-import xyz.sevive.arcaeaoffline.ui.components.preferences.TextPreferencesWidget
 import xyz.sevive.arcaeaoffline.ui.theme.ArcaeaOfflineTheme
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 import java.time.format.DateTimeFormatter
 import java.time.format.FormatStyle
 import kotlin.time.Clock
@@ -199,7 +199,7 @@ internal fun DateTimeEditDialog(
         text = {
             LazyColumn {
                 item {
-                    TextPreferencesWidget(
+                    TextItem(
                         onClick = { showDateEditDialog = true },
                         leadingIcon = Icons.Default.CalendarMonth,
                         leadingIconTint = MaterialTheme.colorScheme.secondary,
@@ -210,7 +210,7 @@ internal fun DateTimeEditDialog(
                 }
 
                 item {
-                    TextPreferencesWidget(
+                    TextItem(
                         onClick = { showTimeEditDialog = true },
                         leadingIcon = Icons.Default.AccessTime,
                         leadingIconTint = MaterialTheme.colorScheme.secondary,
@@ -248,7 +248,7 @@ private fun DateTimeEditDialogRealDevicePreview() {
                 )
             }
 
-            Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
+            Column(verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm)) {
                 Text(text = dateTime.format(LocalDateTime.Formats.ISO))
 
                 Button(onClick = { showDialog = true }) {

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/components/ArcaeaChartCard.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/components/ArcaeaChartCard.kt
@@ -32,12 +32,10 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Shape
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import kotlinx.coroutines.flow.combine
 import org.koin.compose.koinInject
-import xyz.sevive.arcaeaoffline.R
 import xyz.sevive.arcaeaoffline.core.constants.ArcaeaRatingClass
 import xyz.sevive.arcaeaoffline.core.constants.ArcaeaRatingClassDisplay
 import xyz.sevive.arcaeaoffline.core.database.entities.ChartInfo
@@ -47,6 +45,7 @@ import xyz.sevive.arcaeaoffline.core.database.repositories.DifficultyWithSongRep
 import xyz.sevive.arcaeaoffline.ui.helpers.ArcaeaFormatters
 import xyz.sevive.arcaeaoffline.ui.theme.ArcaeaOfflineTheme
 import xyz.sevive.arcaeaoffline.ui.theme.ratingClassColor
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 // Display data resolved as one atomic unit. Swapping the pair together is
 // what keeps the card consistent (title/level text and constant change in
@@ -99,8 +98,8 @@ fun ArcaeaChartCard(
         shape = shape,
     ) {
         Row(
-            Modifier.padding(dimensionResource(R.dimen.card_padding)),
-            horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding)),
+            Modifier.padding(MaterialTheme.spacing.cardPadding),
+            horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
             verticalAlignment = Alignment.CenterVertically,
         ) {
             Image(

diff --git a/app/src/main/java/xyz/sevive/arcaeaoffline/ui/components/ArcaeaChartSelector.kt b/app/src/main/java/xyz/sevive/arcaeaoffline/ui/components/ArcaeaChartSelector.kt
@@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.State
@@ -16,7 +17,6 @@ import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.dimensionResource
 import androidx.compose.ui.res.painterResource
 import org.koin.compose.koinInject
 import xyz.sevive.arcaeaoffline.R
@@ -25,6 +25,7 @@ import xyz.sevive.arcaeaoffline.core.database.entities.Difficulty
 import xyz.sevive.arcaeaoffline.core.database.entities.Song
 import xyz.sevive.arcaeaoffline.core.database.repositories.DifficultyRepository
 import xyz.sevive.arcaeaoffline.core.database.repositories.SongRepository
+import xyz.sevive.arcaeaoffline.ui.theme.spacing
 
 @Composable
 private fun rememberArcaeaSong(
@@ -79,8 +80,8 @@ fun ArcaeaChartSelector(
     }
 
     Column(
-        Modifier.padding(dimensionResource(R.dimen.card_padding)),
-        verticalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.list_padding)),
+        Modifier.padding(MaterialTheme.spacing.cardPadding),
+        verticalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.sm),
     ) {
         ArcaeaPackAndSongSelector(
             song = song,
@@ -89,7 +90,7 @@ fun ArcaeaChartSelector(
 
         Row(
             verticalAlignment = Alignment.CenterVertically,
-            horizontalArrangement = Arrangement.spacedBy(dimensionResource(R.dimen.icon_text_padding)),
+            horizontalArrangement = Arrangement.spacedBy(MaterialTheme.spacing.iconTextGap),
         ) {
             Icon(painterResource(R.drawable.ic_rating_class), contentDescription = null)