mirror of
https://github.com/bitwarden/android.git
synced 2024-11-21 17:05:44 +03:00
Add shapes to the BitwardenTheme (#4052)
This commit is contained in:
parent
cda4e47414
commit
ccb52ae6c5
18 changed files with 76 additions and 21 deletions
|
@ -58,6 +58,7 @@ fun BitwardenOverflowActionItem(
|
|||
modifier = Modifier.testTag(tag = "HeaderBarOptionsButton"),
|
||||
)
|
||||
DropdownMenu(
|
||||
shape = BitwardenTheme.shapes.menu,
|
||||
expanded = isOverflowMenuVisible,
|
||||
onDismissRequest = { isOverflowMenuVisible = false },
|
||||
offset = DpOffset(x = (-12).dp, y = 0.dp),
|
||||
|
|
|
@ -12,7 +12,6 @@ import androidx.compose.foundation.layout.height
|
|||
import androidx.compose.foundation.layout.offset
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.Card
|
||||
import androidx.compose.material3.CardDefaults
|
||||
import androidx.compose.material3.Text
|
||||
|
@ -52,7 +51,7 @@ fun BitwardenActionCard(
|
|||
) {
|
||||
Card(
|
||||
modifier = modifier,
|
||||
shape = RoundedCornerShape(12.dp),
|
||||
shape = BitwardenTheme.shapes.actionCard,
|
||||
colors = bitwardenCardColors(),
|
||||
elevation = CardDefaults.elevatedCardElevation(),
|
||||
border = BorderStroke(width = 1.dp, color = BitwardenTheme.colorScheme.stroke.border),
|
||||
|
|
|
@ -11,7 +11,6 @@ import androidx.compose.foundation.layout.height
|
|||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.Card
|
||||
import androidx.compose.material3.CardDefaults
|
||||
import androidx.compose.material3.Icon
|
||||
|
@ -41,7 +40,7 @@ fun BitwardenActionCardSmall(
|
|||
) {
|
||||
Card(
|
||||
onClick = onCardClicked,
|
||||
shape = RoundedCornerShape(size = 12.dp),
|
||||
shape = BitwardenTheme.shapes.actionCard,
|
||||
modifier = modifier,
|
||||
colors = bitwardenCardColors(),
|
||||
elevation = CardDefaults.elevatedCardElevation(),
|
||||
|
|
|
@ -2,7 +2,6 @@ package com.x8bit.bitwarden.ui.platform.components.card
|
|||
|
||||
import androidx.compose.foundation.background
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Modifier
|
||||
|
@ -30,7 +29,7 @@ fun BitwardenInfoCalloutCard(
|
|||
modifier = modifier
|
||||
.background(
|
||||
color = BitwardenTheme.colorScheme.background.tertiary,
|
||||
shape = RoundedCornerShape(size = 8.dp),
|
||||
shape = BitwardenTheme.shapes.infoCallout,
|
||||
)
|
||||
.padding(all = 16.dp),
|
||||
)
|
||||
|
|
|
@ -59,6 +59,7 @@ fun BitwardenBasicDialog(
|
|||
modifier = Modifier.testTag("AlertContentText"),
|
||||
)
|
||||
},
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
containerColor = BitwardenTheme.colorScheme.background.primary,
|
||||
iconContentColor = BitwardenTheme.colorScheme.icon.secondary,
|
||||
titleContentColor = BitwardenTheme.colorScheme.text.primary,
|
||||
|
|
|
@ -105,6 +105,7 @@ fun BitwardenDateSelectButton(
|
|||
initialSelectedDateMillis = currentZonedDateTime.orNow().toInstant().toEpochMilli(),
|
||||
)
|
||||
DatePickerDialog(
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
colors = bitwardenDatePickerColors(),
|
||||
onDismissRequest = { shouldShowDialog = false },
|
||||
confirmButton = {
|
||||
|
|
|
@ -6,7 +6,6 @@ import androidx.compose.foundation.layout.Column
|
|||
import androidx.compose.foundation.layout.fillMaxWidth
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.wrapContentHeight
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.Card
|
||||
import androidx.compose.material3.CardDefaults
|
||||
import androidx.compose.material3.Text
|
||||
|
@ -49,7 +48,7 @@ fun BitwardenLoadingDialog(
|
|||
),
|
||||
) {
|
||||
Card(
|
||||
shape = RoundedCornerShape(28.dp),
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
colors = CardDefaults.cardColors(
|
||||
containerColor = BitwardenTheme.colorScheme.background.primary,
|
||||
contentColor = BitwardenTheme.colorScheme.text.primary,
|
||||
|
|
|
@ -83,6 +83,7 @@ fun BitwardenMasterPasswordDialog(
|
|||
)
|
||||
}
|
||||
},
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
containerColor = BitwardenTheme.colorScheme.background.primary,
|
||||
iconContentColor = BitwardenTheme.colorScheme.icon.secondary,
|
||||
titleContentColor = BitwardenTheme.colorScheme.text.primary,
|
||||
|
|
|
@ -69,6 +69,7 @@ fun BitwardenPinDialog(
|
|||
autoFocus = true,
|
||||
)
|
||||
},
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
containerColor = BitwardenTheme.colorScheme.background.primary,
|
||||
iconContentColor = BitwardenTheme.colorScheme.icon.secondary,
|
||||
titleContentColor = BitwardenTheme.colorScheme.text.primary,
|
||||
|
|
|
@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.fillMaxWidth
|
|||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.requiredHeightIn
|
||||
import androidx.compose.foundation.rememberScrollState
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.foundation.verticalScroll
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
|
@ -62,7 +61,7 @@ fun BitwardenSelectionDialog(
|
|||
// This background is necessary for the dialog to not be transparent.
|
||||
.background(
|
||||
color = BitwardenTheme.colorScheme.background.primary,
|
||||
shape = RoundedCornerShape(28.dp),
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
),
|
||||
horizontalAlignment = Alignment.End,
|
||||
) {
|
||||
|
|
|
@ -85,6 +85,7 @@ fun BitwardenTextEntryDialog(
|
|||
},
|
||||
)
|
||||
},
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
containerColor = BitwardenTheme.colorScheme.background.primary,
|
||||
iconContentColor = BitwardenTheme.colorScheme.icon.secondary,
|
||||
titleContentColor = BitwardenTheme.colorScheme.text.primary,
|
||||
|
|
|
@ -9,7 +9,6 @@ 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.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.material3.ExperimentalMaterial3Api
|
||||
import androidx.compose.material3.Surface
|
||||
import androidx.compose.material3.Text
|
||||
|
@ -144,7 +143,7 @@ private fun TimePickerDialog(
|
|||
properties = DialogProperties(usePlatformDefaultWidth = false),
|
||||
) {
|
||||
Surface(
|
||||
shape = RoundedCornerShape(28.dp),
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
color = BitwardenTheme.colorScheme.background.primary,
|
||||
contentColor = BitwardenTheme.colorScheme.text.primary,
|
||||
modifier = Modifier
|
||||
|
|
|
@ -12,7 +12,6 @@ import androidx.compose.foundation.layout.padding
|
|||
import androidx.compose.foundation.layout.requiredHeightIn
|
||||
import androidx.compose.foundation.layout.requiredWidthIn
|
||||
import androidx.compose.foundation.rememberScrollState
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.foundation.verticalScroll
|
||||
import androidx.compose.material3.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
|
@ -83,7 +82,7 @@ fun BitwardenTwoButtonDialog(
|
|||
// This background is necessary for the dialog to not be transparent.
|
||||
.background(
|
||||
color = BitwardenTheme.colorScheme.background.primary,
|
||||
shape = RoundedCornerShape(28.dp),
|
||||
shape = BitwardenTheme.shapes.dialog,
|
||||
),
|
||||
horizontalAlignment = Alignment.End,
|
||||
) {
|
||||
|
|
|
@ -24,6 +24,7 @@ fun BitwardenSnackbarHost(
|
|||
) {
|
||||
Snackbar(
|
||||
snackbarData = it,
|
||||
shape = BitwardenTheme.shapes.snackbar,
|
||||
containerColor = BitwardenTheme.colorScheme.background.alert,
|
||||
contentColor = BitwardenTheme.colorScheme.text.reversed,
|
||||
actionColor = BitwardenTheme.colorScheme.background.alert,
|
||||
|
|
|
@ -24,6 +24,8 @@ import com.x8bit.bitwarden.ui.platform.theme.color.darkBitwardenColorScheme
|
|||
import com.x8bit.bitwarden.ui.platform.theme.color.dynamicBitwardenColorScheme
|
||||
import com.x8bit.bitwarden.ui.platform.theme.color.lightBitwardenColorScheme
|
||||
import com.x8bit.bitwarden.ui.platform.theme.color.toMaterialColorScheme
|
||||
import com.x8bit.bitwarden.ui.platform.theme.shape.BitwardenShapes
|
||||
import com.x8bit.bitwarden.ui.platform.theme.shape.bitwardenShapes
|
||||
import com.x8bit.bitwarden.ui.platform.theme.type.BitwardenTypography
|
||||
import com.x8bit.bitwarden.ui.platform.theme.type.bitwardenTypography
|
||||
import com.x8bit.bitwarden.ui.platform.theme.type.toMaterialTypography
|
||||
|
@ -40,6 +42,14 @@ object BitwardenTheme {
|
|||
@ReadOnlyComposable
|
||||
get() = LocalBitwardenColorScheme.current
|
||||
|
||||
/**
|
||||
* Retrieves the current [BitwardenShapes].
|
||||
*/
|
||||
val shapes: BitwardenShapes
|
||||
@Composable
|
||||
@ReadOnlyComposable
|
||||
get() = LocalBitwardenShapes.current
|
||||
|
||||
/**
|
||||
* Retrieves the current [BitwardenTypography].
|
||||
*/
|
||||
|
@ -107,6 +117,7 @@ fun BitwardenTheme(
|
|||
|
||||
CompositionLocalProvider(
|
||||
LocalBitwardenColorScheme provides bitwardenColorScheme,
|
||||
LocalBitwardenShapes provides bitwardenShapes,
|
||||
LocalBitwardenTypography provides bitwardenTypography,
|
||||
) {
|
||||
MaterialTheme(
|
||||
|
@ -119,14 +130,20 @@ fun BitwardenTheme(
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Provides access to the Bitwarden typography throughout the app.
|
||||
*/
|
||||
val LocalBitwardenTypography: ProvidableCompositionLocal<BitwardenTypography> =
|
||||
compositionLocalOf { bitwardenTypography }
|
||||
|
||||
/**
|
||||
* Provides access to the Bitwarden colors throughout the app.
|
||||
*/
|
||||
val LocalBitwardenColorScheme: ProvidableCompositionLocal<BitwardenColorScheme> =
|
||||
compositionLocalOf { lightBitwardenColorScheme }
|
||||
|
||||
/**
|
||||
* Provides access to the Bitwarden shapes throughout the app.
|
||||
*/
|
||||
val LocalBitwardenShapes: ProvidableCompositionLocal<BitwardenShapes> =
|
||||
compositionLocalOf { bitwardenShapes }
|
||||
|
||||
/**
|
||||
* Provides access to the Bitwarden typography throughout the app.
|
||||
*/
|
||||
val LocalBitwardenTypography: ProvidableCompositionLocal<BitwardenTypography> =
|
||||
compositionLocalOf { bitwardenTypography }
|
||||
|
|
|
@ -0,0 +1,20 @@
|
|||
package com.x8bit.bitwarden.ui.platform.theme.shape
|
||||
|
||||
import androidx.compose.foundation.shape.CornerBasedShape
|
||||
import androidx.compose.runtime.Immutable
|
||||
|
||||
/**
|
||||
* Defines all the shapes for the app.
|
||||
*/
|
||||
@Immutable
|
||||
data class BitwardenShapes(
|
||||
val actionCard: CornerBasedShape,
|
||||
val coachmark: CornerBasedShape,
|
||||
val content: CornerBasedShape,
|
||||
val contentBottom: CornerBasedShape,
|
||||
val contentTop: CornerBasedShape,
|
||||
val dialog: CornerBasedShape,
|
||||
val infoCallout: CornerBasedShape,
|
||||
val menu: CornerBasedShape,
|
||||
val snackbar: CornerBasedShape,
|
||||
)
|
|
@ -0,0 +1,19 @@
|
|||
package com.x8bit.bitwarden.ui.platform.theme.shape
|
||||
|
||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||
import androidx.compose.ui.unit.dp
|
||||
|
||||
/**
|
||||
* The default [BitwardenShapes] for the app.
|
||||
*/
|
||||
val bitwardenShapes: BitwardenShapes = BitwardenShapes(
|
||||
actionCard = RoundedCornerShape(size = 12.dp),
|
||||
coachmark = RoundedCornerShape(size = 8.dp),
|
||||
content = RoundedCornerShape(size = 8.dp),
|
||||
contentBottom = RoundedCornerShape(bottomStart = 8.dp, bottomEnd = 8.dp),
|
||||
contentTop = RoundedCornerShape(topStart = 8.dp, topEnd = 8.dp),
|
||||
dialog = RoundedCornerShape(size = 28.dp),
|
||||
infoCallout = RoundedCornerShape(size = 8.dp),
|
||||
menu = RoundedCornerShape(size = 4.dp),
|
||||
snackbar = RoundedCornerShape(size = 8.dp),
|
||||
)
|
|
@ -20,7 +20,6 @@ import com.x8bit.bitwarden.ui.platform.base.util.orZeroWidthSpace
|
|||
import com.x8bit.bitwarden.ui.platform.util.toFormattedPattern
|
||||
import com.x8bit.bitwarden.ui.vault.feature.item.VaultItemState
|
||||
import com.x8bit.bitwarden.ui.vault.feature.item.model.TotpCodeItemData
|
||||
import com.x8bit.bitwarden.ui.vault.feature.vault.VaultState
|
||||
import com.x8bit.bitwarden.ui.vault.model.VaultCardBrand
|
||||
import com.x8bit.bitwarden.ui.vault.model.VaultLinkedFieldType
|
||||
import com.x8bit.bitwarden.ui.vault.model.findVaultCardBrandWithNameOrNull
|
||||
|
|
Loading…
Reference in a new issue