@quintype/native-components 2.20.3 → 2.20.4

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [2.20.4](https://github.com/quintype/native-components/compare/v2.20.3...v2.20.4) (2023-02-01)
+
+
+### Bug Fixes
+
+* **fonts:** Fixes font for Related-Stories and Also-Read on Android :hammer: ([#197](https://github.com/quintype/native-components/issues/197)) ([952c95b](https://github.com/quintype/native-components/commit/952c95b43b76f55eeb25cf9e071a88a3d939ce60))
+
 ### [2.20.3](https://github.com/quintype/native-components/compare/v2.20.2...v2.20.3) (2023-02-01)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quintype/native-components",
-  "version": "2.20.3",
+  "version": "2.20.4",
   "description": "",
   "main": "src/index.js",
   "scripts": {

package/src/components/AlsoRead/index.js

@@ -25,8 +25,8 @@ export const AlsoRead = (props) => {
   const linkedImage = get(linkedStories, [linkedStoryId, 'hero-image-s3-key']);
 
   const { theme } = useContext(AppTheme);
-  const { COLORS, FONT_SIZE, DARK_MODE, CustomFallBackIcon ,translate} = theme;
-  const styles = alsoReadStyles(COLORS, FONT_SIZE, DARK_MODE);
+  const { CustomFallBackIcon, translate } = theme;
+  const styles = alsoReadStyles(theme);
 
   const fallBackIcon = CustomFallBackIcon ? <CustomFallBackIcon /> : <FallbackIcon />;
 

package/src/components/AlsoRead/styles.js

@@ -1,30 +1,33 @@
-import { StyleSheet } from 'react-native';
+import { StyleSheet } from "react-native";
 
-export const alsoReadStyles = (COLORS, FONT_SIZE, DARK_MODE) => StyleSheet.create({
-  wrapper: {
-    padding: 10,
-  },
-  container: {
-    flexDirection: 'row',
-  },
-  alsoReadContentWrapper: {
-    paddingLeft: 12,
-    flex: 1,
-  },
-  alsoReadText: {
-    fontSize: FONT_SIZE.h2,
-    fontWeight: 'bold',
-    color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_1,
-  },
-  alsoReadTitle: {
-    fontSize: FONT_SIZE.h2,
-    color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_1,
-  },
-  fallBackImageWrapper: {
-    backgroundColor: COLORS.BRAND_WHITE,
-    width: 150,
-    height: 84,
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-});
+export const alsoReadStyles = (appThemeContext) => {
+  const { COLORS, FONT_SIZE, FONT_FAMILY, DARK_MODE } = appThemeContext;
+  return StyleSheet.create({
+    wrapper: {
+      padding: 10,
+    },
+    container: {
+      flexDirection: "row",
+    },
+    alsoReadContentWrapper: {
+      paddingLeft: 12,
+      flex: 1,
+    },
+    alsoReadText: {
+      fontSize: FONT_SIZE.h2,
+      fontFamily: FONT_FAMILY.secondaryBold,
+      color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_1,
+    },
+    alsoReadTitle: {
+      fontSize: FONT_SIZE.h2,
+      color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_1,
+    },
+    fallBackImageWrapper: {
+      backgroundColor: COLORS.BRAND_WHITE,
+      width: 150,
+      height: 84,
+      alignItems: "center",
+      justifyContent: "center",
+    },
+  });
+};

package/src/components/RelatedStoriesCard/styles.js

@@ -1,11 +1,11 @@
 import { StyleSheet,I18nManager } from 'react-native';
 
 export const relatedStoriesStyles = (appThemeContext) => {
-  const { COLORS, FONT_SIZE } = appThemeContext;
+  const { COLORS, FONT_SIZE, FONT_FAMILY } = appThemeContext;
   return StyleSheet.create({
     titleStyle: {
       fontSize: FONT_SIZE.title,
-      fontWeight: 'bold',
+      fontFamily: FONT_FAMILY.secondaryBold,
       color: COLORS.BRAND_BLACK,
       writingDirection: I18nManager.isRTL ? 'rtl' : 'ltr',
       paddingHorizontal:5,