Cleanup

Author: Pururun

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/ApplyButton.kt

@@ -24,7 +24,7 @@ private fun PreviewApplyButton() {
 @Composable
 fun ApplyButton(
     modifier: Modifier = Modifier,
-    background: Color = MaterialTheme.colorScheme.background,
+    background: Color = MaterialTheme.colorScheme.tertiary,
     onClick: () -> Unit,
     isEnabled: Boolean
 ) {

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/MullvadButton.kt

@@ -70,12 +70,8 @@ fun NegativeButton(
         ButtonDefaults.buttonColors(
             containerColor = MaterialTheme.colorScheme.error,
             contentColor = MaterialTheme.colorScheme.onError,
-            disabledContentColor =
-                MaterialTheme.colorScheme.onError
-                    .copy(alpha = Alpha20),
-            disabledContainerColor =
-                MaterialTheme.colorScheme.error
-                    .copy(alpha = AlphaInactive)
+            disabledContentColor = MaterialTheme.colorScheme.onError.copy(alpha = Alpha20),
+            disabledContainerColor = MaterialTheme.colorScheme.error.copy(alpha = AlphaInactive)
         ),
     isEnabled: Boolean = true,
     icon: @Composable (() -> Unit)? = null
@@ -95,17 +91,13 @@ fun VariantButton(
     onClick: () -> Unit,
     text: String,
     modifier: Modifier = Modifier,
-    background: Color = MaterialTheme.colorScheme.background,
+    background: Color = MaterialTheme.colorScheme.tertiary,
     colors: ButtonColors =
         ButtonDefaults.buttonColors(
-            containerColor = MaterialTheme.colorScheme.tertiary,
+            containerColor = background,
             contentColor = MaterialTheme.colorScheme.onTertiary,
-            disabledContentColor =
-                MaterialTheme.colorScheme.onTertiary
-                    .copy(alpha = Alpha20),
-            disabledContainerColor =
-                MaterialTheme.colorScheme.tertiary
-                    .copy(alpha = AlphaInactive),
+            disabledContentColor = MaterialTheme.colorScheme.onTertiary.copy(alpha = Alpha20),
+            disabledContainerColor = background.copy(alpha = AlphaInactive),
         ),
     isEnabled: Boolean = true,
     icon: @Composable (() -> Unit)? = null
@@ -174,9 +166,7 @@ private fun BaseButton(
             } else {
                 ButtonDefaults.ContentPadding
             },
-        modifier = modifier
-            .wrapContentHeight()
-            .fillMaxWidth(),
+        modifier = modifier.wrapContentHeight().fillMaxWidth(),
         shape = MaterialTheme.shapes.small
     ) {
         // Used to center the text
@@ -187,9 +177,7 @@ private fun BaseButton(
                 // Used to center the text
                 Box(
                     modifier =
-                    Modifier
-                        .padding(horizontal = Dimens.smallPadding)
-                        .alpha(AlphaInvisible)
+                        Modifier.padding(horizontal = Dimens.smallPadding).alpha(AlphaInvisible)
                 ) {
                     trailingIcon()
                 }
@@ -211,9 +199,7 @@ private fun BaseButton(
                 // Used to center the text
                 Box(
                     modifier =
-                    Modifier
-                        .padding(horizontal = Dimens.smallPadding)
-                        .alpha(AlphaInvisible)
+                        Modifier.padding(horizontal = Dimens.smallPadding).alpha(AlphaInvisible)
                 ) {
                     leadingIcon()
                 }

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/button/RedeemVoucherButton.kt

@@ -1,9 +1,7 @@
 package net.mullvad.mullvadvpn.compose.button
 
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import net.mullvad.mullvadvpn.R
@@ -22,14 +20,8 @@ private fun PreviewRedeemVoucherButton() {
 }
 
 @Composable
-fun RedeemVoucherButton(
-    modifier: Modifier = Modifier,
-    background: Color = MaterialTheme.colorScheme.background,
-    onClick: () -> Unit,
-    isEnabled: Boolean
-) {
+fun RedeemVoucherButton(modifier: Modifier = Modifier, onClick: () -> Unit, isEnabled: Boolean) {
     VariantButton(
-        background = background,
         text = stringResource(id = R.string.redeem_voucher),
         onClick = onClick,
         modifier = modifier,

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/CheckboxCell.kt

@@ -32,7 +32,7 @@ internal fun CheckboxCell(
     title: String,
     checked: Boolean,
     onCheckedChange: (Boolean) -> Unit,
-    background: Color = MaterialTheme.colorScheme.primaryContainer,
+    background: Color = MaterialTheme.colorScheme.surfaceContainerLow,
     startPadding: Dp = Dimens.mediumPadding,
     endPadding: Dp = Dimens.cellEndPadding,
     minHeight: Dp = Dimens.cellHeight

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/DnsCell.kt

@@ -13,6 +13,7 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import net.mullvad.mullvadvpn.R
 import net.mullvad.mullvadvpn.lib.theme.AppTheme
+import net.mullvad.mullvadvpn.lib.theme.color.warning
 
 @Preview
 @Composable
@@ -39,12 +40,12 @@ fun DnsCell(
                 Icon(
                     painter = painterResource(id = R.drawable.icon_alert),
                     contentDescription = stringResource(id = R.string.confirm_local_dns),
-                    tint = MaterialTheme.colorScheme.scrim
+                    tint = MaterialTheme.colorScheme.warning
                 )
             }
         },
         onCellClicked = { onClick.invoke() },
-        background = MaterialTheme.colorScheme.primaryContainer,
+        background = MaterialTheme.colorScheme.surfaceContainerLow,
         startPadding = startPadding,
         modifier = modifier
     )

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SplitTunnelingCell.kt

@@ -20,7 +20,6 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.ImageBitmap
 import androidx.compose.ui.graphics.asImageBitmap
-import androidx.compose.ui.graphics.compositeOver
 import androidx.compose.ui.graphics.painter.BitmapPainter
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
@@ -32,7 +31,6 @@ import net.mullvad.mullvadvpn.compose.component.SpacedColumn
 import net.mullvad.mullvadvpn.compose.util.isBelowMaxBitmapSize
 import net.mullvad.mullvadvpn.lib.theme.AppTheme
 import net.mullvad.mullvadvpn.lib.theme.Dimens
-import net.mullvad.mullvadvpn.lib.theme.color.Alpha40
 import net.mullvad.mullvadvpn.lib.theme.typeface.listItemText
 
 @Preview
@@ -66,10 +64,7 @@ fun SplitTunnelingCell(
     isSelected: Boolean,
     enabled: Boolean,
     modifier: Modifier = Modifier,
-    backgroundColor: Color =
-        MaterialTheme.colorScheme.primary
-            .copy(alpha = Alpha40)
-            .compositeOver(MaterialTheme.colorScheme.background),
+    backgroundColor: Color = MaterialTheme.colorScheme.surfaceContainerHigh,
     onResolveIcon: (String) -> Bitmap? = { null },
     onCellClicked: () -> Unit = {}
 ) {
@@ -93,7 +88,7 @@ fun SplitTunnelingCell(
                     Modifier.align(Alignment.CenterVertically).size(size = Dimens.listIconSize),
                 colorFilter =
                     if (icon == null) {
-                        ColorFilter.tint(MaterialTheme.colorScheme.onPrimaryContainer)
+                        ColorFilter.tint(MaterialTheme.colorScheme.onSurface)
                     } else {
                         null
                     }
@@ -103,7 +98,7 @@ fun SplitTunnelingCell(
             Text(
                 text = title,
                 style = MaterialTheme.typography.listItemText,
-                color = MaterialTheme.colorScheme.onPrimaryContainer,
+                color = MaterialTheme.colorScheme.onSurface,
                 modifier =
                     Modifier.weight(1f)
                         .padding(horizontal = Dimens.mediumPadding)
@@ -122,10 +117,7 @@ fun SplitTunnelingCell(
                             }
                     ),
                 contentDescription = null,
-                tint =
-                    MaterialTheme.colorScheme.onBackground
-                        .copy(alpha = Alpha40)
-                        .compositeOver(backgroundColor),
+                tint = MaterialTheme.colorScheme.onSurface,
                 modifier = Modifier.size(size = Dimens.addIconSize)
             )
         },

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/cell/SwitchComposeCell.kt

@@ -60,8 +60,8 @@ fun NormalSwitchComposeCell(
     isToggled: Boolean,
     startPadding: Dp = Dimens.indentedCellStartPadding,
     isEnabled: Boolean = true,
-    background: Color = MaterialTheme.colorScheme.primaryContainer,
-    onBackground: Color = MaterialTheme.colorScheme.onPrimaryContainer,
+    background: Color = MaterialTheme.colorScheme.surfaceContainerLow,
+    onBackground: Color = MaterialTheme.colorScheme.onSurface,
     onCellClicked: (Boolean) -> Unit = {},
     onInfoClicked: (() -> Unit)? = null
 ) {
@@ -92,7 +92,7 @@ fun HeaderSwitchComposeCell(
     startPadding: Dp = Dimens.cellStartPadding,
     isEnabled: Boolean = true,
     background: Color = MaterialTheme.colorScheme.primary,
-    onBackground: Color = MaterialTheme.colorScheme.onSurface,
+    onBackground: Color = MaterialTheme.colorScheme.onPrimary,
     onCellClicked: (Boolean) -> Unit = {},
     onInfoClicked: (() -> Unit)? = null,
 ) {

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/FilterChip.kt

@@ -1,9 +1,6 @@
 package net.mullvad.mullvadvpn.compose.component
 
-import androidx.compose.foundation.clickable
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
-import androidx.compose.material3.FilterChip
 import androidx.compose.material3.FilterChipDefaults
 import androidx.compose.material3.Icon
 import androidx.compose.material3.InputChip

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scaffolding.kt

@@ -1,6 +1,5 @@
 package net.mullvad.mullvadvpn.compose.component
 
-import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.RowScope
@@ -213,7 +212,7 @@ fun ScaffoldWithLargeTopBarAndButton(
     actions: @Composable RowScope.() -> Unit = {},
     onButtonClick: () -> Unit = {}, // Add button
     buttonTitle: String,
-    scrollbarColor: Color = MaterialTheme.colorScheme.onBackground.copy(alpha = AlphaScrollbar),
+    scrollbarColor: Color = MaterialTheme.colorScheme.onSurface.copy(alpha = AlphaScrollbar),
     content: @Composable (modifier: Modifier) -> Unit
 ) {
     val appBarState = rememberTopAppBarState()

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/Scrollbar.kt

@@ -68,6 +68,8 @@ import kotlinx.coroutines.channels.BufferOverflow
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.flow.MutableSharedFlow
 import kotlinx.coroutines.flow.collectLatest
+import net.mullvad.mullvadvpn.lib.theme.AppTheme
+import net.mullvad.mullvadvpn.lib.theme.color.AlphaScrollbar
 
 fun Modifier.drawHorizontalScrollbar(
     state: ScrollState,
@@ -297,17 +299,19 @@ private val FadeOutAnimationSpec =
 @Preview(widthDp = 400, heightDp = 400, showBackground = true)
 @Composable
 private fun PreviewScrollbar() {
-    val state = rememberScrollState()
-    Column(
-        modifier =
-            Modifier.drawVerticalScrollbar(
-                    state = state,
-                    color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.6f)
-                )
-                .verticalScroll(state),
-    ) {
-        repeat(50) {
-            Text(text = "Item ${it + 1}", modifier = Modifier.fillMaxWidth().padding(16.dp))
+    AppTheme {
+        val state = rememberScrollState()
+        Column(
+            modifier =
+                Modifier.drawVerticalScrollbar(
+                        state = state,
+                        color = MaterialTheme.colorScheme.onSurface.copy(alpha = AlphaScrollbar)
+                    )
+                    .verticalScroll(state),
+        ) {
+            repeat(50) {
+                Text(text = "Item ${it + 1}", modifier = Modifier.fillMaxWidth().padding(16.dp))
+            }
         }
     }
 }
@@ -320,7 +324,7 @@ private fun PreviewLazyListScrollbar() {
         modifier =
             Modifier.drawVerticalScrollbar(
                 state = state,
-                color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.6f)
+                color = MaterialTheme.colorScheme.onSurface.copy(alpha = AlphaScrollbar)
             ),
         state = state
     ) {
@@ -338,7 +342,7 @@ private fun PreviewHorizontalScrollbar() {
         modifier =
             Modifier.drawHorizontalScrollbar(
                     state = state,
-                    color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.6f)
+                    color = MaterialTheme.colorScheme.onSurface.copy(alpha = AlphaScrollbar)
                 )
                 .horizontalScroll(state)
     ) {
@@ -359,7 +363,7 @@ private fun PreviewLazyListHorizontalScrollbar() {
         modifier =
             Modifier.drawHorizontalScrollbar(
                 state = state,
-                color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.6f)
+                color = MaterialTheme.colorScheme.onSurface.copy(alpha = AlphaScrollbar)
             ),
         state = state
     ) {

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/component/TopBar.kt

@@ -52,8 +52,8 @@ import net.mullvad.mullvadvpn.lib.theme.Dimens
 private fun PreviewTopBar() {
     AppTheme {
         MullvadTopBar(
-            containerColor = MaterialTheme.colorScheme.inversePrimary,
-            iconTintColor = MaterialTheme.colorScheme.onPrimary,
+            containerColor = MaterialTheme.colorScheme.tertiary,
+            iconTintColor = MaterialTheme.colorScheme.onTertiary,
             onSettingsClicked = null,
             onAccountClicked = {}
         )
@@ -65,8 +65,8 @@ private fun PreviewTopBar() {
 private fun PreviewSlimTopBar() {
     AppTheme {
         MullvadTopBar(
-            containerColor = MaterialTheme.colorScheme.inversePrimary,
-            iconTintColor = MaterialTheme.colorScheme.onPrimary,
+            containerColor = MaterialTheme.colorScheme.tertiary,
+            iconTintColor = MaterialTheme.colorScheme.onTertiary,
             onSettingsClicked = null,
             onAccountClicked = {}
         )
@@ -78,8 +78,8 @@ private fun PreviewSlimTopBar() {
 private fun PreviewNoIconAndLogoTopBar() {
     AppTheme {
         MullvadTopBar(
-            containerColor = MaterialTheme.colorScheme.inversePrimary,
-            iconTintColor = MaterialTheme.colorScheme.onPrimary,
+            containerColor = MaterialTheme.colorScheme.tertiary,
+            iconTintColor = MaterialTheme.colorScheme.onTertiary,
             isIconAndLogoVisible = false,
             onSettingsClicked = {},
             onAccountClicked = null,
@@ -92,8 +92,8 @@ private fun PreviewNoIconAndLogoTopBar() {
 private fun PreviewNothingTopBar() {
     AppTheme {
         MullvadTopBar(
-            containerColor = MaterialTheme.colorScheme.inversePrimary,
-            iconTintColor = MaterialTheme.colorScheme.onPrimary,
+            containerColor = MaterialTheme.colorScheme.tertiary,
+            iconTintColor = MaterialTheme.colorScheme.onTertiary,
             isIconAndLogoVisible = false,
             onSettingsClicked = null,
             onAccountClicked = null
@@ -199,9 +199,9 @@ fun MullvadSmallTopBar(
         navigationIcon = navigationIcon,
         colors =
             TopAppBarDefaults.topAppBarColors(
-                containerColor = MaterialTheme.colorScheme.background,
-                scrolledContainerColor = MaterialTheme.colorScheme.background,
-                actionIconContentColor = MaterialTheme.colorScheme.onPrimary,
+                containerColor = MaterialTheme.colorScheme.surface,
+                scrolledContainerColor = MaterialTheme.colorScheme.surface,
+                actionIconContentColor = MaterialTheme.colorScheme.onSurface,
             ),
         actions = actions
     )
@@ -258,9 +258,9 @@ fun MullvadMediumTopBar(
         scrollBehavior = scrollBehavior,
         colors =
             TopAppBarDefaults.mediumTopAppBarColors(
-                containerColor = MaterialTheme.colorScheme.background,
-                scrolledContainerColor = MaterialTheme.colorScheme.background,
-                actionIconContentColor = MaterialTheme.colorScheme.onPrimary,
+                containerColor = MaterialTheme.colorScheme.surface,
+                scrolledContainerColor = MaterialTheme.colorScheme.surface,
+                actionIconContentColor = MaterialTheme.colorScheme.onSurface,
             ),
         actions = actions
     )
@@ -280,9 +280,9 @@ fun MullvadLargeTopBar(
         scrollBehavior = scrollBehavior,
         colors =
             TopAppBarDefaults.mediumTopAppBarColors(
-                containerColor = MaterialTheme.colorScheme.background,
-                scrolledContainerColor = MaterialTheme.colorScheme.background,
-                actionIconContentColor = MaterialTheme.colorScheme.onPrimary,
+                containerColor = MaterialTheme.colorScheme.surface,
+                scrolledContainerColor = MaterialTheme.colorScheme.surface,
+                actionIconContentColor = MaterialTheme.colorScheme.onSurface,
             ),
         actions = actions
     )

android/app/src/main/kotlin/net/mullvad/mullvadvpn/compose/dialog/ChangelogDialog.kt

@@ -75,7 +75,7 @@ fun ChangelogDialog(changeLog: Changelog, onDismiss: () -> Unit) {
             PrimaryButton(text = stringResource(R.string.got_it), onClick = onDismiss)
         },
         containerColor = MaterialTheme.colorScheme.surface,
-        titleContentColor = MaterialTheme.colorScheme.onBackground
+        titleContentColor = MaterialTheme.colorScheme.onSurface
     )
 }