Fix various spacing issues
Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>
This commit is contained in:
@@ -13,6 +13,7 @@ import {
|
||||
import { openDocumentTree } from 'react-native-scoped-storage';
|
||||
import { useDispatch, useSelector } from 'react-redux';
|
||||
import type {} from 'redux-thunk/extend-redux';
|
||||
import { useDeviceOrientation } from '@react-native-community/hooks';
|
||||
import styles from '../styles';
|
||||
import {
|
||||
RootState,
|
||||
@@ -21,7 +22,6 @@ import {
|
||||
setNoMedia,
|
||||
setStorageUri,
|
||||
} from '../state';
|
||||
import { ORIENTATION, useDimensions } from '../contexts';
|
||||
|
||||
const settingsStyles = StyleSheet.create({
|
||||
snackbar: {
|
||||
@@ -34,7 +34,7 @@ const settingsStyles = StyleSheet.create({
|
||||
|
||||
const Settings = () => {
|
||||
const { colors } = useTheme();
|
||||
const { orientation } = useDimensions();
|
||||
const orientation = useDeviceOrientation();
|
||||
const noMedia = useSelector((state: RootState) => state.settings.noMedia);
|
||||
const masonryColumns = useSelector(
|
||||
(state: RootState) => state.settings.masonryColumns,
|
||||
@@ -60,85 +60,80 @@ const Settings = () => {
|
||||
<>
|
||||
<ScrollView
|
||||
contentContainerStyle={[
|
||||
orientation === ORIENTATION.PORTRAIT
|
||||
orientation === 'portrait'
|
||||
? styles.paddingTop
|
||||
: styles.smallPaddingTop,
|
||||
styles.paddingHorizontal,
|
||||
{ backgroundColor: colors.background },
|
||||
]}>
|
||||
<View>
|
||||
<List.Section>
|
||||
<List.Subheader>Views</List.Subheader>
|
||||
<Text
|
||||
style={[
|
||||
settingsStyles.marginBottom,
|
||||
styles.smallPaddingHorizontal,
|
||||
]}>
|
||||
Masonry Columns
|
||||
</Text>
|
||||
<SegmentedButtons
|
||||
value={masonryColumns.toString()}
|
||||
<List.Section>
|
||||
<List.Subheader>Views</List.Subheader>
|
||||
<Text
|
||||
style={[
|
||||
settingsStyles.marginBottom,
|
||||
styles.smallPaddingHorizontal,
|
||||
]}>
|
||||
Masonry Columns
|
||||
</Text>
|
||||
<SegmentedButtons
|
||||
value={masonryColumns.toString()}
|
||||
onValueChange={value => {
|
||||
void dispatch(
|
||||
setMasonryColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
|
||||
);
|
||||
}}
|
||||
buttons={[
|
||||
{ label: '1', value: '1' },
|
||||
{ label: '2', value: '2' },
|
||||
{ label: '3', value: '3' },
|
||||
{ label: '4', value: '4' },
|
||||
]}
|
||||
style={settingsStyles.marginBottom}
|
||||
/>
|
||||
<Text
|
||||
style={[
|
||||
settingsStyles.marginBottom,
|
||||
styles.smallPaddingHorizontal,
|
||||
]}>
|
||||
Grid Columns
|
||||
</Text>
|
||||
<SegmentedButtons
|
||||
value={gridColumns.toString()}
|
||||
onValueChange={value => {
|
||||
void dispatch(
|
||||
setGridColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
|
||||
);
|
||||
}}
|
||||
buttons={[
|
||||
{ label: '1', value: '1' },
|
||||
{ label: '2', value: '2' },
|
||||
{ label: '3', value: '3' },
|
||||
{ label: '4', value: '4' },
|
||||
]}
|
||||
/>
|
||||
</List.Section>
|
||||
<List.Section>
|
||||
<List.Subheader>Media Storage</List.Subheader>
|
||||
<Button
|
||||
mode="elevated"
|
||||
style={settingsStyles.marginBottom}
|
||||
onPress={async () => {
|
||||
const { uri } = await openDocumentTree(true);
|
||||
void dispatch(setStorageUri(uri));
|
||||
}}>
|
||||
Change External Storage Path
|
||||
</Button>
|
||||
<View
|
||||
style={[styles.flexRowSpaceBetween, styles.smallPaddingHorizontal]}>
|
||||
<Text>Hide media from gallery</Text>
|
||||
<Switch
|
||||
value={noMedia}
|
||||
onValueChange={value => {
|
||||
void dispatch(
|
||||
setMasonryColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
|
||||
);
|
||||
void dispatch(setNoMedia(value));
|
||||
}}
|
||||
buttons={[
|
||||
{ label: '1', value: '1' },
|
||||
{ label: '2', value: '2' },
|
||||
{ label: '3', value: '3' },
|
||||
{ label: '4', value: '4' },
|
||||
]}
|
||||
style={settingsStyles.marginBottom}
|
||||
/>
|
||||
<Text
|
||||
style={[
|
||||
settingsStyles.marginBottom,
|
||||
styles.smallPaddingHorizontal,
|
||||
]}>
|
||||
Grid Columns
|
||||
</Text>
|
||||
<SegmentedButtons
|
||||
value={gridColumns.toString()}
|
||||
onValueChange={value => {
|
||||
void dispatch(
|
||||
setGridColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
|
||||
);
|
||||
}}
|
||||
buttons={[
|
||||
{ label: '1', value: '1' },
|
||||
{ label: '2', value: '2' },
|
||||
{ label: '3', value: '3' },
|
||||
{ label: '4', value: '4' },
|
||||
]}
|
||||
/>
|
||||
</List.Section>
|
||||
<List.Section>
|
||||
<List.Subheader>Media Storage</List.Subheader>
|
||||
<Button
|
||||
mode="elevated"
|
||||
style={settingsStyles.marginBottom}
|
||||
onPress={async () => {
|
||||
const { uri } = await openDocumentTree(true);
|
||||
void dispatch(setStorageUri(uri));
|
||||
}}>
|
||||
Change External Storage Path
|
||||
</Button>
|
||||
<View
|
||||
style={[
|
||||
styles.flexRowSpaceBetween,
|
||||
styles.smallPaddingHorizontal,
|
||||
]}>
|
||||
<Text>Hide media from gallery</Text>
|
||||
<Switch
|
||||
value={noMedia}
|
||||
onValueChange={value => {
|
||||
void dispatch(setNoMedia(value));
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</List.Section>
|
||||
</View>
|
||||
</View>
|
||||
</List.Section>
|
||||
<List.Section>
|
||||
<List.Subheader>Database</List.Subheader>
|
||||
<Button
|
||||
|
Reference in New Issue
Block a user