fix: fix font weights for Android (#3165)

Co-authored-by: Daniel Szczepanik <[email protected]>
callstack · Jun 8, 2022 · 01f275b · 01f275b
1 parent 360fc55
commit 01f275b
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 4 deletions.
diff --git a/src/components/Typography/AnimatedText.tsx b/src/components/Typography/AnimatedText.tsx
@@ -5,6 +5,7 @@ import {
   I18nManager,
   StyleProp,
   StyleSheet,
+  Platform,
 } from 'react-native';
 import { withTheme } from '../../core/theming';
 import { Font, MD3TypescaleKey, Theme } from '../../types';
@@ -43,12 +44,13 @@ function AnimatedText({ style, theme, variant, ...rest }: Props) {
   if (theme.isV3 && variant) {
     const stylesByVariant = Object.keys(MD3TypescaleKey).reduce(
       (acc, key) => {
-        const { size, weight, lineHeight, tracking } =
+        const { size, weight, lineHeight, tracking, font } =
           theme.typescale[key as keyof typeof MD3TypescaleKey];
 
         return {
           ...acc,
           [key]: {
+            ...(Platform.OS === 'android' && { fontFamily: font }),
             fontSize: size,
             fontWeight: weight,
             lineHeight: lineHeight,

diff --git a/src/components/Typography/Text.tsx b/src/components/Typography/Text.tsx
@@ -5,6 +5,7 @@ import {
   StyleProp,
   StyleSheet,
   I18nManager,
+  Platform,
 } from 'react-native';
 import { useTheme } from '../../core/theming';
 import { Font, MD3TypescaleKey, ThemeProp } from '../../types';
@@ -89,12 +90,13 @@ const Text: React.ForwardRefRenderFunction<{}, Props> = (
   if (theme.isV3 && variant) {
     const stylesByVariant = Object.keys(MD3TypescaleKey).reduce(
       (acc, key) => {
-        const { size, weight, lineHeight, tracking } =
+        const { size, weight, lineHeight, tracking, font } =
           theme.typescale[key as keyof typeof MD3TypescaleKey];
 
         return {
           ...acc,
           [key]: {
+            ...(Platform.OS === 'android' && { fontFamily: font }),
             fontSize: size,
             fontWeight: weight,
             lineHeight: lineHeight,

diff --git a/src/styles/themes/v3/tokens.tsx b/src/styles/themes/v3/tokens.tsx
@@ -83,10 +83,10 @@ const ref = {
   },
 
   typeface: {
-    brandRegular: 'Roboto Regular',
+    brandRegular: 'sans-serif',
     weightRegular: '400' as Font['fontWeight'],
 
-    plainMedium: 'Roboto Medium',
+    plainMedium: 'sans-serif-medium',
     weightMedium: '500' as Font['fontWeight'],
   },