MOB: Settings paddings (#2120)

padding tweaks

apps/mobile/src/screens/Locations.tsx

@@ -50,7 +50,7 @@ export const Locations = ({ redirectToLocationSettings }: Props) => {
 			SettingsStackScreenProps<'Settings'>['navigation']
 	>();
 	return (
-		<ScreenContainer scrollview={false} style={tw`relative px-7 py-0`}>
+		<ScreenContainer scrollview={false} style={tw`relative px-6 py-0`}>
 			<Pressable
 				style={tw`absolute bottom-7 right-7 z-10 h-12 w-12 items-center justify-center rounded-full bg-accent`}
 				onPress={() => {
@@ -70,7 +70,7 @@ export const Locations = ({ redirectToLocationSettings }: Props) => {
 				<FlatList
 					data={filteredLocations}
 					contentContainerStyle={twStyle(
-						`py-5`,
+						`py-6`,
 						filteredLocations.length === 0 && 'h-full items-center justify-center'
 					)}
 					keyExtractor={(location) => location.id.toString()}

apps/mobile/src/screens/Tags.tsx

@@ -25,7 +25,7 @@ export default function Tags({ viewStyle = 'list' }: Props) {
 	useNodes(tags.data?.nodes);
 	const tagData = useCache(tags.data?.items);
 	return (
-		<ScreenContainer scrollview={false} style={tw`relative px-7 py-0`}>
+		<ScreenContainer scrollview={false} style={tw`relative px-6 py-0`}>
 			<Pressable
 				style={tw`absolute bottom-7 right-7 z-10 flex h-12 w-12 items-center justify-center rounded-full bg-accent`}
 				onPress={() => {
@@ -72,7 +72,7 @@ export default function Tags({ viewStyle = 'list' }: Props) {
 					showsHorizontalScrollIndicator={false}
 					ItemSeparatorComponent={() => <View style={tw`h-2.5`} />}
 					contentContainerStyle={twStyle(
-						`py-5`,
+						`py-6`,
 						tagData.length === 0 && 'h-full items-center justify-center'
 					)}
 				/>

apps/mobile/src/screens/settings/client/AppearanceSettings.tsx

@@ -126,7 +126,7 @@ const AppearanceSettingsScreen = ({
 	// TODO: Hook this up to the theme store once light theme is fixed.
 
 	return (
-		<ScreenContainer scrollview={false} style={tw`gap-2 px-7`}>
+		<ScreenContainer scrollview={false} style={tw`gap-2 px-6`}>
 			<SettingsTitle>Theme</SettingsTitle>
 			<ScrollView
 				horizontal

apps/mobile/src/screens/settings/client/ExtensionsSettings.tsx

@@ -8,7 +8,7 @@ const ExtensionsSettingsScreen = ({
 	navigation
 }: SettingsStackScreenProps<'ExtensionsSettings'>) => {
 	return (
-		<ScreenContainer style={tw`px-7`}>
+		<ScreenContainer style={tw`px-6`}>
 			<Text style={tw`text-ink`}>TODO</Text>
 		</ScreenContainer>
 	);

apps/mobile/src/screens/settings/client/GeneralSettings.tsx

@@ -16,7 +16,7 @@ const GeneralSettingsScreen = ({ navigation }: SettingsStackScreenProps<'General
 	if (!node) return null;
 
 	return (
-		<ScreenContainer style={tw`justify-start gap-0 px-7`} scrollview={false}>
+		<ScreenContainer style={tw`justify-start gap-0 px-6`} scrollview={false}>
 			<Card style={tw`bg-app-box`}>
 				{/* Card Header */}
 				<View style={tw`flex flex-row justify-between`}>
@@ -38,7 +38,7 @@ const GeneralSettingsScreen = ({ navigation }: SettingsStackScreenProps<'General
 				<SettingsTitle style={tw`mb-1`}>Node Name</SettingsTitle>
 				<Input value={node.name} />
 				{/* // TODO: Bring this back */}
-				{/* <SettingsTitle style={tw`mb-1 mt-3`}>Node Port</SettingsTitle> */}
+				{/* <SettingsTitle style={tw`mt-3 mb-1`}>Node Port</SettingsTitle> */}
 				{/* <Input value={node.p2p_port?.toString() ?? '5795'} keyboardType="numeric" /> */}
 			</Card>
 			{debugState.enabled && (

apps/mobile/src/screens/settings/client/LibrarySettings.tsx

@@ -92,7 +92,7 @@ const LibrarySettingsScreen = ({ navigation }: SettingsStackScreenProps<'Library
 	const modalRef = useRef<ModalRef>(null);
 
 	return (
-		<ScreenContainer style={tw`justify-start gap-0 px-7 py-0`} scrollview={false}>
+		<ScreenContainer style={tw`justify-start gap-0 px-6 py-0`} scrollview={false}>
 			<Fade
 				fadeSides="top-bottom"
 				orientation="vertical"

apps/mobile/src/screens/settings/client/PrivacySettings.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
-import { Text, View } from 'react-native';
+import { Text } from 'react-native';
 import ScreenContainer from '~/components/layout/ScreenContainer';
 import { tw } from '~/lib/tailwind';
 
 const PrivacySettingsScreen = () => {
 	return (
-		<ScreenContainer scrollview={false} style={tw`px-7`}>
+		<ScreenContainer scrollview={false} style={tw`px-6`}>
 			<Text style={tw`text-ink`}>TODO</Text>
 		</ScreenContainer>
 	);

apps/mobile/src/screens/settings/info/About.tsx

@@ -12,7 +12,7 @@ const AboutScreen = () => {
 	const buildInfo = useBridgeQuery(['buildInfo']);
 
 	return (
-		<ScreenContainer style={tw`justify-start gap-0 px-7 py-5`}>
+		<ScreenContainer style={tw`justify-start gap-0 px-6`}>
 			<View style={tw.style('flex flex-row items-center')}>
 				<Image
 					source={require('../../../../assets/icon.png')}

apps/mobile/src/screens/settings/library/EditLocationSettings.tsx

@@ -109,7 +109,7 @@ const EditLocationSettingsScreen = ({
 	const fullRescan = useLibraryMutation('locations.fullRescan');
 
 	return (
-		<ScreenContainer style={tw`px-7`}>
+		<ScreenContainer style={tw`px-6`}>
 			{/* Inputs */}
 			<View>
 				<SettingsTitle style={tw`mb-1`}>Display Name</SettingsTitle>

apps/mobile/src/screens/settings/library/LibraryGeneralSettings.tsx

@@ -37,7 +37,7 @@ const LibraryGeneralSettingsScreen = (_: SettingsStackScreenProps<'LibraryGenera
 	});
 
 	return (
-		<ScreenContainer scrollview={false} style={tw`justify-start px-7 py-0`}>
+		<ScreenContainer scrollview={false} style={tw`justify-start px-6 py-0`}>
 			<View style={tw`pt-5`}>
 				<SettingsTitle style={tw`mb-1`}>Name</SettingsTitle>
 				<Controller

apps/mobile/src/screens/settings/library/NodesSettings.tsx

@@ -9,7 +9,7 @@ const NodesSettingsScreen = ({ navigation }: SettingsStackScreenProps<'NodesSett
 	const onlineNodes = useDiscoveredPeers();
 
 	return (
-		<ScreenContainer scrollview={false} style={tw`gap-0 px-7`}>
+		<ScreenContainer scrollview={false} style={tw`gap-0 px-6`}>
 			<Text style={tw`text-ink`}>Pairing</Text>
 
 			{[...onlineNodes.entries()].map(([id, node]) => (