From b369abbaf877de5ca552d06cbc00e11b1156ea91 Mon Sep 17 00:00:00 2001 From: Matthew Turk Date: Fri, 22 Jul 2022 22:08:19 -0400 Subject: [PATCH] Dark mode has decent functionality now. --- App.js | 38 ++++++++++++++-- components/Carousel.js | 5 +-- components/Diptych.js | 16 +++---- components/Shelf.js | 7 +-- constants/Sections.js | 40 ++++++++++++++++- constants/Spacing.js | 6 ++- dummy.json | 1 - helpers/format.js | 55 ++++++++--------------- screens/Home.js | 45 ++++++++----------- screens/Post.js | 81 +++++++++++++--------------------- theme.js | 99 +++++++++++++++++++++++------------------- 11 files changed, 206 insertions(+), 187 deletions(-) delete mode 100644 dummy.json diff --git a/App.js b/App.js index 2b6061c3..70a04e4d 100644 --- a/App.js +++ b/App.js @@ -46,6 +46,8 @@ const firebaseConfig = { serviceAccountId: SERVICE_ACCOUNT_ID }; +const cardinalLogo = require("./assets/media/DailyLogoCardinal.png") +const whiteLogo = require("./assets/media/DailyLogoWhite.png") const Stack = createStackNavigator() export default function App() { @@ -63,6 +65,34 @@ export default function App() { setTheme(next) } + const headerOptions = { + headerTitle: () => (), + headerStyle: { + backgroundColor: bread[theme]["background-basic-color-1"] + }, + headerTintColor: eva[theme]["color-primary-500"] + } + + const detailHeaderOptions = { + headerTitle: "", + headerTransparent: true, + headerTintColor: "white", + headerBackTitleVisible: false + } + + const sectionHeaderOptions = { + headerStyle: { + backgroundColor: bread[theme]["background-basic-color-1"] + }, + headerTintColor: bread[theme]["color-primary-500"], + headerTitleStyle: { + color: eva[theme][theme === "light" ? "color-basic-800" : "color-basic-100"] + } + } + useEffect(() => { Font.loadAsync({ // Loads fonts from static resource. @@ -121,16 +151,16 @@ export default function App() { - + (), headerStyle: { backgroundColor: theme === "light" ? "white" : "#222B45" }, headerTintColor: bread["color-primary-500"]}}/> - - ({ title: route.params.category.name })}/> + options={headerOptions}/> + + ({ title: route.params.category.name, ...sectionHeaderOptions })}/> diff --git a/components/Carousel.js b/components/Carousel.js index b8b97e7d..ec08155a 100644 --- a/components/Carousel.js +++ b/components/Carousel.js @@ -41,10 +41,7 @@ export default function Carousel(props) { } return ( - + {articles.map((item, index) => { return ( diff --git a/components/Diptych.js b/components/Diptych.js index a9cf0ac9..c1a99d91 100644 --- a/components/Diptych.js +++ b/components/Diptych.js @@ -12,10 +12,7 @@ export default function Diptych(props) { const Header = (props) => ( - + ) @@ -30,15 +27,12 @@ export default function Diptych(props) { } return ( - + {_.chunk(newsArticles, 2).map((couplet, index) => ( {couplet.map((item) => ( } footer={