diff --git a/src/app/(tabs)/author/index.tsx b/src/app/(tabs)/author/index.tsx index c2ca72eb..12c5bc73 100644 --- a/src/app/(tabs)/author/index.tsx +++ b/src/app/(tabs)/author/index.tsx @@ -75,12 +75,14 @@ function AuthorScreen() { {authorInfo.name} {authorInfo?.pronouns && ( - {authorInfo.pronouns} + + {authorInfo.pronouns} + )} )} @@ -90,17 +92,19 @@ function AuthorScreen() { {authorInfo?.bio && ( <> - {decode(authorInfo.bio)} + {decode(authorInfo.bio)} )} {authorInfo?.artist_statement && ( <> - + Artist's Statement - + {decode(authorInfo.artist_statement)} diff --git a/src/app/(tabs)/author/styles.tsx b/src/app/(tabs)/author/styles.tsx index d85a4dd7..213b9e7b 100644 --- a/src/app/(tabs)/author/styles.tsx +++ b/src/app/(tabs)/author/styles.tsx @@ -10,28 +10,12 @@ const styles = StyleSheet.create({ justifyContent: 'flex-start', alignItems: 'flex-end', }, - name: { - fontWeight: 'bold', - fontSize: 24, - fontFamily: 'Manrope-Regular', - }, image: { height: 68, width: 68, backgroundColor: colors.darkGrey, borderRadius: 4, }, - bioText: { - color: 'black', - fontFamily: 'Manrope-Regular', - fontSize: 14, - }, - authorStatement: { - fontSize: 14, - color: 'black', - fontWeight: '400', - fontFamily: 'Manrope-Regular', - }, authorTextContainer: { paddingLeft: 20, }, @@ -40,9 +24,6 @@ const styles = StyleSheet.create({ borderTopWidth: 20, }, authorStatementTitle: { - fontWeight: 'bold', - fontFamily: 'Manrope-Regular', - fontSize: 16, marginBottom: 8, }, storyCountText: { @@ -50,7 +31,7 @@ const styles = StyleSheet.create({ marginBottom: 8, }, pronouns: { - color: '#797979', + color: colors.textGrey, }, }); diff --git a/src/app/(tabs)/story/index.tsx b/src/app/(tabs)/story/index.tsx index a678a60b..7cedefb1 100644 --- a/src/app/(tabs)/story/index.tsx +++ b/src/app/(tabs)/story/index.tsx @@ -18,6 +18,8 @@ import { SafeAreaView } from 'react-native-safe-area-context'; import styles from './styles'; import { fetchStory } from '../../../queries/stories'; import { Story } from '../../../queries/types'; +import colors from '../../../styles/colors'; +import globalStyles, { fonts } from '../../../styles/globalStyles'; function StoryScreen() { const [isLoading, setLoading] = useState(true); @@ -72,7 +74,9 @@ function StoryScreen() { ref={scrollRef} showsVerticalScrollIndicator={false} > - {story?.title} + + {story?.title} + { router.push({ @@ -86,7 +90,9 @@ function StoryScreen() { style={styles.authorImage} source={{ uri: story.author_image ? story.author_image : '' }} /> - By {story.author_name} + + By {story.author_name} + @@ -97,50 +103,63 @@ function StoryScreen() { data={story.genre_medium} renderItem={({ item }) => ( - {item} + + {item} + )} /> - Author's Process + + Author's Process + @@ -148,7 +167,9 @@ function StoryScreen() { style={styles.authorImage} source={{ uri: story.author_image }} /> - By {story.author_name} + + By {story.author_name} + )} diff --git a/src/app/(tabs)/story/styles.ts b/src/app/(tabs)/story/styles.ts index 302b6712..7e6e2c8c 100644 --- a/src/app/(tabs)/story/styles.ts +++ b/src/app/(tabs)/story/styles.ts @@ -1,4 +1,5 @@ import { StyleSheet } from 'react-native'; +import colors from '../../../styles/colors'; const styles = StyleSheet.create({ container: { @@ -17,11 +18,6 @@ const styles = StyleSheet.create({ borderRadius: 100 / 2, }, title: { - fontFamily: 'Manrope-Regular', - fontSize: 24, - fontWeight: '400', - textAlign: 'left', - color: 'black', marginBottom: 16, }, author: { @@ -30,13 +26,6 @@ const styles = StyleSheet.create({ gap: 10, marginBottom: 16, }, - authorText: { - fontFamily: 'Manrope-Regular', - fontSize: 12, - fontWeight: '400', - textAlign: 'left', - color: 'black', - }, genres: { display: 'flex', flexDirection: 'row', @@ -54,61 +43,24 @@ const styles = StyleSheet.create({ marginRight: 8, }, genresText: { - fontFamily: 'Manrope-Regular', - fontSize: 12, - fontWeight: '400', - color: 'black', backgroundColor: '#D9D9D9', }, shareButtonText: { - fontFamily: 'Manrope-Regular', - fontSize: 12, - fontWeight: '400', - textAlign: 'left', - color: 'black', - textDecorationLine: 'underline', - backgroundColor: '#D9D9D9', + color: colors.white, }, excerpt: { - fontFamily: 'Manrope-Regular', - fontSize: 16, - fontWeight: '400', textAlign: 'left', - color: 'black', - paddingTop: 16, - paddingBottom: 16, + paddingVertical: 16, }, story: { - fontFamily: 'Manrope-Regular', - fontSize: 12, - fontWeight: '400', - textAlign: 'left', - color: 'black', marginBottom: 16, }, authorProcess: { - fontFamily: 'Manrope-Regular', - fontSize: 16, - fontWeight: '600', - textAlign: 'left', - color: 'black', marginBottom: 16, }, process: { - fontFamily: 'Manrope-Regular', - fontSize: 12, - fontWeight: '400', - textAlign: 'left', - color: 'black', marginBottom: 16, }, - backToTopButtonText: { - fontFamily: 'Manrope-Regular', - fontSize: 12, - fontWeight: '800', - textAlign: 'left', - color: 'black', - }, }); export default styles; diff --git a/src/app/auth/signup/index.tsx b/src/app/auth/signup/index.tsx index 84a9e511..fbaeb5cd 100644 --- a/src/app/auth/signup/index.tsx +++ b/src/app/auth/signup/index.tsx @@ -130,7 +130,7 @@ function SignUpScreen() { if (error) Alert.alert(error.message); else - router.push({ + router.replace({ pathname: '/auth/verify', params: { finalRedirect: 'onboarding' }, }); diff --git a/src/components/AccountDataDisplay/AccountDataDisplay.tsx b/src/components/AccountDataDisplay/AccountDataDisplay.tsx index a2d464f3..4faccfff 100644 --- a/src/components/AccountDataDisplay/AccountDataDisplay.tsx +++ b/src/components/AccountDataDisplay/AccountDataDisplay.tsx @@ -1,6 +1,7 @@ import { View, Text } from 'react-native'; import styles from './styles'; +import globalStyles from '../../styles/globalStyles'; type AccountDataDisplayProps = { label: string; @@ -10,9 +11,9 @@ type AccountDataDisplayProps = { function AccountDataDisplay({ label, value }: AccountDataDisplayProps) { return ( - {label} + {label} {typeof value === 'string' ? ( - {value} + {value} ) : ( value )} diff --git a/src/components/AccountDataDisplay/styles.tsx b/src/components/AccountDataDisplay/styles.tsx index 5d769230..78da8ddb 100644 --- a/src/components/AccountDataDisplay/styles.tsx +++ b/src/components/AccountDataDisplay/styles.tsx @@ -8,18 +8,11 @@ export default StyleSheet.create({ marginBottom: 26, }, label: { - fontSize: 12, - fontFamily: 'Manrope-Regular', - fontStyle: 'normal', - fontWeight: '400', color: colors.textGrey, }, value: { paddingTop: 18, paddingRight: 20, fontSize: 14, - fontFamily: 'Manrope-Regular', - fontStyle: 'normal', - fontWeight: '400', }, }); diff --git a/src/components/UserStringInput/styles.tsx b/src/components/UserStringInput/styles.tsx index a11509d5..5642a55e 100644 --- a/src/components/UserStringInput/styles.tsx +++ b/src/components/UserStringInput/styles.tsx @@ -14,7 +14,6 @@ export default StyleSheet.create({ borderWidth: 1, borderRadius: 5, borderColor: 'black', - fontFamily: 'Manrope-Regular', }, inputField: { flex: 1, diff --git a/src/styles/globalStyles.ts b/src/styles/globalStyles.ts index ef9e2cb3..12e17283 100644 --- a/src/styles/globalStyles.ts +++ b/src/styles/globalStyles.ts @@ -79,6 +79,12 @@ export default StyleSheet.create({ textAlign: 'left', color: 'black', }, + body2Bold: { + fontFamily: 'Manrope-Bold', + fontSize: 16, + textAlign: 'left', + color: 'black', + }, body3: { fontFamily: 'Manrope-Regular', fontSize: 18, @@ -135,3 +141,5 @@ export default StyleSheet.create({ marginTop: 20, }, }); + +export const fonts = ['Manrope-Bold', 'Manrope-Regular', 'Manrope-Semibold'];