theming stuff

api/queries/functions/images.ts

@@ -10,8 +10,8 @@ export function fetchItemImage(itemId: string, imageType?: ImageType, size?: num
         .getItemImage({ 
             itemId, 
             imageType: imageType ? imageType : ImageType.Primary,
-            width: size ?? QueryConfig.playerArtwork.width,
-            height: size ?? QueryConfig.playerArtwork.height
+            width: size ? Math.floor(size) : QueryConfig.playerArtwork.width,
+            height: size ? Math.floor(size) : QueryConfig.playerArtwork.height
         }, {
             responseType: 'blob'
         })

components/Global/helpers/slider.tsx

@@ -11,11 +11,11 @@ interface SliderProps {
 
 const JellifySliderThumb = styled(Slider.Thumb, {
     backgroundColor: getTokens().color.$telemagenta,
-    borderColor: getTokens().color.$purpleGray,
+    borderColor: getTokens().color.$grape,
 })
 
 const JellifySliderTrack = styled(Slider.Track, {
-    backgroundColor: getTokens().color.$purpleGray
+    backgroundColor: getTokens().color.$grape
 });
 
 const JellifyActiveSliderTrack = styled(Slider.TrackActive, {

tamagui.config.ts

@@ -6,8 +6,9 @@ const tokens = createTokens({
   ...TamaguiTokens,
   color: {
     purpleDark: "#070217",
-    purple: "#5638BB",
+    purple: "#100538",
     purpleGray: "#66617B",
+    grape: "#5638BB",
     telemagenta: "#cc2f71",
     white: "#ffffff",
     black: "#000000"
@@ -26,12 +27,12 @@ const jellifyConfig = createTamagui({
     themes: {
       dark: {
         background: tokens.color.purpleDark,
-        borderColor: tokens.color.purple,
+        borderColor: tokens.color.purpleGray,
         color: tokens.color.white
       },
       dark_purple: {
         color: tokens.color.purpleDark,
-        borderColor: tokens.color.purple,
+        borderColor: tokens.color.purpleGray,
         background: tokens.color.white
       },
       light: {