update
This commit is contained in:
@@ -57,7 +57,6 @@ const CreateLyricsWithAi = () => {
|
||||
<View
|
||||
style={{
|
||||
flex: 1,
|
||||
marginTop: 16,
|
||||
paddingBottom: gutters,
|
||||
gap: responsiveHeight(5),
|
||||
}}
|
||||
|
||||
@@ -7,7 +7,7 @@ import { size } from "../../styles/Style";
|
||||
import ProgressBar from "../../components/ProgressBar";
|
||||
import { FONT_FAMILY } from "../../styles/Fonts";
|
||||
import GradientButton from "../../components/GradientButton";
|
||||
import { navigate } from "../../navigation/NavigationService";
|
||||
import { goBack, navigate } from "../../navigation/NavigationService";
|
||||
import { Routes } from "../../navigation";
|
||||
|
||||
const CreatingLyrics = ({ active }) => {
|
||||
@@ -19,7 +19,6 @@ const CreatingLyrics = ({ active }) => {
|
||||
setProgress((prevProgress) => {
|
||||
if (prevProgress >= 100) {
|
||||
clearInterval(interval);
|
||||
navigate(Routes.Lyrics)
|
||||
return 100;
|
||||
}
|
||||
return prevProgress + 1;
|
||||
@@ -80,7 +79,7 @@ const CreatingLyrics = ({ active }) => {
|
||||
left: 10,
|
||||
zIndex: 3,
|
||||
}}
|
||||
onPress={() => console.log("Pressed")}
|
||||
onPress={goBack}
|
||||
>
|
||||
<Image source={icons.close} style={size({ size: 11 })} />
|
||||
</Pressable>
|
||||
|
||||
@@ -10,7 +10,7 @@ const CustomizeSongStructure = () => {
|
||||
const [containerLayout, setContainerLayout] = useState(null);
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 10 }}>
|
||||
<View style={{ flex: 1, gap: 10, marginTop: 16 }}>
|
||||
<CreateLyricsHeader
|
||||
title="Personnalise la structure de ta chanson"
|
||||
subTitle="Intègre en Drag and drop"
|
||||
|
||||
@@ -1,19 +1,15 @@
|
||||
import { View, Text, FlatList } from "react-native";
|
||||
import React, { useState } from "react";
|
||||
import React from "react";
|
||||
import CreateLyricsHeader from "./components/CreateLyricsHeader";
|
||||
import BorderGradient from "../../components/BorderGradient/BorderGradient";
|
||||
import { responsiveHeight } from "react-native-responsive-dimensions";
|
||||
import { BlurView } from "expo-blur";
|
||||
import { Palette } from "../../styles";
|
||||
import { FONT_FAMILY } from "../../styles/Fonts";
|
||||
import { EMOTION_CONVEY } from "../../data/data";
|
||||
import ItemContainer from "../../components/ItemContainer/ItemContainer";
|
||||
|
||||
const EmotionConvey = () => {
|
||||
const [itemLayout, setItemLayout] = useState([]);
|
||||
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 10 }}>
|
||||
<View style={{ flex: 1, gap: 10, marginTop: 16 }}>
|
||||
<CreateLyricsHeader
|
||||
title={`Quel émotion veux-tu\ntransmettre ?`}
|
||||
subTitle="Sélectionne tes intentions émotionnelles. (2 max)"
|
||||
@@ -26,46 +22,24 @@ const EmotionConvey = () => {
|
||||
gap: 16,
|
||||
flexGrow: 1,
|
||||
zIndex: 2,
|
||||
paddingTop: 5,
|
||||
}}
|
||||
renderItem={({ item, index }) => (
|
||||
<View>
|
||||
<BorderGradient
|
||||
gradientProps={{
|
||||
colors: item.color,
|
||||
}}
|
||||
style={{
|
||||
borderWidth: 1,
|
||||
height: itemLayout[index]?.height,
|
||||
borderRadius: 14,
|
||||
position: "absolute",
|
||||
width: "100%",
|
||||
}}
|
||||
/>
|
||||
<View
|
||||
style={{ borderRadius: 14, overflow: "hidden" }}
|
||||
onLayout={(e) => {
|
||||
e.persist();
|
||||
setItemLayout((prev) => [...prev, e.nativeEvent.layout]);
|
||||
}}
|
||||
>
|
||||
<BlurView
|
||||
intensity={30}
|
||||
style={{ paddingVertical: 14, paddingHorizontal: 12 }}
|
||||
<View style={{ paddingHorizontal: 5 }}>
|
||||
<CreateLyricsHeader colors={item.color} intensity={30} >
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 16,
|
||||
color: Palette.white,
|
||||
fontFamily: FONT_FAMILY.InterRegular,
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 16,
|
||||
color: Palette.white,
|
||||
fontFamily: FONT_FAMILY.InterRegular,
|
||||
}}
|
||||
>
|
||||
<Text style={{ fontFamily: FONT_FAMILY.InterBold }}>
|
||||
{item.title}
|
||||
</Text>{" "}
|
||||
: {item.description}
|
||||
</Text>
|
||||
</BlurView>
|
||||
</View>
|
||||
<Text style={{ fontFamily: FONT_FAMILY.InterBold }}>
|
||||
{item.title}
|
||||
</Text>{" "}
|
||||
: {item.description}
|
||||
</Text>
|
||||
</CreateLyricsHeader>
|
||||
</View>
|
||||
)}
|
||||
/>
|
||||
|
||||
@@ -10,7 +10,7 @@ import ItemContainer from "../../components/ItemContainer/ItemContainer";
|
||||
|
||||
const Goals = () => {
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 16 }}>
|
||||
<View style={{ flex: 1, gap: 16, marginTop: 16 }}>
|
||||
<View style={{ gap: 10 }}>
|
||||
<CreateLyricsHeader title="Quels sont tes objectifs ?" />
|
||||
<ItemContainer>
|
||||
|
||||
@@ -8,7 +8,7 @@ import ItemContainer from "../../components/ItemContainer/ItemContainer";
|
||||
|
||||
const Rhymes = () => {
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 10 }}>
|
||||
<View style={{ flex: 1, gap: 10, marginTop: 16 }}>
|
||||
<CreateLyricsHeader title="Avec ou sans rimes" />
|
||||
<ItemContainer height={200}>
|
||||
<View style={{ gap: 10 }}>
|
||||
|
||||
@@ -9,7 +9,7 @@ import ItemContainer from "../../components/ItemContainer/ItemContainer";
|
||||
|
||||
const SongStructure = () => {
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 10 }}>
|
||||
<View style={{ flex: 1, gap: 10, marginTop: 16 }}>
|
||||
<CreateLyricsHeader
|
||||
title="Comment veux-tu structurer ta chanson ?"
|
||||
subTitle="Sélectionne une structure."
|
||||
|
||||
@@ -10,7 +10,7 @@ import ItemContainer from "../../components/ItemContainer/ItemContainer";
|
||||
|
||||
const SongStyle = () => {
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 16 }}>
|
||||
<View style={{ flex: 1, gap: 16, marginTop: 16 }}>
|
||||
<View style={{ gap: 10 }}>
|
||||
<CreateLyricsHeader
|
||||
title={`Quel est le style de ta chanson ?`}
|
||||
|
||||
@@ -5,7 +5,7 @@ import CustomInput from "./components/CustomInput";
|
||||
|
||||
const SongTo = () => {
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 10 }}>
|
||||
<View style={{ flex: 1, gap: 10, marginTop: 16 }}>
|
||||
<CreateLyricsHeader title="À qui s’adresse ta chanson ?" />
|
||||
<CustomInput placeholder="Ecrire mon contexte" height={283} />
|
||||
</View>
|
||||
|
||||
@@ -5,7 +5,7 @@ import CustomInput from "./components/CustomInput";
|
||||
|
||||
const SpecificityContext = () => {
|
||||
return (
|
||||
<View style={{ flex: 1, gap: 10 }}>
|
||||
<View style={{ flex: 1, gap: 10, marginTop: 16 }}>
|
||||
<CreateLyricsHeader
|
||||
title="Spécificité du contexte"
|
||||
subTitle="Dis-nous en un peu plus pour qu’on puisse mieux t’aider."
|
||||
|
||||
@@ -6,18 +6,27 @@ import { Palette } from "../../../styles";
|
||||
import { FONT_FAMILY } from "../../../styles/Fonts";
|
||||
import useLayoutType from "../../../hooks/useLayoutType";
|
||||
|
||||
const CreateLyricsHeader = ({ title = "", subTitle = "", height = 45 }) => {
|
||||
const CreateLyricsHeader = ({
|
||||
title = "",
|
||||
subTitle = "",
|
||||
children,
|
||||
colors = ["#FFFFFF00", "#FFFFFF"],
|
||||
gradientProps,
|
||||
intensity = 40,
|
||||
tint = "dark",
|
||||
}) => {
|
||||
const [onLayout, setOnLayout] = useState(null);
|
||||
const { isWeb } = useLayoutType();
|
||||
|
||||
return (
|
||||
<View style={{ paddingTop: isWeb ? 10 : 0 }}>
|
||||
<View>
|
||||
<BorderGradient
|
||||
gradientProps={{
|
||||
colors: ["#FFFFFF00", "#FFFFFF"],
|
||||
colors: colors,
|
||||
locations: [0.2, 1],
|
||||
start: { x: 0, y: 0 },
|
||||
end: { x: 1, y: 0 },
|
||||
...{ gradientProps },
|
||||
}}
|
||||
style={{
|
||||
height: isWeb ? onLayout?.height + 2 : onLayout?.height,
|
||||
@@ -41,22 +50,25 @@ const CreateLyricsHeader = ({ title = "", subTitle = "", height = 45 }) => {
|
||||
onPress={() => console.log("PRESSED")}
|
||||
>
|
||||
<BlurView
|
||||
intensity={20}
|
||||
intensity={intensity}
|
||||
tint={tint}
|
||||
style={{
|
||||
paddingHorizontal: 12,
|
||||
paddingVertical: 8,
|
||||
gap: 4,
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 22,
|
||||
color: Palette.white,
|
||||
fontFamily: FONT_FAMILY.InterSemiBold,
|
||||
}}
|
||||
>
|
||||
{title}
|
||||
</Text>
|
||||
{title && (
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 22,
|
||||
color: Palette.white,
|
||||
fontFamily: FONT_FAMILY.InterSemiBold,
|
||||
}}
|
||||
>
|
||||
{title}
|
||||
</Text>
|
||||
)}
|
||||
{subTitle && (
|
||||
<Text
|
||||
style={{
|
||||
@@ -68,6 +80,7 @@ const CreateLyricsHeader = ({ title = "", subTitle = "", height = 45 }) => {
|
||||
{subTitle}
|
||||
</Text>
|
||||
)}
|
||||
{children}
|
||||
</BlurView>
|
||||
</Pressable>
|
||||
</View>
|
||||
|
||||
Reference in New Issue
Block a user