update

2025-08-18 21:11:27 +08:00
parent 5fd72ba2c0
commit 56a66e59c9
8 changed files with 92 additions and 3 deletions
@@ -0,0 +1,80 @@
+import { View, Text, Image, Pressable } from "react-native";
+import React, { useState } from "react";
+import Page from "../../layouts/Page";
+import { background, icons } from "../../assets";
+import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
+import { Palette, Style } from "../../styles";
+import { FONT_FAMILY } from "../../styles/Fonts";
+import BorderGradientButton from "../../components/BorderGradientButton";
+
+const HitParade = () => {
+  const [selected, setSelected] = useState("Chansons");
+
+  return (
+    <Page backgroundImg={background.hitParadeBG} headerType="NONE">
+      <View style={{ gap: 12, flex: 1 }}>
+        <Image source={icons.musicLandLogo} style={{ alignSelf: "center" }} />
+        <View style={{ flex: 1, gap: 24 }}>
+          <View style={{ gap: 11 }}>
+            <Pressable style={{ position: "absolute", right: 8, top: 20 }}>
+              <Image source={icons.calendar} />
+            </Pressable>
+            <Image
+              source={icons.hitParadeLogo}
+              style={{ alignSelf: "center" }}
+            />
+            <CreateLyricsHeader
+              gradientProps={{
+                colors: ["#F94697", "#7023F7"],
+              }}
+            >
+              <Text
+                style={{
+                  fontSize: 16,
+                  color: Palette.white,
+                  fontFamily: FONT_FAMILY.HelveticaNeueBold,
+                }}
+              >
+                Coups de coeur des utilisateurs catégorie Playbacks
+              </Text>
+              <Text
+                style={{
+                  fontSize: 12,
+                  color: Palette.white,
+                  fontFamily: FONT_FAMILY.InterRegular,
+                }}
+              >
+                Les 3 Playbacks les plus likées du mois reçoivent des{"\n"}
+                tokens.
+              </Text>
+            </CreateLyricsHeader>
+          </View>
+          <View
+            style={{
+              ...Style.containerRow,
+              justifyContent: "space-between",
+            }}
+          >
+            {["Chansons", "Playbacks", "Clips"].map((item, index) => (
+              <BorderGradientButton
+                key={index}
+                title={item}
+                onPress={() => setSelected(item)}
+                tint={selected === item ? "light" : "dark"}
+                containerStyle={{
+                  width: 100,
+                }}
+                titleStyle={{
+                  fontSize: 16,
+                  fontFamily: FONT_FAMILY.HelveticaNeueBold,
+                }}
+              />
+            ))}
+          </View>
+        </View>
+      </View>
+    </Page>
+  );
+};
+
+export default HitParade;