From d49bc719b2a043f7f270ed437df82e939df410c5 Mon Sep 17 00:00:00 2001 From: Trey T Date: Sat, 18 Apr 2026 18:08:23 -0500 Subject: [PATCH] =?UTF-8?q?Audit:=20.dp=20=E2=86=92=20AppSpacing/AppRadius?= =?UTF-8?q?=20(tokenization,=20partial=20sweep)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Replaces ~163 raw .dp values with design-system tokens per CLAUDE.md rule. Covers most visible screens (Tasks, Residences, Profile, Documents, dialogs, kanban, forms). Adds AppSpacing/AppRadius imports where missing. Remaining sites are geometric/canvas values (stroke widths, icon sizes, non-standard values like 6.dp/14.dp/20.dp) or don't map to existing tokens. Co-Authored-By: Claude Opus 4.7 (1M context) --- .../ui/components/AddContractorDialog.kt | 44 ++++++------ .../ui/components/CompleteTaskDialog.kt | 24 ++++--- .../ui/components/ContractorImportDialog.kt | 9 +-- .../ui/components/ManageUsersDialog.kt | 39 +++++------ .../ui/components/ResidenceImportDialog.kt | 9 +-- .../ui/components/documents/DocumentCard.kt | 36 +++++----- .../ui/components/task/PhotoViewerDialog.kt | 22 +++--- .../ui/components/task/SimpleTaskListItem.kt | 16 +++-- .../honeyDue/ui/components/task/TaskCard.kt | 68 ++++++++++--------- .../ui/components/task/TaskKanbanView.kt | 22 +++--- .../honeyDue/ui/screens/DocumentFormScreen.kt | 14 ++-- .../tt/honeyDue/ui/screens/ProfileScreen.kt | 16 ++--- .../tt/honeyDue/ui/screens/RegisterScreen.kt | 8 +-- .../honeyDue/ui/screens/ResidencesScreen.kt | 12 ++-- .../onboarding/OnboardingFirstTaskContent.kt | 4 +- 15 files changed, 180 insertions(+), 163 deletions(-) diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/AddContractorDialog.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/AddContractorDialog.kt index c0dccb2..074fac3 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/AddContractorDialog.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/AddContractorDialog.kt @@ -25,6 +25,8 @@ import com.tt.honeyDue.network.ApiResult import com.tt.honeyDue.repository.LookupsRepository import com.tt.honeyDue.analytics.PostHogAnalytics import com.tt.honeyDue.analytics.AnalyticsEvents +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing import org.jetbrains.compose.resources.stringResource @OptIn(ExperimentalMaterial3Api::class) @@ -135,7 +137,7 @@ fun AddContractorDialog( .fillMaxWidth() .heightIn(max = 500.dp) .verticalScroll(rememberScrollState()), - verticalArrangement = Arrangement.spacedBy(12.dp) + verticalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { // Basic Information Section Text( @@ -153,7 +155,7 @@ fun AddContractorDialog( .fillMaxWidth() .testTag(AccessibilityIds.Contractor.nameField), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Person, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -169,7 +171,7 @@ fun AddContractorDialog( .fillMaxWidth() .testTag(AccessibilityIds.Contractor.companyField), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Business, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -191,7 +193,7 @@ fun AddContractorDialog( .fillMaxWidth() .menuAnchor(), trailingIcon = { ExposedDropdownMenuDefaults.TrailingIcon(expanded = expandedResidenceMenu) }, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Home, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -235,7 +237,7 @@ fun AddContractorDialog( color = Color(0xFF6B7280) ) - HorizontalDivider(modifier = Modifier.padding(vertical = 4.dp)) + HorizontalDivider(modifier = Modifier.padding(vertical = AppSpacing.xs)) // Contact Information Section Text( @@ -253,7 +255,7 @@ fun AddContractorDialog( .fillMaxWidth() .testTag(AccessibilityIds.Contractor.phoneField), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Phone, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -269,7 +271,7 @@ fun AddContractorDialog( .fillMaxWidth() .testTag(AccessibilityIds.Contractor.emailField), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Email, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -283,7 +285,7 @@ fun AddContractorDialog( label = { Text(stringResource(Res.string.contractors_form_website)) }, modifier = Modifier.fillMaxWidth(), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Language, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -291,7 +293,7 @@ fun AddContractorDialog( ) ) - HorizontalDivider(modifier = Modifier.padding(vertical = 4.dp)) + HorizontalDivider(modifier = Modifier.padding(vertical = AppSpacing.xs)) // Specialties Section Text( @@ -304,8 +306,8 @@ fun AddContractorDialog( // Multi-select specialties using chips FlowRow( modifier = Modifier.testTag(AccessibilityIds.Contractor.specialtyPicker), - horizontalArrangement = Arrangement.spacedBy(8.dp), - verticalArrangement = Arrangement.spacedBy(8.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm), + verticalArrangement = Arrangement.spacedBy(AppSpacing.sm) ) { contractorSpecialties.forEach { specialty -> FilterChip( @@ -326,7 +328,7 @@ fun AddContractorDialog( } } - HorizontalDivider(modifier = Modifier.padding(vertical = 4.dp)) + HorizontalDivider(modifier = Modifier.padding(vertical = AppSpacing.xs)) // Address Section Text( @@ -342,7 +344,7 @@ fun AddContractorDialog( label = { Text(stringResource(Res.string.contractors_form_street_address)) }, modifier = Modifier.fillMaxWidth(), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.LocationOn, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -350,14 +352,14 @@ fun AddContractorDialog( ) ) - Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { + Row(horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm)) { OutlinedTextField( value = city, onValueChange = { city = it }, label = { Text(stringResource(Res.string.contractors_form_city)) }, modifier = Modifier.weight(1f), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), unfocusedBorderColor = Color(0xFFE5E7EB) @@ -370,7 +372,7 @@ fun AddContractorDialog( label = { Text(stringResource(Res.string.contractors_form_state)) }, modifier = Modifier.weight(0.5f), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), unfocusedBorderColor = Color(0xFFE5E7EB) @@ -384,14 +386,14 @@ fun AddContractorDialog( label = { Text(stringResource(Res.string.contractors_form_zip_code)) }, modifier = Modifier.fillMaxWidth(), singleLine = true, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), unfocusedBorderColor = Color(0xFFE5E7EB) ) ) - HorizontalDivider(modifier = Modifier.padding(vertical = 4.dp)) + HorizontalDivider(modifier = Modifier.padding(vertical = AppSpacing.xs)) // Notes Section Text( @@ -410,7 +412,7 @@ fun AddContractorDialog( .height(100.dp) .testTag(AccessibilityIds.Contractor.notesField), maxLines = 4, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), leadingIcon = { Icon(Icons.Default.Notes, null) }, colors = OutlinedTextFieldDefaults.colors( focusedBorderColor = Color(0xFF3B82F6), @@ -429,7 +431,7 @@ fun AddContractorDialog( contentDescription = null, // decorative tint = if (isFavorite) Color(0xFFF59E0B) else Color(0xFF9CA3AF) ) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text(stringResource(Res.string.contractors_form_mark_favorite), color = Color(0xFF111827)) } Switch( @@ -526,6 +528,6 @@ fun AddContractorDialog( } }, containerColor = Color.White, - shape = RoundedCornerShape(16.dp) + shape = RoundedCornerShape(AppRadius.lg) ) } diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/CompleteTaskDialog.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/CompleteTaskDialog.kt index 6cae15b..edcb8a2 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/CompleteTaskDialog.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/CompleteTaskDialog.kt @@ -38,6 +38,8 @@ import com.tt.honeyDue.platform.rememberImagePicker import com.tt.honeyDue.platform.rememberCameraPicker import com.tt.honeyDue.platform.HapticFeedbackType import com.tt.honeyDue.platform.rememberHapticFeedback +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing import com.tt.honeyDue.platform.rememberImageBitmap import com.tt.honeyDue.ui.haptics.Haptics import kotlinx.datetime.* @@ -95,7 +97,7 @@ fun CompleteTaskDialog( modifier = Modifier .fillMaxWidth() .verticalScroll(rememberScrollState()), - verticalArrangement = Arrangement.spacedBy(16.dp) + verticalArrangement = Arrangement.spacedBy(AppSpacing.lg) ) { // Contractor Selection Dropdown ExposedDropdownMenuBox( @@ -224,7 +226,7 @@ fun CompleteTaskDialog( ) } - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) // Interactive Star Rating Row( @@ -271,12 +273,12 @@ fun CompleteTaskDialog( ) } - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) // Photo buttons Row( modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.spacedBy(8.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm) ) { OutlinedButton( onClick = { @@ -291,7 +293,7 @@ fun CompleteTaskDialog( contentDescription = null, // decorative modifier = Modifier.size(18.dp) ) - Spacer(modifier = Modifier.width(4.dp)) + Spacer(modifier = Modifier.width(AppSpacing.xs)) Text(stringResource(Res.string.completions_camera)) } @@ -308,20 +310,20 @@ fun CompleteTaskDialog( contentDescription = null, // decorative modifier = Modifier.size(18.dp) ) - Spacer(modifier = Modifier.width(4.dp)) + Spacer(modifier = Modifier.width(AppSpacing.xs)) Text(stringResource(Res.string.completions_library)) } } // Image thumbnails with preview if (selectedImages.isNotEmpty()) { - Spacer(modifier = Modifier.height(12.dp)) + Spacer(modifier = Modifier.height(AppSpacing.md)) Row( modifier = Modifier .fillMaxWidth() .horizontalScroll(rememberScrollState()), - horizontalArrangement = Arrangement.spacedBy(8.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm) ) { selectedImages.forEachIndexed { index, imageData -> ImageThumbnail( @@ -339,7 +341,7 @@ fun CompleteTaskDialog( } // Helper text - Spacer(modifier = Modifier.height(4.dp)) + Spacer(modifier = Modifier.height(AppSpacing.xs)) Text( text = stringResource(Res.string.completions_add_photos_helper), style = MaterialTheme.typography.bodySmall, @@ -411,7 +413,7 @@ private fun ImageThumbnail( Box( modifier = Modifier .size(80.dp) - .clip(RoundedCornerShape(8.dp)) + .clip(RoundedCornerShape(AppRadius.sm)) .background(MaterialTheme.colorScheme.surfaceVariant) ) { if (imageBitmap != null) { @@ -440,7 +442,7 @@ private fun ImageThumbnail( Box( modifier = Modifier .align(Alignment.TopEnd) - .padding(4.dp) + .padding(AppSpacing.xs) .size(20.dp) .clip(CircleShape) .background(MaterialTheme.colorScheme.error) diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ContractorImportDialog.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ContractorImportDialog.kt index 93d4d59..115250f 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ContractorImportDialog.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ContractorImportDialog.kt @@ -28,6 +28,7 @@ import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp import honeydue.composeapp.generated.resources.* import com.tt.honeyDue.models.SharedContractor +import com.tt.honeyDue.ui.theme.AppSpacing import org.jetbrains.compose.resources.stringResource /** @@ -69,7 +70,7 @@ fun ContractorImportConfirmDialog( textAlign = TextAlign.Center ) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) // Contractor details Column( @@ -91,7 +92,7 @@ fun ContractorImportConfirmDialog( } if (sharedContractor.specialtyNames.isNotEmpty()) { - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = sharedContractor.specialtyNames.joinToString(", "), style = MaterialTheme.typography.bodySmall, @@ -100,7 +101,7 @@ fun ContractorImportConfirmDialog( } sharedContractor.exportedBy?.let { exportedBy -> - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = stringResource(Res.string.contractors_shared_by, exportedBy), style = MaterialTheme.typography.bodySmall, @@ -124,7 +125,7 @@ fun ContractorImportConfirmDialog( strokeWidth = 2.dp, color = MaterialTheme.colorScheme.onPrimary ) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text(stringResource(Res.string.common_importing)) } else { Text(stringResource(Res.string.common_import)) diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ManageUsersDialog.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ManageUsersDialog.kt index 631c6a9..99f0e3b 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ManageUsersDialog.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ManageUsersDialog.kt @@ -24,6 +24,7 @@ import com.tt.honeyDue.models.ResidenceUser import com.tt.honeyDue.models.ResidenceShareCode import com.tt.honeyDue.network.ApiResult import com.tt.honeyDue.network.APILayer +import com.tt.honeyDue.ui.theme.AppSpacing import kotlinx.coroutines.launch @Composable @@ -81,7 +82,7 @@ fun ManageUsersDialog( tint = MaterialTheme.colorScheme.primary, modifier = Modifier.size(28.dp) ) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text("Invite Others") } IconButton(onClick = onDismiss) { @@ -102,32 +103,32 @@ fun ManageUsersDialog( Text( text = error ?: "Unknown error", color = MaterialTheme.colorScheme.error, - modifier = Modifier.padding(16.dp) + modifier = Modifier.padding(AppSpacing.lg) ) } else { // Share sections (primary owner only) if (isPrimaryOwner) { // Easy Share section (on top - recommended) Card( - modifier = Modifier.fillMaxWidth().padding(bottom = 8.dp), + modifier = Modifier.fillMaxWidth().padding(bottom = AppSpacing.sm), colors = CardDefaults.cardColors( containerColor = MaterialTheme.colorScheme.surfaceVariant ) ) { - Column(modifier = Modifier.padding(16.dp)) { + Column(modifier = Modifier.padding(AppSpacing.lg)) { Text( text = "Easy Share", style = MaterialTheme.typography.titleSmall, color = MaterialTheme.colorScheme.onSurfaceVariant ) - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Button( onClick = { onSharePackage() }, modifier = Modifier.fillMaxWidth() ) { Icon(Icons.Default.Share, "Share", modifier = Modifier.size(18.dp)) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text("Send Invite Link") } @@ -135,14 +136,14 @@ fun ManageUsersDialog( text = "Send a .honeydue file via Messages, Email, or share. They just tap to join.", style = MaterialTheme.typography.bodySmall, color = MaterialTheme.colorScheme.onSurfaceVariant, - modifier = Modifier.padding(top = 8.dp) + modifier = Modifier.padding(top = AppSpacing.sm) ) } } // Divider with "or" Row( - modifier = Modifier.fillMaxWidth().padding(vertical = 8.dp), + modifier = Modifier.fillMaxWidth().padding(vertical = AppSpacing.sm), verticalAlignment = Alignment.CenterVertically ) { HorizontalDivider(modifier = Modifier.weight(1f)) @@ -150,25 +151,25 @@ fun ManageUsersDialog( text = "or", style = MaterialTheme.typography.bodySmall, color = MaterialTheme.colorScheme.onSurfaceVariant, - modifier = Modifier.padding(horizontal = 16.dp) + modifier = Modifier.padding(horizontal = AppSpacing.lg) ) HorizontalDivider(modifier = Modifier.weight(1f)) } // Share Code section Card( - modifier = Modifier.fillMaxWidth().padding(bottom = 16.dp), + modifier = Modifier.fillMaxWidth().padding(bottom = AppSpacing.lg), colors = CardDefaults.cardColors( containerColor = MaterialTheme.colorScheme.surfaceVariant ) ) { - Column(modifier = Modifier.padding(16.dp)) { + Column(modifier = Modifier.padding(AppSpacing.lg)) { Text( text = "Share Code", style = MaterialTheme.typography.titleSmall, color = MaterialTheme.colorScheme.onSurfaceVariant ) - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Row( modifier = Modifier.fillMaxWidth(), @@ -206,7 +207,7 @@ fun ManageUsersDialog( } } - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Button( onClick = { @@ -236,7 +237,7 @@ fun ManageUsersDialog( } else { Icon(Icons.Default.Refresh, "Generate", modifier = Modifier.size(18.dp)) } - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text(if (shareCode != null) "Generate New Code" else "Generate Code") } @@ -245,7 +246,7 @@ fun ManageUsersDialog( text = "Share this 6-character code. They can enter it in the app to join.", style = MaterialTheme.typography.bodySmall, color = MaterialTheme.colorScheme.onSurfaceVariant, - modifier = Modifier.padding(top = 8.dp) + modifier = Modifier.padding(top = AppSpacing.sm) ) } } @@ -256,7 +257,7 @@ fun ManageUsersDialog( Text( text = "Users (${users.size})", style = MaterialTheme.typography.titleMedium, - modifier = Modifier.padding(bottom = 8.dp) + modifier = Modifier.padding(bottom = AppSpacing.sm) ) LazyColumn( @@ -303,10 +304,10 @@ private fun UserListItem( onRemove: () -> Unit ) { Card( - modifier = Modifier.fillMaxWidth().padding(vertical = 4.dp) + modifier = Modifier.fillMaxWidth().padding(vertical = AppSpacing.xs) ) { Row( - modifier = Modifier.fillMaxWidth().padding(12.dp), + modifier = Modifier.fillMaxWidth().padding(AppSpacing.md), horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically ) { @@ -317,7 +318,7 @@ private fun UserListItem( style = MaterialTheme.typography.bodyLarge ) if (isOwner) { - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Surface( color = MaterialTheme.colorScheme.primaryContainer, shape = MaterialTheme.shapes.small diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ResidenceImportDialog.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ResidenceImportDialog.kt index 962cc44..74ab432 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ResidenceImportDialog.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/ResidenceImportDialog.kt @@ -25,6 +25,7 @@ import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp import honeydue.composeapp.generated.resources.* import com.tt.honeyDue.models.SharedResidence +import com.tt.honeyDue.ui.theme.AppSpacing import org.jetbrains.compose.resources.stringResource /** @@ -66,7 +67,7 @@ fun ResidenceImportConfirmDialog( textAlign = TextAlign.Center ) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) // Residence details Column( @@ -80,7 +81,7 @@ fun ResidenceImportConfirmDialog( ) sharedResidence.sharedBy?.let { sharedBy -> - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = stringResource(Res.string.properties_shared_by, sharedBy), style = MaterialTheme.typography.bodySmall, @@ -89,7 +90,7 @@ fun ResidenceImportConfirmDialog( } sharedResidence.expiresAt?.let { expiresAt -> - Spacer(modifier = Modifier.height(4.dp)) + Spacer(modifier = Modifier.height(AppSpacing.xs)) Text( text = stringResource(Res.string.properties_expires, expiresAt), style = MaterialTheme.typography.bodySmall, @@ -113,7 +114,7 @@ fun ResidenceImportConfirmDialog( strokeWidth = 2.dp, color = MaterialTheme.colorScheme.onPrimary ) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text(stringResource(Res.string.properties_joining)) } else { Text(stringResource(Res.string.properties_join_button)) diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/documents/DocumentCard.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/documents/DocumentCard.kt index b1921e5..292b540 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/documents/DocumentCard.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/documents/DocumentCard.kt @@ -19,6 +19,8 @@ import com.tt.honeyDue.models.Document import com.tt.honeyDue.models.DocumentCategory import com.tt.honeyDue.models.DocumentType import com.tt.honeyDue.testing.AccessibilityIds +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing @Composable fun DocumentCard(document: Document, isWarrantyCard: Boolean = false, onClick: () -> Unit) { @@ -46,9 +48,9 @@ private fun WarrantyCardContent(document: Document, onClick: () -> Unit) { .testTag(AccessibilityIds.Document.documentCard) .clickable(onClick = onClick), elevation = CardDefaults.cardElevation(defaultElevation = 2.dp), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { - Column(modifier = Modifier.fillMaxWidth().padding(16.dp)) { + Column(modifier = Modifier.fillMaxWidth().padding(AppSpacing.lg)) { Row( modifier = Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.SpaceBetween, @@ -62,7 +64,7 @@ private fun WarrantyCardContent(document: Document, onClick: () -> Unit) { maxLines = 1, overflow = TextOverflow.Ellipsis ) - Spacer(modifier = Modifier.height(4.dp)) + Spacer(modifier = Modifier.height(AppSpacing.xs)) document.itemName?.let { itemName -> Text( itemName, @@ -76,8 +78,8 @@ private fun WarrantyCardContent(document: Document, onClick: () -> Unit) { Box( modifier = Modifier - .background(statusColor.copy(alpha = 0.2f), RoundedCornerShape(8.dp)) - .padding(horizontal = 8.dp, vertical = 4.dp) + .background(statusColor.copy(alpha = 0.2f), RoundedCornerShape(AppRadius.sm)) + .padding(horizontal = AppSpacing.sm, vertical = AppSpacing.xs) ) { Text( when { @@ -93,7 +95,7 @@ private fun WarrantyCardContent(document: Document, onClick: () -> Unit) { } } - Spacer(modifier = Modifier.height(12.dp)) + Spacer(modifier = Modifier.height(AppSpacing.md)) Row( modifier = Modifier.fillMaxWidth(), @@ -110,7 +112,7 @@ private fun WarrantyCardContent(document: Document, onClick: () -> Unit) { } if (document.isActive && daysUntilExpiration >= 0) { - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( "$daysUntilExpiration days remaining", style = MaterialTheme.typography.labelMedium, @@ -119,11 +121,11 @@ private fun WarrantyCardContent(document: Document, onClick: () -> Unit) { } document.category?.let { category -> - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Box( modifier = Modifier .background(Color(0xFFE5E7EB), RoundedCornerShape(6.dp)) - .padding(horizontal = 8.dp, vertical = 4.dp) + .padding(horizontal = AppSpacing.sm, vertical = AppSpacing.xs) ) { Text( DocumentCategory.fromValue(category).displayName, @@ -152,17 +154,17 @@ private fun RegularDocumentCardContent(document: Document, onClick: () -> Unit) .testTag(AccessibilityIds.Document.documentCard) .clickable(onClick = onClick), elevation = CardDefaults.cardElevation(defaultElevation = 2.dp), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Row( - modifier = Modifier.fillMaxWidth().padding(16.dp), - horizontalArrangement = Arrangement.spacedBy(12.dp) + modifier = Modifier.fillMaxWidth().padding(AppSpacing.lg), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { // Document icon Box( modifier = Modifier .size(56.dp) - .background(typeColor.copy(alpha = 0.1f), RoundedCornerShape(8.dp)), + .background(typeColor.copy(alpha = 0.1f), RoundedCornerShape(AppRadius.sm)), contentAlignment = Alignment.Center ) { Icon( @@ -187,7 +189,7 @@ private fun RegularDocumentCardContent(document: Document, onClick: () -> Unit) maxLines = 1, overflow = TextOverflow.Ellipsis ) - Spacer(modifier = Modifier.height(4.dp)) + Spacer(modifier = Modifier.height(AppSpacing.xs)) if (document.description?.isNotBlank() == true) { Text( @@ -197,16 +199,16 @@ private fun RegularDocumentCardContent(document: Document, onClick: () -> Unit) maxLines = 2, overflow = TextOverflow.Ellipsis ) - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) } Row( - horizontalArrangement = Arrangement.spacedBy(8.dp), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm), verticalAlignment = Alignment.CenterVertically ) { Box( modifier = Modifier - .background(typeColor.copy(alpha = 0.2f), RoundedCornerShape(4.dp)) + .background(typeColor.copy(alpha = 0.2f), RoundedCornerShape(AppRadius.xs)) .padding(horizontal = 6.dp, vertical = 2.dp) ) { Text( diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/PhotoViewerDialog.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/PhotoViewerDialog.kt index b556f43..03eb53c 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/PhotoViewerDialog.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/PhotoViewerDialog.kt @@ -26,6 +26,8 @@ import coil3.compose.SubcomposeAsyncImageContent import com.tt.honeyDue.models.TaskCompletionImage import com.tt.honeyDue.network.ApiClient import com.tt.honeyDue.ui.components.AuthenticatedImage +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing @Composable fun PhotoViewerDialog( @@ -52,7 +54,7 @@ fun PhotoViewerDialog( modifier = Modifier .fillMaxWidth(0.95f) .fillMaxHeight(0.9f), - shape = RoundedCornerShape(16.dp), + shape = RoundedCornerShape(AppRadius.lg), color = MaterialTheme.colorScheme.background ) { Column( @@ -62,7 +64,7 @@ fun PhotoViewerDialog( Row( modifier = Modifier .fillMaxWidth() - .padding(16.dp), + .padding(AppSpacing.lg), horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically ) { @@ -93,7 +95,7 @@ fun PhotoViewerDialog( Column( modifier = Modifier .fillMaxSize() - .padding(16.dp), + .padding(AppSpacing.lg), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center ) { @@ -107,7 +109,7 @@ fun PhotoViewerDialog( ) selectedImage!!.caption?.let { caption -> - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) Card( colors = CardDefaults.cardColors( containerColor = MaterialTheme.colorScheme.surfaceVariant @@ -116,7 +118,7 @@ fun PhotoViewerDialog( ) { Text( text = caption, - modifier = Modifier.padding(16.dp), + modifier = Modifier.padding(AppSpacing.lg), style = MaterialTheme.typography.bodyMedium ) } @@ -128,14 +130,14 @@ fun PhotoViewerDialog( columns = GridCells.Fixed(2), modifier = Modifier .fillMaxSize() - .padding(16.dp), - horizontalArrangement = Arrangement.spacedBy(12.dp), - verticalArrangement = Arrangement.spacedBy(12.dp) + .padding(AppSpacing.lg), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.md), + verticalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { items(images) { image -> Card( onClick = { selectedImage = image }, - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), elevation = CardDefaults.cardElevation(defaultElevation = 2.dp) ) { Column { @@ -151,7 +153,7 @@ fun PhotoViewerDialog( image.caption?.let { caption -> Text( text = caption, - modifier = Modifier.padding(8.dp), + modifier = Modifier.padding(AppSpacing.sm), style = MaterialTheme.typography.bodySmall, maxLines = 2 ) diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/SimpleTaskListItem.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/SimpleTaskListItem.kt index 241b2fc..1a26b52 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/SimpleTaskListItem.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/SimpleTaskListItem.kt @@ -8,6 +8,8 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import com.tt.honeyDue.util.DateUtils +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing import org.jetbrains.compose.ui.tooling.preview.Preview @Composable @@ -22,13 +24,13 @@ fun SimpleTaskListItem( ) { Card( modifier = modifier.fillMaxWidth(), - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), elevation = CardDefaults.cardElevation(defaultElevation = 2.dp) ) { Column( modifier = Modifier .fillMaxWidth() - .padding(16.dp) + .padding(AppSpacing.lg) ) { Row( modifier = Modifier.fillMaxWidth(), @@ -51,14 +53,14 @@ fun SimpleTaskListItem( ) { Text( text = priority?.uppercase() ?: "LOW", - modifier = Modifier.padding(horizontal = 8.dp, vertical = 4.dp), + modifier = Modifier.padding(horizontal = AppSpacing.sm, vertical = AppSpacing.xs), style = MaterialTheme.typography.labelSmall ) } } if (description != null) { - Spacer(modifier = Modifier.height(4.dp)) + Spacer(modifier = Modifier.height(AppSpacing.xs)) Text( text = description, style = MaterialTheme.typography.bodyMedium, @@ -66,7 +68,7 @@ fun SimpleTaskListItem( ) } - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Row( modifier = Modifier.fillMaxWidth(), @@ -96,8 +98,8 @@ fun SimpleTaskListItem( fun SimpleTaskListItemPreview() { MaterialTheme { Column( - modifier = Modifier.padding(16.dp), - verticalArrangement = Arrangement.spacedBy(8.dp) + modifier = Modifier.padding(AppSpacing.lg), + verticalArrangement = Arrangement.spacedBy(AppSpacing.sm) ) { SimpleTaskListItem( title = "Fix leaky faucet", diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskCard.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskCard.kt index 53dbd5c..8c1c718 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskCard.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskCard.kt @@ -25,6 +25,8 @@ import com.tt.honeyDue.models.TaskPriority import com.tt.honeyDue.models.TaskFrequency import com.tt.honeyDue.models.TaskCompletion import com.tt.honeyDue.util.DateUtils +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing import org.jetbrains.compose.resources.stringResource import org.jetbrains.compose.ui.tooling.preview.Preview @@ -59,7 +61,7 @@ fun TaskCard( } } ), - shape = RoundedCornerShape(12.dp), + shape = RoundedCornerShape(AppRadius.md), elevation = CardDefaults.cardElevation(defaultElevation = 4.dp), colors = CardDefaults.cardColors( containerColor = MaterialTheme.colorScheme.surfaceContainerHigh @@ -81,15 +83,15 @@ fun TaskCard( style = MaterialTheme.typography.titleMedium, color = MaterialTheme.colorScheme.onSurface ) - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) // Pill-style category badge Surface( color = MaterialTheme.colorScheme.surfaceVariant, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Text( text = (task.category?.name ?: "").uppercase(), - modifier = Modifier.padding(horizontal = 12.dp, vertical = 6.dp), + modifier = Modifier.padding(horizontal = AppSpacing.md, vertical = 6.dp), style = MaterialTheme.typography.labelSmall, color = MaterialTheme.colorScheme.onSurfaceVariant ) @@ -98,7 +100,7 @@ fun TaskCard( Column( horizontalAlignment = Alignment.End, - verticalArrangement = Arrangement.spacedBy(8.dp) + verticalArrangement = Arrangement.spacedBy(AppSpacing.sm) ) { // Priority badge with semantic colors val priorityColor = when (task.priority?.name?.lowercase()) { @@ -110,10 +112,10 @@ fun TaskCard( modifier = Modifier .background( priorityColor.copy(alpha = 0.15f), - RoundedCornerShape(12.dp) + RoundedCornerShape(AppRadius.md) ) - .padding(horizontal = 12.dp, vertical = 6.dp), - horizontalArrangement = Arrangement.spacedBy(4.dp), + .padding(horizontal = AppSpacing.md, vertical = 6.dp), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.xs), verticalAlignment = Alignment.CenterVertically ) { Box( @@ -134,11 +136,11 @@ fun TaskCard( val statusColor = MaterialTheme.colorScheme.tertiary Surface( color = statusColor.copy(alpha = 0.15f), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Text( text = stringResource(Res.string.tasks_card_in_progress), - modifier = Modifier.padding(horizontal = 12.dp, vertical = 6.dp), + modifier = Modifier.padding(horizontal = AppSpacing.md, vertical = 6.dp), style = MaterialTheme.typography.labelSmall, color = statusColor ) @@ -148,7 +150,7 @@ fun TaskCard( } if (task.description != null) { - Spacer(modifier = Modifier.height(12.dp)) + Spacer(modifier = Modifier.height(AppSpacing.md)) Text( text = task.description, style = MaterialTheme.typography.bodyMedium, @@ -156,23 +158,23 @@ fun TaskCard( ) } - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) HorizontalDivider(color = MaterialTheme.colorScheme.outlineVariant) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) // Metadata pills Row( modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.spacedBy(12.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { // Date pill Row( modifier = Modifier .background( MaterialTheme.colorScheme.surfaceVariant, - RoundedCornerShape(12.dp) + RoundedCornerShape(AppRadius.md) ) - .padding(horizontal = 12.dp, vertical = 6.dp), + .padding(horizontal = AppSpacing.md, vertical = 6.dp), verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.spacedBy(6.dp) ) { @@ -195,9 +197,9 @@ fun TaskCard( modifier = Modifier .background( MaterialTheme.colorScheme.surfaceVariant, - RoundedCornerShape(12.dp) + RoundedCornerShape(AppRadius.md) ) - .padding(horizontal = 12.dp, vertical = 6.dp), + .padding(horizontal = AppSpacing.md, vertical = 6.dp), verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.spacedBy(6.dp) ) { @@ -220,13 +222,13 @@ fun TaskCard( if (buttonTypes.isNotEmpty() || task.completionCount > 0) { var showActionsMenu by remember { mutableStateOf(false) } - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) HorizontalDivider(color = MaterialTheme.colorScheme.outlineVariant) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(AppSpacing.lg)) Row( modifier = Modifier.fillMaxWidth(), - horizontalArrangement = Arrangement.spacedBy(12.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { // Actions dropdown menu based on buttonTypes array if (buttonTypes.isNotEmpty()) { @@ -238,14 +240,14 @@ fun TaskCard( containerColor = MaterialTheme.colorScheme.primaryContainer, contentColor = MaterialTheme.colorScheme.onPrimaryContainer ), - shape = RoundedCornerShape(8.dp) + shape = RoundedCornerShape(AppRadius.sm) ) { Icon( Icons.Default.MoreVert, contentDescription = null, // decorative modifier = Modifier.size(18.dp) ) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text( text = stringResource(Res.string.tasks_card_actions), style = MaterialTheme.typography.labelLarge, @@ -308,7 +310,7 @@ fun TaskCard( containerColor = MaterialTheme.colorScheme.tertiaryContainer, contentColor = MaterialTheme.colorScheme.onTertiaryContainer ), - shape = RoundedCornerShape(8.dp) + shape = RoundedCornerShape(AppRadius.sm) ) { Icon( Icons.Default.CheckCircle, @@ -524,7 +526,7 @@ fun CompletionCard(completion: TaskCompletion) { Column( modifier = Modifier .fillMaxWidth() - .padding(16.dp) + .padding(AppSpacing.lg) ) { Row( modifier = Modifier.fillMaxWidth(), @@ -540,11 +542,11 @@ fun CompletionCard(completion: TaskCompletion) { completion.rating?.let { rating -> Surface( color = MaterialTheme.colorScheme.tertiaryContainer, - shape = RoundedCornerShape(8.dp) + shape = RoundedCornerShape(AppRadius.sm) ) { Text( text = "$rating★", - modifier = Modifier.padding(horizontal = 8.dp, vertical = 4.dp), + modifier = Modifier.padding(horizontal = AppSpacing.sm, vertical = AppSpacing.xs), style = MaterialTheme.typography.labelMedium, fontWeight = FontWeight.Bold, color = MaterialTheme.colorScheme.onTertiaryContainer @@ -555,7 +557,7 @@ fun CompletionCard(completion: TaskCompletion) { // Display contractor or manual entry completion.contractorDetails?.let { contractor -> - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Row(verticalAlignment = Alignment.CenterVertically) { Icon( Icons.Default.Build, @@ -563,7 +565,7 @@ fun CompletionCard(completion: TaskCompletion) { modifier = Modifier.size(16.dp), tint = MaterialTheme.colorScheme.primary ) - Spacer(modifier = Modifier.width(4.dp)) + Spacer(modifier = Modifier.width(AppSpacing.xs)) Column { Text( text = stringResource(Res.string.tasks_card_completed_by, contractor.name), @@ -580,7 +582,7 @@ fun CompletionCard(completion: TaskCompletion) { } } } ?: completion.completedByName?.let { - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = stringResource(Res.string.tasks_card_completed_by, it), style = MaterialTheme.typography.bodySmall, @@ -598,7 +600,7 @@ fun CompletionCard(completion: TaskCompletion) { } completion.notes?.let { - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = it, style = MaterialTheme.typography.bodySmall, @@ -608,7 +610,7 @@ fun CompletionCard(completion: TaskCompletion) { // Show button to view photos if images exist if (hasImages) { - Spacer(modifier = Modifier.height(12.dp)) + Spacer(modifier = Modifier.height(AppSpacing.md)) Button( onClick = { println("View Photos button clicked!") @@ -625,7 +627,7 @@ fun CompletionCard(completion: TaskCompletion) { contentDescription = null, // decorative modifier = Modifier.size(18.dp) ) - Spacer(modifier = Modifier.width(8.dp)) + Spacer(modifier = Modifier.width(AppSpacing.sm)) Text( text = stringResource(Res.string.tasks_card_view_photos, completion.images?.size ?: 0), style = MaterialTheme.typography.labelLarge, diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskKanbanView.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskKanbanView.kt index 78f697b..d29fa7b 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskKanbanView.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/components/task/TaskKanbanView.kt @@ -24,6 +24,8 @@ import androidx.compose.ui.unit.dp import com.tt.honeyDue.models.TaskColumn import com.tt.honeyDue.models.TaskDetail import com.tt.honeyDue.testing.AccessibilityIds +import com.tt.honeyDue.ui.theme.AppRadius +import com.tt.honeyDue.ui.theme.AppSpacing @OptIn(ExperimentalFoundationApi::class) @Composable @@ -131,19 +133,19 @@ private fun TaskColumn( .fillMaxSize() .background( MaterialTheme.colorScheme.surface, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) ) { // Header Row( modifier = Modifier .fillMaxWidth() - .padding(16.dp), + .padding(AppSpacing.lg), horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically ) { Row( - horizontalArrangement = Arrangement.spacedBy(8.dp), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm), verticalAlignment = Alignment.CenterVertically ) { Icon( @@ -189,7 +191,7 @@ private fun TaskColumn( tint = color.copy(alpha = 0.3f), modifier = Modifier.size(48.dp) ) - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = "No tasks", style = MaterialTheme.typography.bodyMedium, @@ -202,8 +204,8 @@ private fun TaskColumn( LazyColumn( modifier = Modifier.fillMaxSize(), - contentPadding = PaddingValues(16.dp), - verticalArrangement = Arrangement.spacedBy(12.dp) + contentPadding = PaddingValues(AppSpacing.lg), + verticalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { items(tasks, key = { it.id }) { task -> TaskCard( @@ -323,12 +325,12 @@ private fun DynamicTaskColumn( Row( modifier = Modifier .fillMaxWidth() - .padding(horizontal = 16.dp, vertical = 12.dp), + .padding(horizontal = AppSpacing.lg, vertical = AppSpacing.md), horizontalArrangement = Arrangement.SpaceBetween, verticalAlignment = Alignment.CenterVertically ) { Row( - horizontalArrangement = Arrangement.spacedBy(8.dp), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm), verticalAlignment = Alignment.CenterVertically ) { Icon( @@ -374,7 +376,7 @@ private fun DynamicTaskColumn( tint = columnColor.copy(alpha = 0.3f), modifier = Modifier.size(48.dp) ) - Spacer(modifier = Modifier.height(8.dp)) + Spacer(modifier = Modifier.height(AppSpacing.sm)) Text( text = "No tasks", style = MaterialTheme.typography.bodyMedium, @@ -393,7 +395,7 @@ private fun DynamicTaskColumn( top = 8.dp, bottom = 16.dp + bottomPadding ), - verticalArrangement = Arrangement.spacedBy(16.dp) + verticalArrangement = Arrangement.spacedBy(AppSpacing.lg) ) { items(column.tasks, key = { it.id }) { task -> // Use existing TaskCard component with buttonTypes array diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/DocumentFormScreen.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/DocumentFormScreen.kt index 1751495..7c38b02 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/DocumentFormScreen.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/DocumentFormScreen.kt @@ -543,7 +543,7 @@ fun DocumentFormScreen( ) { Column( modifier = Modifier.padding(OrganicSpacing.cozy), - verticalArrangement = Arrangement.spacedBy(12.dp) + verticalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { Text( stringResource(Res.string.documents_form_existing_photos, existingImages.size), @@ -557,8 +557,8 @@ fun DocumentFormScreen( modifier = Modifier .fillMaxWidth() .height(200.dp) - .clip(RoundedCornerShape(8.dp)) - .border(1.dp, MaterialTheme.colorScheme.outline, RoundedCornerShape(8.dp)), + .clip(RoundedCornerShape(AppRadius.sm)) + .border(1.dp, MaterialTheme.colorScheme.outline, RoundedCornerShape(AppRadius.sm)), contentScale = ContentScale.Crop ) } @@ -573,7 +573,7 @@ fun DocumentFormScreen( ) { Column( modifier = Modifier.padding(OrganicSpacing.cozy), - verticalArrangement = Arrangement.spacedBy(12.dp) + verticalArrangement = Arrangement.spacedBy(AppSpacing.md) ) { Text( if (isEditMode) { @@ -593,7 +593,7 @@ fun DocumentFormScreen( enabled = selectedImages.size < maxImages ) { Icon(Icons.Default.CameraAlt, null, modifier = Modifier.size(18.dp)) - Spacer(modifier = Modifier.width(4.dp)) + Spacer(modifier = Modifier.width(AppSpacing.xs)) Text(stringResource(Res.string.documents_form_camera)) } @@ -603,7 +603,7 @@ fun DocumentFormScreen( enabled = selectedImages.size < maxImages ) { Icon(Icons.Default.Photo, null, modifier = Modifier.size(18.dp)) - Spacer(modifier = Modifier.width(4.dp)) + Spacer(modifier = Modifier.width(AppSpacing.xs)) Text(stringResource(Res.string.documents_form_gallery)) } } @@ -659,7 +659,7 @@ fun DocumentFormScreen( ) { Text( com.tt.honeyDue.util.ErrorMessageParser.parse((operationState as ApiResult.Error).message), - modifier = Modifier.padding(12.dp), + modifier = Modifier.padding(AppSpacing.md), color = MaterialTheme.colorScheme.error ) } diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ProfileScreen.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ProfileScreen.kt index 5523bf0..e54d214 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ProfileScreen.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ProfileScreen.kt @@ -584,7 +584,7 @@ fun ProfileScreen( }, modifier = Modifier.fillMaxWidth(), singleLine = true, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) OutlinedTextField( @@ -596,7 +596,7 @@ fun ProfileScreen( }, modifier = Modifier.fillMaxWidth(), singleLine = true, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) OutlinedTextField( @@ -608,7 +608,7 @@ fun ProfileScreen( }, modifier = Modifier.fillMaxWidth(), singleLine = true, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) if (errorMessage.isNotEmpty()) { @@ -654,13 +654,13 @@ fun ProfileScreen( colors = CardDefaults.cardColors( containerColor = MaterialTheme.colorScheme.primaryContainer ), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Row( modifier = Modifier .fillMaxWidth() - .padding(16.dp), - horizontalArrangement = Arrangement.spacedBy(12.dp), + .padding(AppSpacing.lg), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.md), verticalAlignment = Alignment.CenterVertically ) { Icon( @@ -693,7 +693,7 @@ fun ProfileScreen( .fillMaxWidth() .height(56.dp), enabled = email.isNotEmpty() && !isLoading, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { if (isLoading) { CircularProgressIndicator( @@ -703,7 +703,7 @@ fun ProfileScreen( ) } else { Row( - horizontalArrangement = Arrangement.spacedBy(8.dp), + horizontalArrangement = Arrangement.spacedBy(AppSpacing.sm), verticalAlignment = Alignment.CenterVertically ) { Icon(Icons.Default.Save, contentDescription = null) // decorative diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/RegisterScreen.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/RegisterScreen.kt index 9923889..1c6b3b0 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/RegisterScreen.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/RegisterScreen.kt @@ -132,7 +132,7 @@ fun RegisterScreen( .fillMaxWidth() .testTag(AccessibilityIds.Authentication.registerUsernameField), singleLine = true, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) OutlinedTextField( @@ -146,7 +146,7 @@ fun RegisterScreen( .fillMaxWidth() .testTag(AccessibilityIds.Authentication.registerEmailField), singleLine = true, - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) OrganicDivider() @@ -163,7 +163,7 @@ fun RegisterScreen( .testTag(AccessibilityIds.Authentication.registerPasswordField), singleLine = true, visualTransformation = PasswordVisualTransformation(), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) OutlinedTextField( @@ -178,7 +178,7 @@ fun RegisterScreen( .testTag(AccessibilityIds.Authentication.registerConfirmPasswordField), singleLine = true, visualTransformation = PasswordVisualTransformation(), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) } } diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ResidencesScreen.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ResidencesScreen.kt index 9db2e70..d435641 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ResidencesScreen.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/ResidencesScreen.kt @@ -267,7 +267,7 @@ fun ResidencesScreen( .fillMaxWidth(0.7f) .height(56.dp) .testTag(AccessibilityIds.Residence.emptyStateButton), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Row( horizontalArrangement = Arrangement.spacedBy(OrganicSpacing.compact), @@ -295,7 +295,7 @@ fun ResidencesScreen( modifier = Modifier .fillMaxWidth(0.7f) .height(56.dp), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Row( horizontalArrangement = Arrangement.spacedBy(OrganicSpacing.compact), @@ -319,7 +319,7 @@ fun ResidencesScreen( modifier = Modifier .fillMaxWidth(0.7f) .height(56.dp), - shape = RoundedCornerShape(12.dp) + shape = RoundedCornerShape(AppRadius.md) ) { Row( horizontalArrangement = Arrangement.spacedBy(OrganicSpacing.compact), @@ -587,13 +587,13 @@ fun ResidencesScreen( ) } - Spacer(modifier = Modifier.height(4.dp)) + Spacer(modifier = Modifier.height(AppSpacing.xs)) // Street address (if available) if (residence.streetAddress.isNotBlank()) { Row( verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(4.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.xs) ) { Icon( Icons.Default.Place, @@ -614,7 +614,7 @@ fun ResidencesScreen( // City, State Row( verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(4.dp) + horizontalArrangement = Arrangement.spacedBy(AppSpacing.xs) ) { Icon( Icons.Default.LocationOn, diff --git a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/onboarding/OnboardingFirstTaskContent.kt b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/onboarding/OnboardingFirstTaskContent.kt index 38d7da0..a37849d 100644 --- a/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/onboarding/OnboardingFirstTaskContent.kt +++ b/composeApp/src/commonMain/kotlin/com/tt/honeyDue/ui/screens/onboarding/OnboardingFirstTaskContent.kt @@ -437,7 +437,7 @@ private fun ForYouTabContent( ) Spacer(modifier = Modifier.height(OrganicSpacing.sm)) } - item { Spacer(modifier = Modifier.height(24.dp)) } + item { Spacer(modifier = Modifier.height(AppSpacing.xl)) } } } } @@ -583,7 +583,7 @@ private fun BrowseTabContent( ) Spacer(modifier = Modifier.height(OrganicSpacing.md)) } - item { Spacer(modifier = Modifier.height(24.dp)) } + item { Spacer(modifier = Modifier.height(AppSpacing.xl)) } } } }