diff --git a/.jules/palette.md b/.jules/palette.md new file mode 100644 index 0000000..a021571 --- /dev/null +++ b/.jules/palette.md @@ -0,0 +1,6 @@ +## 2024-05-18 - MinimalButton Accessibility +**Learning:** Custom clickable components without a specific Semantic Role assigned will not be announced correctly by screen readers. Applying `role = Role.Button` to the `clickable` modifier ensures it is recognized correctly as a button. +**Action:** Add `role = Role.Button` to the `clickable` modifier for custom interactive button components. +## 2024-05-18 - Redundant Icon Content Descriptions +**Learning:** Adding `contentDescription` to icons that are directly adjacent to `Text` components containing the same wording is an anti-pattern. Screen readers will announce the information twice (e.g., "Liked, Liked"), creating a noisy experience. Icons in this context should remain decorative (`contentDescription = null`). +**Action:** Verify if text alternatives exist near visual elements before assigning a `contentDescription` to avoid duplicate screen reader announcements. diff --git a/app/src/main/java/com/example/reddittube/ui/main/components/MinimalButton.kt b/app/src/main/java/com/example/reddittube/ui/main/components/MinimalButton.kt index 4666b18..8879150 100644 --- a/app/src/main/java/com/example/reddittube/ui/main/components/MinimalButton.kt +++ b/app/src/main/java/com/example/reddittube/ui/main/components/MinimalButton.kt @@ -14,6 +14,7 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.Color +import androidx.compose.ui.semantics.Role import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp @@ -30,7 +31,7 @@ fun MinimalButton( modifier = modifier .clip(RoundedCornerShape(16.dp)) .background(Color.White.copy(alpha = 0.12f)) - .clickable(onClick = onClick) + .clickable(onClick = onClick, role = Role.Button) .padding(horizontal = 10.dp, vertical = 6.dp), verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.Center