From 05e7a3d697dfa24729dcb632ac7b4d7c26dc454f Mon Sep 17 00:00:00 2001
From: Violet Caulfield <violet@cosmonautical.cloud>
Date: Wed, 19 Feb 2025 17:21:05 -0600
Subject: [PATCH] styling changes

---
 components/Library/component.tsx | 4 ++--
 components/tabs.tsx              | 6 ++++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/components/Library/component.tsx b/components/Library/component.tsx
index 71865719..7b214834 100644
--- a/components/Library/component.tsx
+++ b/components/Library/component.tsx
@@ -17,7 +17,7 @@ export default function Library({
     const { width } = useSafeAreaFrame();
 
     return (
-        <SafeAreaView style={{ flex: 1 }} edges={["top", "right", "left"]}>
+        // <SafeAreaView style={{ flex: 1 }} edges={["top", "right", "left"]}>
             <FlatList
                 contentInsetAdjustmentBehavior="automatic"
                 data={Categories}
@@ -34,6 +34,6 @@ export default function Library({
                         />
                 }
             />
-        </SafeAreaView>
+        // </SafeAreaView>
     )
 }
\ No newline at end of file
diff --git a/components/tabs.tsx b/components/tabs.tsx
index 667b2a2d..1ace6163 100644
--- a/components/tabs.tsx
+++ b/components/tabs.tsx
@@ -6,15 +6,17 @@ import Library from "./Library/stack";
 import Settings from "./Settings/stack";
 import { Discover } from "./Discover/stack";
 import { Miniplayer } from "./Player/mini-player";
-import { getTokens, Separator } from "tamagui";
+import { getToken, getTokens, Separator } from "tamagui";
 import { usePlayerContext } from "../player/provider";
 import SearchStack from "./Search/stack";
 import LibraryStack from "./Library/stack";
+import { useColorScheme } from "react-native";
 
 const Tab = createBottomTabNavigator();
 
 export function Tabs() : React.JSX.Element {
 
+    const isDarkMode = useColorScheme() === 'dark'
     const { nowPlaying } = usePlayerContext();
 
     return (
@@ -23,7 +25,7 @@ export function Tabs() : React.JSX.Element {
                 screenOptions={{
                     animation: 'shift',
                     tabBarActiveTintColor: getTokens().color.telemagenta.val,
-                    tabBarInactiveTintColor: getTokens().color.amethyst.val
+                    tabBarInactiveTintColor: isDarkMode ? getToken("$color.amethyst") : getToken("$color.purpleGray")
                 }}
                 tabBar={(props) => (
                     <>