Philip Cesar Garay
105 lines
3.1 KiB
JavaScript
105 lines
3.1 KiB
JavaScript
import { View, Text, Image } from "react-native";
|
||
import React from "react";
|
||
import Page from "../../layouts/Page";
|
||
import { background, icons, img } from "../../assets";
|
||
import MusicLandHeader from "../../components/MusicLandHeader";
|
||
import { goBack, navigate } from "../../navigation/NavigationService";
|
||
import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
|
||
import { gutters, Palette, Style } from "../../styles";
|
||
import BorderGradientButton from "../../components/BorderGradientButton";
|
||
import GradientButton from "../../components/GradientButton";
|
||
import { Routes } from "../../navigation";
|
||
import { FONT_FAMILY } from "../../styles/Fonts";
|
||
|
||
const PouchReady = () => {
|
||
return (
|
||
<Page backgroundImg={background.studioBG2} headerType="NONE">
|
||
<MusicLandHeader onPressBack={goBack} progress={72} />
|
||
<View style={{ flex: 1, marginTop: 16 }}>
|
||
<CreateLyricsHeader
|
||
title="Ta pochette est prête!"
|
||
subTitle="Qu’en penses-tu ?"
|
||
/>
|
||
<View style={{ flex: 1, ...Style.containerCenter }}>
|
||
<View style={{ width: "80%", position: "relative" }}>
|
||
<Image
|
||
source={img.placeholder}
|
||
style={{
|
||
width: "100%",
|
||
height: 300,
|
||
borderRadius: 20,
|
||
transform: [{ rotateY: "180deg" }],
|
||
}}
|
||
/>
|
||
<View
|
||
style={{
|
||
position: "absolute",
|
||
alignSelf: "center",
|
||
alignItems: "center",
|
||
top: 10,
|
||
}}
|
||
>
|
||
<Text
|
||
style={{
|
||
fontSize: 22,
|
||
color: Palette.white,
|
||
fontFamily: FONT_FAMILY.InterSemiBold,
|
||
}}
|
||
>
|
||
Lust for Life
|
||
</Text>
|
||
<Text
|
||
style={{
|
||
fontSize: 14,
|
||
color: Palette.gray,
|
||
fontFamily: FONT_FAMILY.InterRegular,
|
||
}}
|
||
>
|
||
Lana del Rey
|
||
</Text>
|
||
</View>
|
||
<View
|
||
style={{
|
||
position: "absolute",
|
||
alignItems: "center",
|
||
bottom: 10,
|
||
width: "100%",
|
||
}}
|
||
>
|
||
<Image
|
||
source={icons.musicLandLogo}
|
||
style={{ width: "100%", height: 30 }}
|
||
resizeMode="contain"
|
||
/>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
<View
|
||
style={{
|
||
paddingBottom: gutters * 2,
|
||
width: "80%",
|
||
alignSelf: "center",
|
||
gap: 12,
|
||
}}
|
||
>
|
||
<BorderGradientButton
|
||
title="Regénérer"
|
||
icon={icons.stars}
|
||
onPress={() =>
|
||
navigate(Routes.Regenerate, {
|
||
progress: 72,
|
||
})
|
||
}
|
||
/>
|
||
<GradientButton
|
||
title="Valider"
|
||
onPress={() => navigate(Routes.PhotoCover)}
|
||
/>
|
||
</View>
|
||
</Page>
|
||
);
|
||
};
|
||
|
||
export default PouchReady;
|