[PM-34837] feat: Update app font to Inter (#7564)

app/src/main/kotlin/com/x8bit/bitwarden/ui/vault/feature/exportitems/component/AccountSummaryListItem.kt

@@ -17,12 +17,9 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.Font
-import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
-import com.bitwarden.ui.R
 import com.bitwarden.ui.platform.base.util.cardStyle
 import com.bitwarden.ui.platform.base.util.hexToColor
 import com.bitwarden.ui.platform.base.util.toSafeOverlayColor
@@ -32,6 +29,7 @@ import com.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.bitwarden.ui.platform.resource.BitwardenDrawable
 import com.bitwarden.ui.platform.resource.BitwardenString
 import com.bitwarden.ui.platform.theme.BitwardenTheme
+import com.bitwarden.ui.platform.theme.type.bitwardenFontFamily
 import com.x8bit.bitwarden.ui.vault.feature.exportitems.model.AccountSelectionListItem
 
 /**
@@ -84,8 +82,8 @@ fun AccountSummaryListItem(
                 style = TextStyle(
                     fontSize = 11.dp.toUnscaledTextUnit(),
                     lineHeight = 13.dp.toUnscaledTextUnit(),
-                    fontFamily = FontFamily(Font(R.font.dm_sans_bold)),
-                    fontWeight = FontWeight.W600,
+                    fontFamily = bitwardenFontFamily,
+                    fontWeight = FontWeight.SemiBold,
                 ),
                 color = item.avatarColorHex.hexToColor().toSafeOverlayColor(),
             )

ui/src/main/kotlin/com/bitwarden/ui/platform/components/account/BitwardenAccountActionItem.kt

@@ -11,12 +11,9 @@ import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.testTag
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
-import androidx.compose.ui.text.font.Font
-import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.bitwarden.ui.R
 import com.bitwarden.ui.platform.base.util.interactiveBorder
 import com.bitwarden.ui.platform.base.util.toSafeOverlayColor
 import com.bitwarden.ui.platform.base.util.toUnscaledTextUnit
@@ -25,6 +22,7 @@ import com.bitwarden.ui.platform.components.util.rememberVectorPainter
 import com.bitwarden.ui.platform.resource.BitwardenDrawable
 import com.bitwarden.ui.platform.resource.BitwardenString
 import com.bitwarden.ui.platform.theme.BitwardenTheme
+import com.bitwarden.ui.platform.theme.type.bitwardenFontFamily
 
 /**
  * Displays an icon representing a Bitwarden account with the user's initials superimposed.
@@ -68,8 +66,8 @@ fun BitwardenAccountActionItem(
             style = TextStyle(
                 fontSize = 11.dp.toUnscaledTextUnit(),
                 lineHeight = 13.dp.toUnscaledTextUnit(),
-                fontFamily = FontFamily(Font(R.font.dm_sans_bold)),
-                fontWeight = FontWeight.W600,
+                fontFamily = bitwardenFontFamily,
+                fontWeight = FontWeight.SemiBold,
             ),
             color = color.toSafeOverlayColor(),
         )

ui/src/main/kotlin/com/bitwarden/ui/platform/theme/type/Typography.kt

@@ -13,6 +13,7 @@ import androidx.compose.ui.text.PlatformTextStyle
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.Font
 import androidx.compose.ui.text.font.FontFamily
+import androidx.compose.ui.text.font.FontVariation
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.LineHeightStyle
 import androidx.compose.ui.tooling.preview.Preview
@@ -21,6 +22,18 @@ import androidx.compose.ui.unit.sp
 import com.bitwarden.ui.R
 import com.bitwarden.ui.platform.theme.BitwardenTheme
 
+/**
+ * The app's primary font family, backed by the Inter variable font. Each weight used by the app
+ * is declared so that the matching [FontWeight] renders the real weight from the font's weight
+ * axis instead of a synthesized one.
+ */
+val bitwardenFontFamily: FontFamily = FontFamily(
+    interVariableFont(weight = FontWeight.Normal),
+    interVariableFont(weight = FontWeight.Medium),
+    interVariableFont(weight = FontWeight.SemiBold),
+    interVariableFont(weight = FontWeight.Bold),
+)
+
 /**
  * The default [BitwardenTypography] for the app.
  */
@@ -28,8 +41,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     displayLarge = TextStyle(
         fontSize = 56.sp,
         lineHeight = 64.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -40,8 +53,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     displayMedium = TextStyle(
         fontSize = 44.sp,
         lineHeight = 52.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -52,8 +65,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     displaySmall = TextStyle(
         fontSize = 36.sp,
         lineHeight = 44.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -64,8 +77,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     headlineLarge = TextStyle(
         fontSize = 32.sp,
         lineHeight = 40.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -76,8 +89,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     headlineMedium = TextStyle(
         fontSize = 28.sp,
         lineHeight = 36.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -88,8 +101,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     headlineSmall = TextStyle(
         fontSize = 18.sp,
         lineHeight = 22.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -100,8 +113,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     titleExtraLarge = TextStyle(
         fontSize = 24.sp,
         lineHeight = 28.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -112,8 +125,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     titleLarge = TextStyle(
         fontSize = 19.sp,
         lineHeight = 28.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -124,8 +137,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     titleMedium = TextStyle(
         fontSize = 16.sp,
         lineHeight = 20.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -136,8 +149,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     titleSmall = TextStyle(
         fontSize = 14.sp,
         lineHeight = 18.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_medium)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -148,8 +161,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     bodyLarge = TextStyle(
         fontSize = 15.sp,
         lineHeight = 20.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W400,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -160,8 +173,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     bodyLargeEmphasis = TextStyle(
         fontSize = 15.sp,
         lineHeight = 20.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W700,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Bold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -172,8 +185,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     bodyMedium = TextStyle(
         fontSize = 13.sp,
         lineHeight = 18.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W400,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -184,8 +197,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     bodyMediumEmphasis = TextStyle(
         fontSize = 13.sp,
         lineHeight = 18.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W700,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Bold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -196,8 +209,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     bodySmall = TextStyle(
         fontSize = 12.sp,
         lineHeight = 16.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W400,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -208,8 +221,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     labelLarge = TextStyle(
         fontSize = 14.sp,
         lineHeight = 20.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -220,8 +233,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     labelLargeEmphasis = TextStyle(
         fontSize = 14.sp,
         lineHeight = 20.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W700,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Bold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -232,8 +245,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     labelLargeRegular = TextStyle(
         fontSize = 14.sp,
         lineHeight = 20.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W400,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -244,8 +257,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     labelMedium = TextStyle(
         fontSize = 12.sp,
         lineHeight = 16.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_semi_bold)),
-        fontWeight = FontWeight.W600,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.SemiBold,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -256,8 +269,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     labelSmall = TextStyle(
         fontSize = 12.sp,
         lineHeight = 16.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_regular)),
-        fontWeight = FontWeight.W400,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -269,7 +282,7 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
         fontSize = 14.sp,
         lineHeight = 20.sp,
         fontFamily = FontFamily(Font(R.font.roboto_regular_mono)),
-        fontWeight = FontWeight.W400,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.5.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -281,7 +294,7 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
         fontSize = 16.sp,
         lineHeight = 24.sp,
         fontFamily = FontFamily(Font(R.font.roboto_regular_mono)),
-        fontWeight = FontWeight.W400,
+        fontWeight = FontWeight.Normal,
         letterSpacing = 0.5.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -292,8 +305,8 @@ val bitwardenTypography: BitwardenTypography = BitwardenTypography(
     eyebrowMedium = TextStyle(
         fontSize = 12.sp,
         lineHeight = 18.sp,
-        fontFamily = FontFamily(Font(R.font.dm_sans_bold)),
-        fontWeight = FontWeight.W700,
+        fontFamily = bitwardenFontFamily,
+        fontWeight = FontWeight.Bold,
         letterSpacing = 0.6.sp,
         lineHeightStyle = LineHeightStyle(
             alignment = LineHeightStyle.Alignment.Center,
@@ -360,3 +373,10 @@ private fun BitwardenTypography_preview() {
         }
     }
 }
+
+private fun interVariableFont(weight: FontWeight): Font =
+    Font(
+        resId = R.font.inter_variable,
+        weight = weight,
+        variationSettings = FontVariation.Settings(FontVariation.weight(weight.weight)),
+    )