some visual changes

app/(tabs)/settings.tsx

@@ -9,6 +9,7 @@ import {Paragraph, Text} from 'react-native-paper';
 
 import * as WebBrowser from "expo-web-browser";
 import {useAuth} from "@/src/context/AuthProvider";
+import {StyleSheet, View} from "react-native";
 
 WebBrowser.maybeCompleteAuthSession();
 
@@ -21,18 +22,29 @@ export default function SettingsScreen() {
         console.log('Erhaltener Authentifizierungscode:', token);
     };
 
-    console.log('authenticatedUser', authenticatedUser)
-
     return (
         <ThemedBackground>
             <ThemedHeader>
                 Settings
             </ThemedHeader>
-            <Paragraph>Guten Tag, {authenticatedUser?.name}</Paragraph>
-            <ChangePasswordModal/>
-            <ThemeToggleButton/>
-            <SpotifyAuthButton onAuthSuccess={handleAuthSuccess} jwtToken={jwtToken!}/>
-            {token && <Text>Erhaltener Code: {token.access_token}</Text>}
+            <View style={styles.container}>
+                <Paragraph>Guten Tag, {authenticatedUser?.name}</Paragraph>
+                <ChangePasswordModal/>
+                <ThemeToggleButton/>
+                <SpotifyAuthButton
+                    onAuthSuccess={handleAuthSuccess}
+                    jwtToken={jwtToken!}
+                />
+                {token && <Text>Erhaltener Code: {token.access_token}</Text>}
+            </View>
         </ThemedBackground>
     );
 }
+
+const styles = StyleSheet.create({
+    container: {
+        width: "100%",
+        gap: 12, // Für Abstand zwischen den Kind-Elementen (ab React Native 0.71)
+        alignItems: "center", // Zentrierung
+    },
+});