From 5545ed40fb4eccbfb54c9843c19aa0ad6ad92ca9 Mon Sep 17 00:00:00 2001 From: tapframe Date: Fri, 20 Jun 2025 02:27:50 +0530 Subject: [PATCH] Update styles in CatalogSection, ContinueWatchingSection, ThisWeekSection, and HomeScreen for improved UI consistency This commit enhances the visual appearance of the CatalogSection, ContinueWatchingSection, ThisWeekSection, and HomeScreen by updating font sizes, weights, letter spacing, and margins. Additionally, adjustments to the title underline styles have been made for better alignment and opacity, contributing to a more cohesive user interface across these components. --- src/components/home/CatalogSection.tsx | 18 +++++++++--------- .../home/ContinueWatchingSection.tsx | 18 +++++++++--------- src/components/home/ThisWeekSection.tsx | 5 +++-- src/screens/HomeScreen.tsx | 18 +++++++++--------- src/screens/TraktSettingsScreen.tsx | 2 +- 5 files changed, 31 insertions(+), 30 deletions(-) diff --git a/src/components/home/CatalogSection.tsx b/src/components/home/CatalogSection.tsx index d4cdd9cd2..71937b0e5 100644 --- a/src/components/home/CatalogSection.tsx +++ b/src/components/home/CatalogSection.tsx @@ -132,19 +132,19 @@ const styles = StyleSheet.create({ position: 'relative', }, catalogTitle: { - fontSize: 18, - fontWeight: '800', - textTransform: 'uppercase', - letterSpacing: 0.5, - marginBottom: 6, + fontSize: 19, + fontWeight: '700', + letterSpacing: 0.2, + marginBottom: 4, }, titleUnderline: { position: 'absolute', - bottom: -4, + bottom: -2, left: 0, - width: 60, - height: 3, - borderRadius: 1.5, + width: 35, + height: 2, + borderRadius: 1, + opacity: 0.8, }, seeAllButton: { flexDirection: 'row', diff --git a/src/components/home/ContinueWatchingSection.tsx b/src/components/home/ContinueWatchingSection.tsx index f8840ea3a..13c420dcc 100644 --- a/src/components/home/ContinueWatchingSection.tsx +++ b/src/components/home/ContinueWatchingSection.tsx @@ -401,19 +401,19 @@ const styles = StyleSheet.create({ position: 'relative', }, title: { - fontSize: 18, - fontWeight: '800', - textTransform: 'uppercase', - letterSpacing: 0.5, - marginBottom: 6, + fontSize: 20, + fontWeight: '700', + letterSpacing: 0.3, + marginBottom: 4, }, titleUnderline: { position: 'absolute', - bottom: -4, + bottom: -2, left: 0, - width: 60, - height: 3, - borderRadius: 1.5, + width: 40, + height: 2, + borderRadius: 1, + opacity: 0.8, }, wideList: { paddingHorizontal: 16, diff --git a/src/components/home/ThisWeekSection.tsx b/src/components/home/ThisWeekSection.tsx index 1fe8cd543..30ebfe4c2 100644 --- a/src/components/home/ThisWeekSection.tsx +++ b/src/components/home/ThisWeekSection.tsx @@ -303,8 +303,9 @@ const styles = StyleSheet.create({ marginBottom: 12, }, title: { - fontSize: 18, - fontWeight: 'bold', + fontSize: 19, + fontWeight: '700', + letterSpacing: 0.2, }, viewAllButton: { flexDirection: 'row', diff --git a/src/screens/HomeScreen.tsx b/src/screens/HomeScreen.tsx index 9eb77a557..28d92fa6e 100644 --- a/src/screens/HomeScreen.tsx +++ b/src/screens/HomeScreen.tsx @@ -876,19 +876,19 @@ const styles = StyleSheet.create({ position: 'relative', }, catalogTitle: { - fontSize: 18, - fontWeight: '800', - textTransform: 'uppercase', - letterSpacing: 0.5, - marginBottom: 6, + fontSize: 19, + fontWeight: '700', + letterSpacing: 0.2, + marginBottom: 4, }, titleUnderline: { position: 'absolute', - bottom: -4, + bottom: -2, left: 0, - width: 60, - height: 3, - borderRadius: 1.5, + width: 35, + height: 2, + borderRadius: 1, + opacity: 0.8, }, seeAllButton: { flexDirection: 'row', diff --git a/src/screens/TraktSettingsScreen.tsx b/src/screens/TraktSettingsScreen.tsx index d0cfa96d6..ba6bb44c6 100644 --- a/src/screens/TraktSettingsScreen.tsx +++ b/src/screens/TraktSettingsScreen.tsx @@ -365,7 +365,7 @@ const TraktSettingsScreen: React.FC = () => { styles.settingDescription, { color: isDarkMode ? currentTheme.colors.mediumEmphasis : currentTheme.colors.textMutedDark } ]}> - Coming soon + Use "Sync Now" to import your watch history and progress from Trakt