back button

src/components/MusicLandHeader.js

@@ -18,23 +18,20 @@ const MusicLandHeader = ({
         ...Style.containerRow,
         gap: 8,
         paddingHorizontal: 12,
-        paddingVertical: 8,
-        // backgroundColor: Palette.transparentWhite,
-        // borderRadius: mainBorderRadius,
+        paddingVertical: 7,
+        borderRadius: 100,
+        borderWidth: 1,
+        backgroundColor: Palette.ultraLightWhite,
+        borderColor: Palette.ultraLightWhite,
+        borderStyle: "solid",
       }
     : { width: 24, height: 24, ...Style.containerCenter };
-  const backIconSource = isWeb ? icons.arrowRight : icons.chevronDown;
-  const backIconStyle = isWeb
-    ? {
-        width: 16,
-        height: 16,
-        transform: [{ rotate: "180deg" }],
-      }
-    : {
-        width: 15,
-        height: 15,
-        transform: [{ rotate: "90deg" }],
-      };
+  const backIconSource = isWeb ? icons.chevronDown : icons.chevronDown;
+  const backIconStyle = {
+    width: 15,
+    height: 15,
+    transform: [{ rotate: "90deg" }],
+  };
 
   return (
     <View style={{ alignItems: "center", gap: 16 }}>
@@ -57,6 +54,7 @@ const MusicLandHeader = ({
             </Text>
           )}
         </Pressable>
+
         <View style={{ flex: 1 }}>
           <ProgressBar progress={progress} />
         </View>