feat: background

src/assets/index.js

@@ -207,6 +207,8 @@ export const background = {
   profileBgWeb: require("./UI/profileBgWeb.png"),
   hitParadeBG,
   hitParadeBG2: require("./UI/hitparadeBG2.jpg"),
+  playbackWeb: require("./UI/playbackWeb.png"),
+  playbackMobile: require("./UI/playbackMobile.png"),
   homeBG,
   homeBGWeb: require("./UI/homeBGWeb.png"),
   loginBgWeb: require("./UI/loginBgWeb.png"),

src/data/data.js

@@ -417,9 +417,9 @@ export const VOICE = [
   {
     title: "BASE",
     data: [
-      "Une voix féminine interpretra ta chanson.",
-      "Une voix masculine interpretera ta chanson.",
-      "Deux voix pour interpreter ta chanson.",
+      "Une voix féminine interprétera ta chanson.",
+      "Une voix masculine interprétera ta chanson.",
+      "Deux voix pour interpréter ta chanson.",
       "Solo vocal puissant et dramatique.",
       "Un chœur gospel pour (dimension spirituelle ou émotionnelle).",
       "Un cri brut et puissant (émotion intense).",

src/screens/Home/Home.js

@@ -395,8 +395,7 @@ const Home = ({ navigation, route }) => {
   const handleStartVisit = useCallback(() => {
     setVideoUrl(isWeb ? videos?.landingWeb : videos?.landing);
   }, []);
-  console.log("is web ? : ", isWeb);
-  console.log("landing video url is : ", videoUrl);
+
   const handleReturnToLanding = useCallback(() => {
     navigate(Routes.LandingPage);
   }, []);

src/screens/Playback/Playback.js

@@ -31,7 +31,7 @@ const Playback = ({ route, navigation }) => {
   }, [project]);
 
   return (
-    <Page headerType="NONE" backgroundImg={background.playbackBG2}>
+    <Page headerType="NONE" backgroundImg={isWeb ? background.playbackWeb : background.playbackMobile}>
       <Image source={ai.theo} style={styles.img} resizeMode="contain" />
       <MusicLandHeader
         onPressBack={() => navigation.navigate(Routes.Home)}

src/screens/Playback/PlaybackGuide.js

@@ -7,13 +7,14 @@ import Page from "../../layouts/Page";
 import { Routes } from "../../navigation";
 import { gutters, Palette } from "../../styles";
 import { FONT_FAMILY } from "../../styles/Fonts";
+import { isWeb } from "../../hooks/useLayoutType";
 
 const PlaybackGuide = ({ navigation }) => {
     return (
-        <Page headerType="NONE" backgroundImg={background.playbackBG2}>
+        <Page headerType="NONE" backgroundImg={isWeb ? background.playbackWeb : background.playbackMobile}>
             <MusicLandHeader onPressBack={() => navigation.goBack()} />
             <View style={styles.container}>
-                <BlurView intensity={Platform.OS === "ios" ? 80 : 50} style={styles.blurContainer}>
+                <BlurView intensity={Platform.OS === "ios" ? 80 : 40} style={styles.blurContainer} experimentalBlurMethod="dimezisBlurView">
                     <ScrollView
                         contentContainerStyle={styles.scrollContent}
                         showsVerticalScrollIndicator={false}

src/screens/Playback/RecordedPlayback.js

@@ -140,7 +140,7 @@ const RecordedPlayback = ({ route }) => {
     try {
       const duration = progressInfo?.dur || 0;
       const position = progressInfo?.pos || 0;
-      const isAtEnd = duration > 0 && duration - position < 350;
+      const isAtEnd = duration > 0 && duration - position < 1000;
       const isCurrentlyPlaying =
         !!audioPlayer?.playing || !!videoPlayer?.playing;