diff --git a/App.tsx b/App.tsx index f5e870f..71a8d11 100644 --- a/App.tsx +++ b/App.tsx @@ -55,6 +55,7 @@ declare global { const theme = { ...DefaultTheme, + version: 3, colors: { ...DefaultTheme.colors, primary: '#cb2b78', diff --git a/components/ReleasesTab.tsx b/components/ReleasesTab.tsx index 40028be..46b7bf8 100644 --- a/components/ReleasesTab.tsx +++ b/components/ReleasesTab.tsx @@ -38,7 +38,7 @@ export const ReleasesTab = () => { ); const [showFilter, setShowFilter] = React.useState(ShowFilter.None); const [searchTerm, setSearchTerm] = React.useState(''); - const [refreshing, setRefreshing] = React.useState(false); + const [refreshing, setRefreshing] = React.useState(true); const { watchedEpisodeStore, watchListStore } = useStore(); diff --git a/components/releasePageComponents/ReleaseHeader.tsx b/components/releasePageComponents/ReleaseHeader.tsx index 72eef56..bf06b90 100644 --- a/components/releasePageComponents/ReleaseHeader.tsx +++ b/components/releasePageComponents/ReleaseHeader.tsx @@ -1,6 +1,19 @@ import * as React from 'react'; -import { View, Keyboard, useWindowDimensions, StyleSheet } from 'react-native'; -import { Appbar, Button, Dialog, Portal, Searchbar } from 'react-native-paper'; +import { + View, + Keyboard, + useWindowDimensions, + StyleSheet, + Appearance, +} from 'react-native'; +import { + Appbar, + Button, + Dialog, + Portal, + Searchbar, + useTheme, +} from 'react-native-paper'; import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import { RadioButton } from 'react-native-paper'; import AsyncStorage from '@react-native-async-storage/async-storage'; @@ -29,6 +42,7 @@ export const ReleaseTabHeader = ({ onFilterChanged, }: ReleaseTabHeaderProps) => { const { width } = useWindowDimensions(); + const { colors } = useTheme(); const [searchQuery, setSearchQuery] = React.useState(''); const [filterPanelShown, setFilterPanelShown] = React.useState(false); @@ -37,6 +51,18 @@ export const ReleaseTabHeader = ({ searchbar: { flexGrow: 1, width: width - 150 }, showFilterButton: { paddingTop: 5, width: 50 }, showFilterButtonContent: { flexDirection: 'row-reverse' }, + backgroundStyle: { + backgroundColor: + Appearance.getColorScheme() !== 'light' + ? colors.subsPleaseDark2 + : colors.subsPleaseLight3, + }, + font: { + color: + Appearance.getColorScheme() !== 'light' + ? colors.darkText + : colors.lightText, + }, }); const onChangeText = (query: string) => { @@ -70,6 +96,11 @@ export const ReleaseTabHeader = ({ return <>; }; + const radioButtonStyle = + Appearance.getColorScheme() !== 'light' + ? colors.darkText + : colors.lightText; + return ( <> @@ -94,10 +125,11 @@ export const ReleaseTabHeader = ({ - Filter + Filter { @@ -107,18 +139,26 @@ export const ReleaseTabHeader = ({ value={filter} >