Styling changes

check the flex on the player, future vi

components/Global/helpers/slider.tsx

@@ -28,7 +28,7 @@ export function HorizontalSlider({
             max={max} 
             step={1}
             orientation="horizontal"
-            marginHorizontal={5}
+            marginHorizontal={10}
             { ...props }
         >
             <TamaguiSlider.Track>
@@ -49,7 +49,7 @@ export function VerticalSlider(props: SliderVerticalProps) : React.JSX.Element {
             max={100} 
             step={1}
             orientation="vertical"
-            marginVertical={5}
+            marginVertical={10}
         >
             <TamaguiSlider.Track>
                 <TamaguiSlider.TrackActive />

components/Home/component.tsx

@@ -68,7 +68,6 @@ function ProvidedHome({ route, navigation }: ProvidedHomeProps): React.JSX.Eleme
         <SafeAreaView edges={["top", "right", "left"]}>
             <ScrollView 
                 contentInsetAdjustmentBehavior="automatic"
-                paddingLeft={10}
                 refreshControl={
                     <RefreshControl 
                     refreshing={refetching} 

components/Home/helpers/recent-artists.tsx

@@ -11,12 +11,6 @@ export default function RecentArtists({ navigation }: ProvidedHomeProps): React.
 
     const { recentArtists } = useHomeContext();
 
-    useEffect(() => {
-        console.log("Recently played artists", recentArtists);
-    }, [
-        recentArtists
-    ])
-
     return (
         <View>
             <H2>Recent Artists</H2>

components/Player/component.tsx

@@ -44,14 +44,14 @@ export default function Player({ navigation }: { navigation : NavigationHelpers<
                     </XStack>
 
                     <XStack 
-                        justifyContent="flex-start"
                         marginVertical={10}
+                        flex={1}
                     >
 
-                        <YStack justifyContent="flex-start">
-                            <Text fontSize={"$4"}>{nowPlaying?.title ?? "Untitled Track"}</Text>
+                        <YStack justifyContent="flex-start" flex={4}>
+                            <Text fontSize={"$6"}>{nowPlaying?.title ?? "Untitled Track"}</Text>
                             <Text 
-                                fontSize={"$4"}
+                                fontSize={"$6"}
                                 bold
                                 onPress={() => {
                                     navigation.navigate("Artist", {
@@ -63,7 +63,7 @@ export default function Player({ navigation }: { navigation : NavigationHelpers<
                                 {nowPlaying.artist ?? "Unknown Artist"}</Text>
                         </YStack>
 
-                        <XStack>
+                        <XStack alignItems="center">
                             {/* Buttons for favorites, song menu go here */}
 
                         </XStack>

components/Settings/helpers/account-details.tsx

@@ -1,9 +1,9 @@
 import { XStack } from "@tamagui/stacks";
 import React from "react";
 import { useApiClientContext } from "../../jellyfin-api-provider";
-import MaterialCommunityIcons from "react-native-vector-icons/MaterialCommunityIcons";
 import Avatar from "@/components/Global/helpers/avatar";
 import { Text } from "@/components/Global/helpers/text";
+import Icon from "@/components/Global/helpers/icon";
 
 export default function AccountDetails(): React.JSX.Element {
 
@@ -12,7 +12,7 @@ export default function AccountDetails(): React.JSX.Element {
     return (
 
         <XStack alignItems="center">
-            <MaterialCommunityIcons name="account-music-outline" />
+            <Icon name="account-music-outline" />
             <Text>{user!.name}</Text>
             <Avatar itemId={user!.id} circular />
         </XStack>