Merge pull request #2922 from element-hq/feature/bma/iterateOnPreferenceDesign2

Iterate on preference design

features/lockscreen/impl/src/main/kotlin/io/element/android/features/lockscreen/impl/settings/LockScreenSettingsView.kt

@@ -43,7 +43,7 @@ fun LockScreenSettingsView(
         onBackPressed = onBackPressed,
         modifier = modifier
     ) {
-        PreferenceCategory(showDivider = false) {
+        PreferenceCategory(showTopDivider = false) {
             PreferenceText(
                 title = stringResource(id = R.string.screen_app_lock_settings_change_pin),
                 onClick = onChangePinClicked

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/developer/DeveloperSettingsView.kt

@@ -48,7 +48,10 @@ fun DeveloperSettingsView(
         title = stringResource(id = CommonStrings.common_developer_options)
     ) {
         // Note: this is OK to hardcode strings in this debug screen.
-        PreferenceCategory(title = "Feature flags") {
+        PreferenceCategory(
+            title = "Feature flags",
+            showTopDivider = false,
+        ) {
             FeatureListContent(state)
         }
         ElementCallCategory(state = state)
@@ -67,14 +70,14 @@ fun DeveloperSettingsView(
         RageshakePreferencesView(
             state = state.rageshakeState,
         )
-        PreferenceCategory(title = "Crash", showDivider = false) {
+        PreferenceCategory(title = "Crash", showTopDivider = false) {
             PreferenceText(
                 title = "Crash the app 💥",
                 onClick = { error("This crash is a test.") }
             )
         }
         val cache = state.cacheSize
-        PreferenceCategory(title = "Cache", showDivider = false) {
+        PreferenceCategory(title = "Cache", showTopDivider = false) {
             PreferenceText(
                 title = "Clear cache",
                 currentValue = cache.dataOrNull(),
@@ -93,11 +96,12 @@ fun DeveloperSettingsView(
 private fun ElementCallCategory(
     state: DeveloperSettingsState,
 ) {
-    PreferenceCategory(title = "Element Call", showDivider = true) {
+    PreferenceCategory(title = "Element Call", showTopDivider = true) {
         val callUrlState = state.customElementCallBaseUrlState
         fun isUsingDefaultUrl(value: String?): Boolean {
             return value.isNullOrEmpty() || value == callUrlState.defaultUrl
         }
+
         val supportingText = if (isUsingDefaultUrl(callUrlState.baseUrl)) {
             stringResource(R.string.screen_advanced_settings_element_call_base_url_description)
         } else {

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/notifications/NotificationSettingsView.kt

@@ -17,7 +17,6 @@
 package io.element.android.features.preferences.impl.notifications
 
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.stringResource
@@ -121,7 +120,6 @@ private fun NotificationSettingsContentView(
     PreferenceSwitch(
         title = stringResource(id = R.string.screen_notification_settings_enable_notifications),
         isChecked = systemSettings.appNotificationsEnabled,
-        switchAlignment = Alignment.Top,
         onCheckedChange = onNotificationsEnabledChanged
     )
 
@@ -145,7 +143,6 @@ private fun NotificationSettingsContentView(
                 modifier = Modifier,
                 title = stringResource(id = R.string.screen_notification_settings_room_mention_label),
                 isChecked = matrixSettings.atRoomNotificationsEnabled,
-                switchAlignment = Alignment.Top,
                 onCheckedChange = onMentionNotificationsChanged
             )
         }
@@ -162,7 +159,6 @@ private fun NotificationSettingsContentView(
                 modifier = Modifier,
                 title = stringResource(id = R.string.screen_notification_settings_invite_for_me_label),
                 isChecked = matrixSettings.inviteForMeNotificationsEnabled,
-                switchAlignment = Alignment.Top,
                 onCheckedChange = onInviteForMeNotificationsChanged
             )
         }

features/preferences/impl/src/main/kotlin/io/element/android/features/preferences/impl/notifications/edit/EditDefaultNotificationSettingView.kt

@@ -68,7 +68,10 @@ fun EditDefaultNotificationSettingView(
         } else {
             R.string.screen_notification_settings_edit_screen_group_section_header
         }
-        PreferenceCategory(title = stringResource(id = categoryTitle)) {
+        PreferenceCategory(
+            title = stringResource(id = categoryTitle),
+            showTopDivider = false,
+        ) {
             if (state.mode != null) {
                 Column(modifier = Modifier.selectableGroup()) {
                     validModes.forEach { item ->

features/preferences/impl/src/test/kotlin/io/element/android/features/preferences/impl/developer/DeveloperSettingsViewTest.kt

@@ -82,6 +82,7 @@ class DeveloperSettingsViewTest {
         }
     }
 
+    @Config(qualifiers = "h1024dp")
     @Test
     fun `clicking on configure tracing invokes the expected callback`() {
         val eventsRecorder = EventsRecorder<DeveloperSettingsEvents>(expectEvents = false)
@@ -96,7 +97,7 @@ class DeveloperSettingsViewTest {
         }
     }
 
-    @Config(qualifiers = "h1024dp")
+    @Config(qualifiers = "h1500dp")
     @Test
     fun `clicking on clear cache emits the expected event`() {
         val eventsRecorder = EventsRecorder<DeveloperSettingsEvents>()

features/roomdetails/impl/src/main/kotlin/io/element/android/features/roomdetails/impl/RoomDetailsView.kt

@@ -399,7 +399,10 @@ private fun TopicSection(
     roomTopic: RoomTopicState,
     onActionClicked: (RoomDetailsAction) -> Unit,
 ) {
-    PreferenceCategory(title = stringResource(CommonStrings.common_topic)) {
+    PreferenceCategory(
+        title = stringResource(CommonStrings.common_topic),
+        showTopDivider = false,
+    ) {
         if (roomTopic is RoomTopicState.CanAddTopic) {
             PreferenceText(
                 title = stringResource(R.string.screen_room_details_add_topic_title),
@@ -489,7 +492,7 @@ private fun SecuritySection() {
 
 @Composable
 private fun OtherActionsSection(isDm: Boolean, onLeaveRoom: () -> Unit) {
-    PreferenceCategory(showDivider = false) {
+    PreferenceCategory(showTopDivider = true) {
         ListItem(
             headlineContent = {
                 val leaveText = stringResource(

features/userprofile/shared/src/main/kotlin/io/element/android/features/userprofile/shared/blockuser/BlockUserSection.kt

@@ -45,7 +45,7 @@ fun BlockUserSection(
 ) {
     PreferenceCategory(
         modifier = modifier,
-        showDivider = false,
+        showTopDivider = false,
     ) {
         when (state.isBlocked) {
             is AsyncData.Failure -> PreferenceBlockUser(isBlocked = state.isBlocked.prevData, isLoading = false, eventSink = state.eventSink)

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/Config.kt

@@ -1,23 +0,0 @@
-/*
- * Copyright (c) 2023 New Vector Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-package io.element.android.libraries.designsystem.components.preferences
-
-import androidx.compose.ui.unit.dp
-
-internal val preferenceMinHeightOnlyTitle = 56.dp
-internal val preferenceMinHeight = 56.dp
-internal val preferencePaddingHorizontal = 16.dp

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceCategory.kt

@@ -19,22 +19,19 @@ package io.element.android.libraries.designsystem.components.preferences
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
-import io.element.android.libraries.designsystem.theme.components.Text
+import io.element.android.libraries.designsystem.theme.components.ListSectionHeader
 
 @Composable
 fun PreferenceCategory(
     modifier: Modifier = Modifier,
     title: String? = null,
-    showDivider: Boolean = true,
+    showTopDivider: Boolean = true,
     content: @Composable ColumnScope.() -> Unit,
 ) {
     Column(
@@ -42,30 +39,17 @@ fun PreferenceCategory(
             .fillMaxWidth()
     ) {
         if (title != null) {
-            PreferenceCategoryTitle(title = title)
-        }
-        content()
-        if (showDivider) {
+            ListSectionHeader(
+                title = title,
+                hasDivider = showTopDivider,
+            )
+        } else if (showTopDivider) {
             PreferenceDivider()
         }
+        content()
     }
 }
 
-@Composable
-private fun PreferenceCategoryTitle(title: String) {
-    Text(
-        modifier = Modifier.padding(
-            top = 20.dp,
-            bottom = 8.dp,
-            start = preferencePaddingHorizontal,
-            end = preferencePaddingHorizontal,
-        ),
-        style = ElementTheme.typography.fontBodyLgMedium,
-        color = ElementTheme.materialColors.primary,
-        text = title,
-    )
-}
-
 @Preview(group = PreviewGroup.Preferences)
 @Composable
 internal fun PreferenceCategoryPreview() = ElementThemedPreview {

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceCheckbox.kt

@@ -17,25 +17,18 @@
 package io.element.android.libraries.designsystem.components.preferences
 
 import androidx.annotation.DrawableRes
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.defaultMinSize
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
 import io.element.android.compound.theme.ElementTheme
-import io.element.android.libraries.designsystem.components.preferences.components.PreferenceIcon
+import io.element.android.libraries.designsystem.components.list.ListItemContent
+import io.element.android.libraries.designsystem.components.preferences.components.preferenceIcon
 import io.element.android.libraries.designsystem.icons.CompoundDrawables
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
-import io.element.android.libraries.designsystem.theme.components.Checkbox
+import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 import io.element.android.libraries.designsystem.toSecondaryEnabledColor
@@ -52,45 +45,36 @@ fun PreferenceCheckbox(
     @DrawableRes iconResourceId: Int? = null,
     showIconAreaIfNoIcon: Boolean = false,
 ) {
-    Row(
-        modifier = modifier
-            .fillMaxWidth()
-            .defaultMinSize(minHeight = preferenceMinHeight)
-            .clickable { onCheckedChange(!isChecked) }
-            .padding(vertical = 4.dp, horizontal = preferencePaddingHorizontal),
-        verticalAlignment = Alignment.CenterVertically
-    ) {
-        PreferenceIcon(
+    ListItem(
+        modifier = modifier,
+        onClick = onCheckedChange.takeIf { enabled }?.let { { onCheckedChange(!isChecked) } },
+        leadingContent = preferenceIcon(
             icon = icon,
             iconResourceId = iconResourceId,
             enabled = enabled,
-            isVisible = showIconAreaIfNoIcon
-        )
-        Column(
-            modifier = Modifier.weight(1f),
-            verticalArrangement = Arrangement.spacedBy(4.dp),
-        ) {
+            showIconAreaIfNoIcon = showIconAreaIfNoIcon,
+        ),
+        headlineContent = {
             Text(
                 style = ElementTheme.typography.fontBodyLgRegular,
                 text = title,
                 color = enabled.toEnabledColor(),
             )
-            if (supportingText != null) {
+        },
+        supportingContent = supportingText?.let {
+            {
                 Text(
                     style = ElementTheme.typography.fontBodyMdRegular,
-                    text = supportingText,
+                    text = it,
                     color = enabled.toSecondaryEnabledColor(),
                 )
             }
-        }
-        Checkbox(
-            modifier = Modifier
-                .align(Alignment.CenterVertically),
+        },
+        trailingContent = ListItemContent.Checkbox(
             checked = isChecked,
             enabled = enabled,
-            onCheckedChange = onCheckedChange
-        )
-    }
+        ),
+    )
 }
 
 @Preview(group = PreviewGroup.Preferences)
@@ -112,5 +96,31 @@ internal fun PreferenceCheckboxPreview() = ElementThemedPreview {
             isChecked = true,
             onCheckedChange = {},
         )
+        PreferenceCheckbox(
+            title = "Checkbox with supporting text",
+            supportingText = "Supporting text",
+            iconResourceId = CompoundDrawables.ic_compound_threads,
+            enabled = false,
+            isChecked = true,
+            onCheckedChange = {},
+        )
+        PreferenceCheckbox(
+            title = "Checkbox with supporting text",
+            supportingText = "Supporting text",
+            iconResourceId = null,
+            showIconAreaIfNoIcon = true,
+            enabled = true,
+            isChecked = true,
+            onCheckedChange = {},
+        )
+        PreferenceCheckbox(
+            title = "Checkbox with supporting text",
+            supportingText = "Supporting text",
+            iconResourceId = null,
+            showIconAreaIfNoIcon = false,
+            enabled = true,
+            isChecked = true,
+            onCheckedChange = {},
+        )
     }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceDivider.kt

@@ -19,7 +19,6 @@ package io.element.android.libraries.designsystem.components.preferences
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
-import io.element.android.compound.theme.ElementTheme
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.HorizontalDivider
@@ -28,10 +27,7 @@ import io.element.android.libraries.designsystem.theme.components.HorizontalDivi
 fun PreferenceDivider(
     modifier: Modifier = Modifier,
 ) {
-    HorizontalDivider(
-        modifier = modifier,
-        color = ElementTheme.colors.borderDisabled,
-    )
+    HorizontalDivider(modifier = modifier)
 }
 
 @Preview(group = PreviewGroup.Preferences)

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceRow.kt

@@ -19,14 +19,13 @@ package io.element.android.libraries.designsystem.components.preferences
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.heightIn
-import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Text
 
 /**
@@ -37,15 +36,17 @@ fun PreferenceRow(
     modifier: Modifier = Modifier,
     content: @Composable RowScope.() -> Unit,
 ) {
-    Row(
-        modifier = modifier
-            .padding(horizontal = preferencePaddingHorizontal)
-            .heightIn(min = preferenceMinHeight)
-            .fillMaxWidth(),
-        verticalAlignment = Alignment.CenterVertically,
-    ) {
-        content()
-    }
+    ListItem(
+        modifier = modifier,
+        headlineContent = {
+            Row(
+                modifier = Modifier.fillMaxWidth(),
+                verticalAlignment = Alignment.CenterVertically,
+            ) {
+                content()
+            }
+        }
+    )
 }
 
 @Preview(group = PreviewGroup.Preferences)

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceSlide.kt

@@ -19,23 +19,18 @@ package io.element.android.libraries.designsystem.components.preferences
 import androidx.annotation.DrawableRes
 import androidx.annotation.FloatRange
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.defaultMinSize
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
 import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
-import io.element.android.libraries.designsystem.components.preferences.components.PreferenceIcon
+import io.element.android.libraries.designsystem.components.preferences.components.preferenceIcon
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
+import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Slider
 import io.element.android.libraries.designsystem.theme.components.Text
-import io.element.android.libraries.designsystem.toEnabledColor
 
 @Composable
 fun PreferenceSlide(
@@ -51,51 +46,57 @@ fun PreferenceSlide(
     summary: String? = null,
     steps: Int = 0,
 ) {
-    Row(
-        modifier = modifier
-            .fillMaxWidth()
-            .defaultMinSize(minHeight = preferenceMinHeight)
-            .padding(vertical = 4.dp, horizontal = preferencePaddingHorizontal),
-    ) {
-        PreferenceIcon(
+    ListItem(
+        modifier = modifier,
+        enabled = enabled,
+        leadingContent = preferenceIcon(
             icon = icon,
             iconResourceId = iconResourceId,
-            isVisible = showIconAreaIfNoIcon,
-        )
-        Column(
-            modifier = Modifier
-                .weight(1f),
-        ) {
-            Text(
-                style = ElementTheme.typography.fontBodyLgRegular,
-                text = title,
-                color = enabled.toEnabledColor(),
-            )
-            summary?.let {
+            enabled = enabled,
+            showIconAreaIfNoIcon = showIconAreaIfNoIcon,
+        ),
+        headlineContent = {
+            Column {
                 Text(
-                    style = ElementTheme.typography.fontBodyMdRegular,
-                    text = summary,
-                    color = enabled.toEnabledColor(),
+                    style = ElementTheme.typography.fontBodyLgRegular,
+                    text = title,
+                )
+                summary?.let {
+                    Text(
+                        style = ElementTheme.typography.fontBodyMdRegular,
+                        text = summary,
+                    )
+                }
+                Slider(
+                    value = value,
+                    steps = steps,
+                    onValueChange = onValueChange,
+                    enabled = enabled,
                 )
             }
-            Slider(
-                value = value,
-                steps = steps,
-                onValueChange = onValueChange,
-                enabled = enabled,
-            )
         }
-    }
+    )
 }
 
 @Preview(group = PreviewGroup.Preferences)
 @Composable
 internal fun PreferenceSlidePreview() = ElementThemedPreview {
-    PreferenceSlide(
-        icon = CompoundIcons.UserProfile(),
-        title = "Slide",
-        summary = "Summary",
-        value = 0.75F,
-        onValueChange = {},
-    )
+    Column {
+        PreferenceSlide(
+            icon = CompoundIcons.UserProfile(),
+            title = "Slide",
+            summary = "Summary",
+            enabled = true,
+            value = 0.75F,
+            onValueChange = {},
+        )
+        PreferenceSlide(
+            icon = CompoundIcons.UserProfile(),
+            title = "Slide",
+            summary = "Summary",
+            enabled = false,
+            value = 0.75F,
+            onValueChange = {},
+        )
+    }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceSwitch.kt

@@ -17,30 +17,19 @@
 package io.element.android.libraries.designsystem.components.preferences
 
 import androidx.annotation.DrawableRes
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.defaultMinSize
-import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.width
 import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
 import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
-import io.element.android.libraries.designsystem.components.preferences.components.PreferenceIcon
+import io.element.android.libraries.designsystem.components.list.ListItemContent
+import io.element.android.libraries.designsystem.components.preferences.components.preferenceIcon
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
-import io.element.android.libraries.designsystem.theme.components.Switch
+import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Text
-import io.element.android.libraries.designsystem.toEnabledColor
-import io.element.android.libraries.designsystem.toSecondaryEnabledColor
 
 @Composable
 fun PreferenceSwitch(
@@ -53,62 +42,65 @@ fun PreferenceSwitch(
     icon: ImageVector? = null,
     @DrawableRes iconResourceId: Int? = null,
     showIconAreaIfNoIcon: Boolean = false,
-    switchAlignment: Alignment.Vertical = Alignment.CenterVertically
 ) {
-    Row(
-        modifier = modifier
-            .fillMaxWidth()
-            .defaultMinSize(minHeight = preferenceMinHeight)
-            .clickable { onCheckedChange(!isChecked) }
-            .padding(vertical = 4.dp, horizontal = preferencePaddingHorizontal),
-        verticalAlignment = Alignment.CenterVertically
-    ) {
-        PreferenceIcon(
+    ListItem(
+        modifier = modifier,
+        enabled = enabled,
+        onClick = onCheckedChange.takeIf { enabled }?.let { { onCheckedChange(!isChecked) } },
+        leadingContent = preferenceIcon(
             icon = icon,
             iconResourceId = iconResourceId,
             enabled = enabled,
-            isVisible = showIconAreaIfNoIcon
-        )
-        Column(
-            modifier = Modifier
-                .weight(1f)
-                .align(Alignment.CenterVertically)
-        ) {
+            showIconAreaIfNoIcon = showIconAreaIfNoIcon,
+        ),
+        headlineContent = {
             Text(
                 style = ElementTheme.typography.fontBodyLgRegular,
                 text = title,
-                color = enabled.toEnabledColor(),
             )
-            if (subtitle != null) {
-                Spacer(modifier = Modifier.height(4.dp))
+        },
+        supportingContent = subtitle?.let {
+            {
                 Text(
                     style = ElementTheme.typography.fontBodyMdRegular,
                     text = subtitle,
-                    color = enabled.toSecondaryEnabledColor(),
                 )
             }
-        }
-        Spacer(modifier = Modifier.width(16.dp))
-        // TODO Create a wrapper for Switch
-        Switch(
-            modifier = Modifier
-                .align(switchAlignment),
+        },
+        trailingContent = ListItemContent.Switch(
             checked = isChecked,
             enabled = enabled,
-            onCheckedChange = onCheckedChange
         )
-    }
+    )
 }
 
 @Preview(group = PreviewGroup.Preferences)
 @Composable
 internal fun PreferenceSwitchPreview() = ElementThemedPreview {
-    PreferenceSwitch(
-        title = "Switch",
-        subtitle = "Subtitle Switch",
-        icon = CompoundIcons.Threads(),
-        enabled = true,
-        isChecked = true,
-        onCheckedChange = {},
-    )
+    Column {
+        PreferenceSwitch(
+            title = "Switch",
+            subtitle = "Subtitle Switch",
+            icon = CompoundIcons.Threads(),
+            enabled = true,
+            isChecked = true,
+            onCheckedChange = {},
+        )
+        PreferenceSwitch(
+            title = "Switch",
+            subtitle = "Subtitle Switch",
+            icon = CompoundIcons.Threads(),
+            enabled = false,
+            isChecked = true,
+            onCheckedChange = {},
+        )
+        PreferenceSwitch(
+            title = "Switch no subtitle",
+            subtitle = null,
+            icon = CompoundIcons.Threads(),
+            enabled = false,
+            isChecked = true,
+            onCheckedChange = {},
+        )
+    }
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/PreferenceText.kt

@@ -17,12 +17,9 @@
 package io.element.android.libraries.designsystem.components.preferences
 
 import androidx.annotation.DrawableRes
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.defaultMinSize
-import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.progressSemantics
@@ -38,18 +35,17 @@ import io.element.android.compound.theme.ElementTheme
 import io.element.android.compound.tokens.generated.CompoundIcons
 import io.element.android.libraries.architecture.coverage.ExcludeFromCoverage
 import io.element.android.libraries.designsystem.atomic.atoms.RedIndicatorAtom
-import io.element.android.libraries.designsystem.components.preferences.components.PreferenceIcon
+import io.element.android.libraries.designsystem.components.list.ListItemContent
+import io.element.android.libraries.designsystem.components.preferences.components.preferenceIcon
 import io.element.android.libraries.designsystem.preview.ElementPreviewDark
 import io.element.android.libraries.designsystem.preview.ElementPreviewLight
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.CircularProgressIndicator
+import io.element.android.libraries.designsystem.theme.components.ListItem
 import io.element.android.libraries.designsystem.theme.components.Text
 import io.element.android.libraries.designsystem.toEnabledColor
 import io.element.android.libraries.designsystem.toSecondaryEnabledColor
 
-/**
- * Tried to use ListItem, but it cannot really match the design. Keep custom Layout for now.
- */
 @Composable
 fun PreferenceText(
     title: String,
@@ -67,76 +63,76 @@ fun PreferenceText(
     tintColor: Color? = null,
     onClick: () -> Unit = {},
 ) {
-    val minHeight = if (subtitle == null && subtitleAnnotated == null) preferenceMinHeightOnlyTitle else preferenceMinHeight
-
-    Row(
-        modifier = modifier
-            .fillMaxWidth()
-            .defaultMinSize(minHeight = minHeight)
-            .clickable { onClick() }
-            .padding(horizontal = preferencePaddingHorizontal, vertical = 4.dp),
-        verticalAlignment = Alignment.CenterVertically
-    ) {
-        PreferenceIcon(
+    ListItem(
+        modifier = modifier,
+        enabled = enabled,
+        onClick = onClick,
+        leadingContent = preferenceIcon(
             icon = icon,
             iconResourceId = iconResourceId,
             showIconBadge = showIconBadge,
             enabled = enabled,
-            isVisible = showIconAreaIfNoIcon,
-            tintColor = tintColor ?: enabled.toSecondaryEnabledColor(),
-        )
-        Column(
-            modifier = Modifier
-                .weight(1f)
-                .align(Alignment.CenterVertically)
-        ) {
+            showIconAreaIfNoIcon = showIconAreaIfNoIcon,
+            tintColor = tintColor,
+        ),
+        headlineContent = {
             Text(
                 style = ElementTheme.typography.fontBodyLgRegular,
                 text = title,
                 color = tintColor ?: enabled.toEnabledColor(),
             )
-            if (subtitle != null) {
+        },
+        supportingContent = if (subtitle != null) {
+            {
                 Text(
                     style = ElementTheme.typography.fontBodyMdRegular,
                     text = subtitle,
                     color = tintColor ?: enabled.toSecondaryEnabledColor(),
                 )
-            } else if (subtitleAnnotated != null) {
-                Text(
-                    style = ElementTheme.typography.fontBodyMdRegular,
-                    text = subtitleAnnotated,
-                    color = tintColor ?: enabled.toSecondaryEnabledColor(),
-                )
             }
+        } else {
+            subtitleAnnotated?.let {
+                {
+                    Text(
+                        style = ElementTheme.typography.fontBodyMdRegular,
+                        text = it,
+                        color = tintColor ?: enabled.toSecondaryEnabledColor(),
+                    )
+                }
+            }
+        },
+        trailingContent = if (currentValue != null || loadingCurrentValue || showEndBadge) {
+            ListItemContent.Custom {
+                Row(
+                    verticalAlignment = Alignment.CenterVertically,
+                ) {
+                    if (currentValue != null) {
+                        Text(
+                            text = currentValue,
+                            style = ElementTheme.typography.fontBodyXsMedium,
+                            color = enabled.toSecondaryEnabledColor(),
+                        )
+                    } else if (loadingCurrentValue) {
+                        CircularProgressIndicator(
+                            modifier = Modifier
+                                .progressSemantics()
+                                .size(20.dp),
+                            strokeWidth = 2.dp
+                        )
+                    }
+                    if (showEndBadge) {
+                        val endBadgeStartPadding = if (currentValue != null || loadingCurrentValue) 16.dp else 0.dp
+                        RedIndicatorAtom(
+                            modifier = Modifier
+                                .padding(start = endBadgeStartPadding)
+                        )
+                    }
+                }
+            }
+        } else {
+            null
         }
-        if (currentValue != null) {
-            Text(
-                modifier = Modifier
-                    .align(Alignment.CenterVertically)
-                    .padding(start = 16.dp, end = 8.dp),
-                text = currentValue,
-                style = ElementTheme.typography.fontBodyXsMedium,
-                color = enabled.toSecondaryEnabledColor(),
-            )
-        } else if (loadingCurrentValue) {
-            CircularProgressIndicator(
-                modifier = Modifier
-                    .progressSemantics()
-                    .padding(start = 16.dp, end = 8.dp)
-                    .size(20.dp)
-                    .align(Alignment.CenterVertically),
-                strokeWidth = 2.dp
-            )
-        }
-        if (showEndBadge) {
-            val endBadgeStartPadding = if (currentValue != null || loadingCurrentValue) 8.dp else 16.dp
-            RedIndicatorAtom(
-                modifier = Modifier
-                    .align(Alignment.CenterVertically)
-                    .padding(start = endBadgeStartPadding)
-            )
-        }
-    }
+    )
 }
 
 @Preview(group = PreviewGroup.Preferences)

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/preferences/components/PreferenceIcon.kt

@@ -19,7 +19,6 @@ package io.element.android.libraries.designsystem.components.preferences.compone
 import androidx.annotation.DrawableRes
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Spacer
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.runtime.Composable
@@ -31,13 +30,39 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import io.element.android.libraries.designsystem.atomic.atoms.RedIndicatorAtom
+import io.element.android.libraries.designsystem.components.list.ListItemContent
 import io.element.android.libraries.designsystem.preview.ElementThemedPreview
 import io.element.android.libraries.designsystem.preview.PreviewGroup
 import io.element.android.libraries.designsystem.theme.components.Icon
 import io.element.android.libraries.designsystem.toSecondaryEnabledColor
 
 @Composable
-fun PreferenceIcon(
+fun preferenceIcon(
+    icon: ImageVector? = null,
+    @DrawableRes iconResourceId: Int? = null,
+    showIconBadge: Boolean = false,
+    tintColor: Color? = null,
+    enabled: Boolean = true,
+    showIconAreaIfNoIcon: Boolean = false,
+): ListItemContent.Custom? {
+    return if (icon != null || iconResourceId != null || showIconAreaIfNoIcon) {
+        ListItemContent.Custom {
+            PreferenceIcon(
+                icon = icon,
+                iconResourceId = iconResourceId,
+                showIconBadge = showIconBadge,
+                enabled = enabled,
+                isVisible = showIconAreaIfNoIcon,
+                tintColor = tintColor,
+            )
+        }
+    } else {
+        null
+    }
+}
+
+@Composable
+private fun PreferenceIcon(
     modifier: Modifier = Modifier,
     icon: ImageVector? = null,
     @DrawableRes iconResourceId: Int? = null,
@@ -54,19 +79,17 @@ fun PreferenceIcon(
                 contentDescription = null,
                 tint = tintColor ?: enabled.toSecondaryEnabledColor(),
                 modifier = Modifier
-                    .padding(end = 16.dp)
                     .size(24.dp),
             )
             if (showIconBadge) {
                 RedIndicatorAtom(
                     modifier = Modifier
                         .align(Alignment.TopEnd)
-                        .padding(end = 16.dp)
                 )
             }
         }
     } else if (isVisible) {
-        Spacer(modifier = modifier.width(40.dp))
+        Spacer(modifier = modifier.width(24.dp))
     }
 }
 

tests/uitests/src/test/snapshots/images/ui_S_t[f.lockscreen.impl.settings_LockScreenSettingsView_null_LockScreenSettingsView-Day-1_2_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:52b7653b22920044043ad06bc396aba5c36ac1d5e94fc1dac3eb6a33b0f52489
-size 18568
+oid sha256:48e6ed3c51c339996fef7073622221050a8c8764bc177f60cf23931cca7b9054
+size 18521

tests/uitests/src/test/snapshots/images/ui_S_t[f.lockscreen.impl.settings_LockScreenSettingsView_null_LockScreenSettingsView-Day-1_2_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:4750b2915a158e04908cdf22fb057d06a89773eee6c32d27df192b06d963a646
-size 20911
+oid sha256:3fc0feef6b9c4a0496a3d7f2b8e4a0dfe18dc1ba0720f550ee1207fa8fda1324
+size 20978

tests/uitests/src/test/snapshots/images/ui_S_t[f.lockscreen.impl.settings_LockScreenSettingsView_null_LockScreenSettingsView-Day-1_2_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:51eb7ef770f1f9023f45e2a4f009d06ea8819a32f357344326340038c66c4604
-size 32043
+oid sha256:3f6e3444e39ff0954d9a1b82257754cbb2950d3054681433378d3fc6a5c69f31
+size 32042

tests/uitests/src/test/snapshots/images/ui_S_t[f.lockscreen.impl.settings_LockScreenSettingsView_null_LockScreenSettingsView-Night-1_3_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:af83673ffc35ecaa1ae63a0bbb7beca4c9f79df51b8557ba877db147c0cee7e7
-size 17120
+oid sha256:a2fa41c00949bbd5c8b6564ad172b2cca446c533ecf71c0f238fe78e7a0f190b
+size 17078

tests/uitests/src/test/snapshots/images/ui_S_t[f.lockscreen.impl.settings_LockScreenSettingsView_null_LockScreenSettingsView-Night-1_3_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0665948e9c1a5ab53a2a63c8e7e98d8d428be4fb5a07ec7d99daff4ad535dbaa
-size 19433
+oid sha256:07ad14080efa4abedf72c1c68edd96fd695533a983f964c5ee1247defb6d0419
+size 19514

tests/uitests/src/test/snapshots/images/ui_S_t[f.lockscreen.impl.settings_LockScreenSettingsView_null_LockScreenSettingsView-Night-1_3_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d484bfc2c60df38eee0e76a7f5de958b7b1b227003d3e7a9bcfcc4be575c6334
-size 28295
+oid sha256:78cf15e91facec9b09d80df595575ace80b167be17ee014115ddb461610effa0
+size 28371

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.developer_DeveloperSettingsView_null_DeveloperSettingsView-Day-4_5_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:dbc53f36a70800710b5ceb4e59c88f122756da94d0e87ceb6ca1ab6f42207ab5
-size 58482
+oid sha256:e6286e46c304567c88ff0ee10aee540f29bd677c200abc971e6e2e85505ab607
+size 53102

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.developer_DeveloperSettingsView_null_DeveloperSettingsView-Day-4_5_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:dbc53f36a70800710b5ceb4e59c88f122756da94d0e87ceb6ca1ab6f42207ab5
-size 58482
+oid sha256:e6286e46c304567c88ff0ee10aee540f29bd677c200abc971e6e2e85505ab607
+size 53102

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.developer_DeveloperSettingsView_null_DeveloperSettingsView-Day-4_5_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:bc3949ea914f43551856187e8e25e4d6399bcb134a97f1781979b715317ed8e3
-size 56938
+oid sha256:5ef22dc320d8dfaf0be897d825edf0bd0e5b3f5b653d4558a24903eaeae31d81
+size 51419

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.developer_DeveloperSettingsView_null_DeveloperSettingsView-Night-4_6_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2884157ea2d3ee9bc2ff607710044bd48fdae9b9b166601cb22b58d00f522b7f
-size 53593
+oid sha256:0b25c8a1bd45f3dbf5b053bb4205444073eb9b613564d44aa5ea40ce1b624402
+size 48550

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.developer_DeveloperSettingsView_null_DeveloperSettingsView-Night-4_6_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2884157ea2d3ee9bc2ff607710044bd48fdae9b9b166601cb22b58d00f522b7f
-size 53593
+oid sha256:0b25c8a1bd45f3dbf5b053bb4205444073eb9b613564d44aa5ea40ce1b624402
+size 48550

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.developer_DeveloperSettingsView_null_DeveloperSettingsView-Night-4_6_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b57961fc4620f2104dbdfd04c769262be0510337883fe7609b4ed6a19e33b009
-size 52058
+oid sha256:cb450cc9b1380c1b81331964ba2abf8d1830731626638f2a1748556134b70450
+size 47052

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Day-8_9_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7c60bb30db63393c46e8935d45c642b53dd6d407c92bcfd7f55bff135abe26ed
-size 45064
+oid sha256:478a19abd754e8ddc2cc9ea45a45fb93e49d54fac212e9a2ced5ea89057a0a4d
+size 45123

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Day-8_9_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ed85c6af5d6fe30c34c2d840160a88ffd93e3bd9abca4894d44c1be702de1495
-size 44988
+oid sha256:abe7fb3ae594d966c621bac14a95da1e814f94ff259af8ca9949d65cd50d533c
+size 45031

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Day-8_9_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:45e65e5da30433c49a14f5929ec0158e6bb11098d3113e1144d8b041ef165be7
-size 40254
+oid sha256:1426f4af80d5c33db1f3ced9e98c1fb12264c2fda67dfb1c52ca8dcea7b7bc03
+size 40096

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Day-8_9_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:fd69ffb1407d575296a6050a36378f4be9b98ff17000f7f3e692f6e4878362ea
-size 37534
+oid sha256:c194290fc12b65430c9cbb0caeff75b86ed0ab4f7c007e6e21115414fb9d8974
+size 43118

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Day-8_9_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:642c92c883ebb0d26d17c124ca21e52fb6a879ed34a6b9827631dfa9df9d07a8
-size 59439
+oid sha256:ebc1040f3257e17e6bbff3aadd7430da3134ed5d5a839ddd2ed3bc258a6113db
+size 59412

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Night-8_10_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d330b43bedc202a0d306bff27aa69bb242ed0284d49242c393a499e1f91c2dff
-size 42079
+oid sha256:81aa15b23da023be9d3594bff7cf1707351ea918e96b0310771ab922a0f5ae12
+size 42061

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Night-8_10_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:f2c190fa02e3841fa8c7113a2d9ea79f4cce7063ad77b03115a2e417d7cae610
-size 42031
+oid sha256:19d4618272dea80c750b4d1675e1e48e1c3023ba642061d408a73879fc87b382
+size 41996

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Night-8_10_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ce1f077a5b3db7bebde1abdec0226eaed7edd82fdd70b7f4240a0ac0b8316373
-size 36911
+oid sha256:76d9ee851d3963892ee370b273eb6bd1d9f9a2c1fba5c531e31a7c19c77c8bbb
+size 36829

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Night-8_10_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e579b56faf3a62f4fa50ff218c564e0c8052f36a4af42a187b8313cb0a8b3e54
-size 33004
+oid sha256:82eedcae419b2d77306a37fbe6ec03bad144fc8fa06c656b0660794edbfa4834
+size 38560

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications.edit_EditDefaultNotificationSettingView_null_EditDefaultNotificationSettingView-Night-8_10_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8d2b9344262412f3f546d97faaf2983601b661346ce95471bb6f2e391f051f48
-size 55594
+oid sha256:2ad89643a505f629701df021676bb9438aca8703ad514ec76ad0805620566b10
+size 55751

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications_NotificationSettingsView_null_NotificationSettingsView-Day-6_7_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0a566ec9dea61ea21c42cdbdb011f7b74a530d591642c5616038a0cdd6c20a74
-size 63452
+oid sha256:f778217548b4ec7cae730a218e4a89371bc2016616ee181d810732cdbc8fc68e
+size 57314

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications_NotificationSettingsView_null_NotificationSettingsView-Day-6_7_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:c36ca0694f603d7a3f0ca1965f1b0fe2bb6738aece2a908317a8043b2cb82bc4
-size 57380
+oid sha256:99305274c67826ec479cf4b6a59fa8f74c14b28a95134dc03b2a48c56978b3a4
+size 52197

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications_NotificationSettingsView_null_NotificationSettingsView-Day-6_7_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:dfd063ea23382a25ec6576b74674d6c2f30a7fbeb9e99d4c4a753a7909ece947
-size 57353
+oid sha256:b962fecf66081c6ec25db8e1223be414863f92c798f7b81a65a45331faeb510b
+size 52481

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications_NotificationSettingsView_null_NotificationSettingsView-Night-6_8_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b9da4314613e463f2da12ac9e7d4c52446ca64133c13980b87a5c447873dfc5b
-size 58568
+oid sha256:0afda3f3506098d2c0fbe975d734e5f435d833d44eb1bb17c4b42010da805cf4
+size 53108

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications_NotificationSettingsView_null_NotificationSettingsView-Night-6_8_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:6eed8d6163471878f5281c5fc922537a22216e666366a4d1c6c11535c09aeb11
-size 53402
+oid sha256:9db8ff8c0eb9b213bf6e1be3cda89e39f56912228515d8dc81fca12bc43375d4
+size 48582

tests/uitests/src/test/snapshots/images/ui_S_t[f.preferences.impl.notifications_NotificationSettingsView_null_NotificationSettingsView-Night-6_8_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:860cc7bbab5f72a951f7b83fad121040bd1fa1852bd44715a390b8e5db52eaeb
-size 52801
+oid sha256:4b9d896358e78ad6aa4587cc3910f264c7fe9bc3bfc29542356f60a933594ea2
+size 47822

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.api.preferences_RageshakePreferencesView_null_RageshakePreferencesView-Day-2_3_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0b3590fb2f546ca6381d8e6dccfbb007f10f6ac3744683b9c00393bf360cedc3
-size 19335
+oid sha256:1b746312185847b8be877219501ba898497e250a882c4db7fd413dca6fcf1709
+size 19420

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.api.preferences_RageshakePreferencesView_null_RageshakePreferencesView-Day-2_3_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:4965891c5d544adecfddf5898c6cc95964560a792548090c7789b5922e70482c
-size 16089
+oid sha256:4b04d5533c9f8fa85ab964a21f55589f34134c2f2cdc74c4ae26a79c7de14ba9
+size 16072

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.api.preferences_RageshakePreferencesView_null_RageshakePreferencesView-Night-2_4_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:94cd9900c26c8ba3d0af09b8cb63cd6fd07723b1fa4f441fe6bdad4342294889
-size 17584
+oid sha256:2ddffd27df9b1c36033f759f01ebd5820089ba9169957837e2df790db1e2081d
+size 17535

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.api.preferences_RageshakePreferencesView_null_RageshakePreferencesView-Night-2_4_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8ba76563985d70e50ef8a2f63ebf15accdf289ba16c32df1e5323740b8efd391
-size 14491
+oid sha256:fc9b7ee33d52b9454731da9db618c8722b48098a08050d7f240f32bc91b5dfe7
+size 14467

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Day-0_1_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:55d685416f2b96dc9cc7d39247d0488e92c6aff6ca19c2e0415e4d6a50218e67
-size 73080
+oid sha256:ca6d55e8c519383d27b26627f97dfe379239c2508002ddc37277ca149ef15bf7
+size 72606

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Day-0_1_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2aa63eb6eac2dce73358a34c411a0e63f7d079c38e39fa78fdba3fc71cbb1c6f
-size 145309
+oid sha256:b91d1ab9bca83a73490799f6c61e2f9d520921d8585345c445a819589d9441c6
+size 90315

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Day-0_1_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b867353808f7c03541585f71393e7e96f443060ba9b71fab5c1446161dd7bea1
-size 63792
+oid sha256:34cc4dce3d0503d7bad3a04dd74b83ea235f1fe6ff395078a99a9f1d486d8fa0
+size 68763

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Day-0_1_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:55d685416f2b96dc9cc7d39247d0488e92c6aff6ca19c2e0415e4d6a50218e67
-size 73080
+oid sha256:ca6d55e8c519383d27b26627f97dfe379239c2508002ddc37277ca149ef15bf7
+size 72606

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Day-0_1_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:3a29607fb201db84b55e752ada8e29eaf8be79993d849d1238ef0674c345b894
-size 55194
+oid sha256:ce286eb8e6b8958bc97b5cf500c2c80ae1d9cc74917fabf519df9d5422d98c59
+size 58443

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Night-0_2_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:fdf2ac353d192a83fd4a012468dae5f20c6034b2c9439f41b24298f4632a3948
-size 69970
+oid sha256:6e5edfc4d0c3d479f38469abca6886e1f979971e8ba2a229749360d48b609d8f
+size 69519

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Night-0_2_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e8a40c6e7fb10bd327bb7d34d9ab01009d0af130e4b578cf5fbf96509bddfb56
-size 141185
+oid sha256:c1fcb683b8d22a4a09523a157bb0ba8764860a60a2baa9baec77193283da039c
+size 86363

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Night-0_2_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:dc9b0f2182ba010048fa9b9bff2213870286d5c6ffe24e5c4356e4fb3dadb2d3
-size 58283
+oid sha256:d923afbfdec68a6f46e7126e9f29575b9face25db89c644e7bf96fdf92b7695b
+size 63733

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Night-0_2_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:fdf2ac353d192a83fd4a012468dae5f20c6034b2c9439f41b24298f4632a3948
-size 69970
+oid sha256:6e5edfc4d0c3d479f38469abca6886e1f979971e8ba2a229749360d48b609d8f
+size 69519

tests/uitests/src/test/snapshots/images/ui_S_t[f.rageshake.impl.bugreport_BugReportView_null_BugReportView-Night-0_2_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:00ff133c52f04bb3aacbf3f605e57ee5dbc46cf558dc8a0dd460299fd163a478
-size 49949
+oid sha256:6e3ce3a0a06506318813eaff194c748bc08c59a3563520a0ec59787472b39467
+size 53226

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:75764ad97caea1246ed9ddaf5650d7fb44ac04c5ecea6fb7658833d238707e00
-size 33785
+oid sha256:977ee7594b6d3636aa184189ccd0f199c7359dc011665a24e2686f10fd6d021d
+size 34192

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:cfda7bcf3c786799d379c94d38a3cc44817903231bb5f9217c4e9efe971a7d70
-size 37950
+oid sha256:7e3987b7d49a9029a437d0869c3826170878d03df4ffb382fcfdaa6c4fef506c
+size 38159

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:362eee281ce6365269f0776765037618c27f09907729da2847b4b7dcfb91fbcb
-size 33938
+oid sha256:bc17b2be6ae5f80c3f3f238a532dc48bd82da7bdb805073b2428c5149a059b0c
+size 34362

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:382ebf533756cbdd1c6a13ca9a9b98aadc5011c3fef50ac68741694305d02ba7
-size 41179
+oid sha256:ddae12e1203e9627caa9fbd5fcbbac1ec56d27bee417bba9b9d80f32bdc8157a
+size 36761

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:362eee281ce6365269f0776765037618c27f09907729da2847b4b7dcfb91fbcb
-size 33938
+oid sha256:bc17b2be6ae5f80c3f3f238a532dc48bd82da7bdb805073b2428c5149a059b0c
+size 34362

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_5,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:382ebf533756cbdd1c6a13ca9a9b98aadc5011c3fef50ac68741694305d02ba7
-size 41179
+oid sha256:ddae12e1203e9627caa9fbd5fcbbac1ec56d27bee417bba9b9d80f32bdc8157a
+size 36761

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Day-9_9_null_6,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:75764ad97caea1246ed9ddaf5650d7fb44ac04c5ecea6fb7658833d238707e00
-size 33785
+oid sha256:977ee7594b6d3636aa184189ccd0f199c7359dc011665a24e2686f10fd6d021d
+size 34192

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0ba59a09d7c47b187919e7e779bf3ff7fd7ac20bfe580a7dc26c314ce4ad8da1
-size 31547
+oid sha256:7675e19201f95709fb7c8f56281b552c2f714c47a6a3265f1261d0b779d34bcf
+size 31829

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7e5523bfd6eb4ebbeed5e62156013cbce97abf54a082cd1992cba734669ec69f
-size 35090
+oid sha256:8cb5b12cd5d1c729feaa7e1ebaa1f1e27a0a062b1a79706d2085317d683554e6
+size 35189

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8387aa58ec85c8dde5db2ec81f9f2ce8a00cbfe3fa4b06027a61a60a16d754a4
-size 30574
+oid sha256:7c3d72f30607fbfb80bfd6d4a0c4d872b7533771302724e1513ec013efffbb32
+size 30870

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b970c7f7fd9568b89bd3b2f78aeba495e68f5270cbfdf80da2bfdfc01a4eb0d2
-size 36598
+oid sha256:eabbe068095836b9ea1845526433e1bd2754aa2e65fb8dac5d240b08d37a5c25
+size 32295

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8387aa58ec85c8dde5db2ec81f9f2ce8a00cbfe3fa4b06027a61a60a16d754a4
-size 30574
+oid sha256:7c3d72f30607fbfb80bfd6d4a0c4d872b7533771302724e1513ec013efffbb32
+size 30870

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_5,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b970c7f7fd9568b89bd3b2f78aeba495e68f5270cbfdf80da2bfdfc01a4eb0d2
-size 36598
+oid sha256:eabbe068095836b9ea1845526433e1bd2754aa2e65fb8dac5d240b08d37a5c25
+size 32295

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl.notificationsettings_RoomNotificationSettingsView_null_RoomNotificationSettingsView-Night-9_10_null_6,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0ba59a09d7c47b187919e7e779bf3ff7fd7ac20bfe580a7dc26c314ce4ad8da1
-size 31547
+oid sha256:7675e19201f95709fb7c8f56281b552c2f714c47a6a3265f1261d0b779d34bcf
+size 31829

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:81c178b2e03d4266d2d2d3d9fa012d9cb08d0f3b75c5d7503a3bd13471164e38
-size 48886
+oid sha256:60f6274f2a0723519fd47316b27b74f4788333c5ef572279d5dcd5f914897ca1
+size 48877

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:01a897a37b62ee5b0bedfb3612f1ccf6c07b530189493cb4ec5e17ba0a7b5076
-size 36732
+oid sha256:e2ba6cff7f7a0dc3cc2f9be8d0c0219984e37fd0d3e48801a280b8ce13edb23e
+size 36678

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_10,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9db61045dccfc5f08d6cc70ba08a713675a2f82d262a07218a3e91be243f3b59
-size 47155
+oid sha256:ea252ee8d7f03533fbe65d1846aaab129e8e85f87caa7b5b0904e55a6018a925
+size 47161

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_11,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ccfb295c48265ddf9e9f86ae72332f00e069913cd1b386b3837cfd63212e8646
-size 46080
+oid sha256:6ca0832f527ff76378d8be5fe4d07cac305b423ca6dc9bda8272da72bc958263
+size 46082

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:bec05d2faffd43cb40c1e3719dd41bf54925e3603a051c1dfb96b2ae526051c8
-size 38750
+oid sha256:6d1428c67bf8774ed2826387c7aa0c0e8adbfba2b0ce8736a3401edad6cc05a6
+size 38751

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:5a02190ad01b641b33240fcda9b73d82cd866c5bc479e9608eccc38c4aeb551f
-size 38027
+oid sha256:d4972ce776fe4b6979c22e88a2e992dd06789d2744297048320bfc1976b7ea05
+size 38045

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:4d3e5bbfb5b25144c6f58cc488ee05f02a52aec60d92b0f874e418818fe22cc7
-size 45278
+oid sha256:8a68f464efca6a9a1a40b2d5cef4a5e6b2be4d211cf14ad40097ed8df4c04baa
+size 45273

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_5,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:11cb6d0c0a93d0243da744e6949d474daaeff6fd5ed887ef9aa0a7868f540b59
-size 43332
+oid sha256:341688ad30433d130b860a705657c1a5bba2b941a527401de5be474da1cb39c0
+size 43321

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_6,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:11cb6d0c0a93d0243da744e6949d474daaeff6fd5ed887ef9aa0a7868f540b59
-size 43332
+oid sha256:341688ad30433d130b860a705657c1a5bba2b941a527401de5be474da1cb39c0
+size 43321

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_7,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a3e95402abb88a692ce0afefefdf9d00a8d49a94753a103d153ccf245030d50c
-size 48530
+oid sha256:f6a841401a3de279adab2adf4e10114fbffecdf93709f971beb36cc901055e66
+size 48536

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_8,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:64afb6ebe3d2bceb0fc70a485669b47376d57e24aba8ba2723e529f77d7a1d3e
-size 47458
+oid sha256:6735109763fc45b59d3908ba73cc80b123694e7c95acf3eb65fb5a77265e0fcb
+size 47466

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetailsDark_null_RoomDetailsDark--1_3_null_9,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:870186a9495fbfeeffe0db91c445c204b86ad3d4004e228d42c12092a624c932
-size 47329
+oid sha256:9ba62bfcf20796dcef0fdfd80b69c7a2e35bcf4ab6441afec639d9be8804afa7
+size 47332

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:5e88aa176bb71a1351f8892c8c732a346729a7dbf205398658ea41a009e44130
-size 50425
+oid sha256:bf72d2eff1486439461120fbead50bc1d60dbaf1cda82f012a5576aa03f4acbf
+size 50357

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:afe443cf25c580453fc4e7d940dfb6e3e19187a29571ce87aaebae0e99e92c33
-size 38065
+oid sha256:f63b9407fea27da84bc294eee3f01bdcae3be514b7217a69536ed32f50722b98
+size 38081

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_10,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:504fbb8c0b82d45b08eeffa24b4b3ff5f6fe1cdb117f0e4c1871a00156dffb3e
-size 48521
+oid sha256:2a51421c1ed1a2e4d39a683293d0750a8e50827aa10025e74aa34f6e87229b3e
+size 48596

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_11,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ff240cf0af5a4bdc93ed9a58f0c20fe8e3c3a9baa8b3ef4a897be2eca6f595d8
-size 47432
+oid sha256:e673b8d4d0ebabeb7b0b4132cf5528212a2a1ebc6c313e5cec7a815b23ee4e6b
+size 47420

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:29205065f00b23986a013290b1696ebb6444bd0180c36184ee43249354ff005a
-size 40267
+oid sha256:f1f193e8279caaec597de248f51b5ed78344035065708fe0e69576e855509ccb
+size 40254

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:103fad78a2422bc78e593dd1d9ca6cf308a8b63966b8c93276d7e42373d969fc
-size 39071
+oid sha256:3b7d747070cbeba95089a3efabed7730342254805bc927b83d9ee014f7b090d1
+size 39066

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_4,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b9236daa5489af13ae1bd73a87b920fda72d5f8e4cf3bb56ecb37d386f251297
-size 46676
+oid sha256:5ba6d051e66e965616df1ec63056dfbfcab51dcbd358d66e6b35491e2a042ed8
+size 46696

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_5,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:50635e6e50f6591d1f5ec40a1a7da32bfd4b378c82d27ce44a8ad98daa17a308
-size 44626
+oid sha256:8ca45c337c0de0100c3980096fb1608b8e9a3bef442c11b9d085894e7a0a2bea
+size 44598

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_6,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:50635e6e50f6591d1f5ec40a1a7da32bfd4b378c82d27ce44a8ad98daa17a308
-size 44626
+oid sha256:8ca45c337c0de0100c3980096fb1608b8e9a3bef442c11b9d085894e7a0a2bea
+size 44598

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_7,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:13e941d64a5033329b966fcfb1830a64a86ed68142a5d492bdb6a1cc6554b4bf
-size 50136
+oid sha256:4fbffe6e2842c39a1e3a891c8035bae6b36801b577536b19073757e1fafcb370
+size 50135

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_8,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:89af70e55c2956b212e881f5e756d35569514ce6690a9f42492156af54df3405
-size 48934
+oid sha256:720c38ddbcfa47a1097461d889a1372b2732638d37cf8a0249d737e48e07164b
+size 48975

tests/uitests/src/test/snapshots/images/ui_S_t[f.roomdetails.impl_RoomDetails_null_RoomDetails--0_2_null_9,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:291881b0ca2e1a802f12bf7341a168e0a9315f3ffbb845553633880042af40f0
-size 48763
+oid sha256:5dc15aaf7e60acfa4edf098bf4ff273dee31a485ecfd0b64f98af0696cdd47f2
+size 48829

tests/uitests/src/test/snapshots/images/ui_S_t[f.securebackup.impl.root_SecureBackupRootView_null_SecureBackupRootView-Day-4_5_null_0,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a272259c4fe703c8e09d2dec7207c3c7b5447e41b3a15ea672e877c30b743ad1
-size 41395
+oid sha256:cf5ef60833b616b8e1b8199190dc81bcc7cdd61259fa8a4088446ad49b600936
+size 41544

tests/uitests/src/test/snapshots/images/ui_S_t[f.securebackup.impl.root_SecureBackupRootView_null_SecureBackupRootView-Day-4_5_null_1,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8fd0a614012ff7c8f8d6169d27b513741a97839d51b161d33e7023c8638ffd32
-size 42517
+oid sha256:9ebbc564ac1ca91c674036ccddd83eb59acb702c49aa0cc7dcbf0b5a297ab6b4
+size 42521

tests/uitests/src/test/snapshots/images/ui_S_t[f.securebackup.impl.root_SecureBackupRootView_null_SecureBackupRootView-Day-4_5_null_2,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:69bd5322c1dd66ab348edc080c3f26f05a2e7c017fefbba594b9e3930085228b
-size 42460
+oid sha256:5b646960eb068b84dde380f9babd0c803223f7ed2e0932d3b70f74685e6521d3
+size 42456

tests/uitests/src/test/snapshots/images/ui_S_t[f.securebackup.impl.root_SecureBackupRootView_null_SecureBackupRootView-Day-4_5_null_3,NEXUS_5,1.0,en].png

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:6ed533e168d921adfb02ecc9d3fc779155a4507dd122e4950c9c0e9ee5bba62d
-size 48000
+oid sha256:e059ed3e03e64135e06cf7b4009ce2c6f694d4edd776e843ad4a238fa170e58d
+size 48033