leonm/musicland
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Philip Cesar Garay
2025-08-06 21:06:01 +08:00
parent d08ec7b778
commit 40e877774b
33 changed files with 1148 additions and 517 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/screens/Writing/Lyrics.js
+46 -65
View File
@@ -1,79 +1,68 @@
import { View, Text, Image, StyleSheet, ScrollView } from "react-native";
import React from "react";
import { View, Text, ScrollView } from "react-native";
import React, { useState } from "react";
import Page from "../../layouts/Page";
import { ai } from "../../assets";
import MusicLandHeader from "../../components/MusicLandHeader";
import { goBack, navigate } from "../../navigation/NavigationService";
import { gutters, Palette } from "../../styles";
import BorderGradientButton from "../../components/BorderGradientButton";
import GradientButton from "../../components/GradientButton";
import { Routes } from "../../navigation";
import BorderGradient from "../../components/BorderGradient/BorderGradient";
import { BlurView } from "expo-blur";
import CustomInput from "./components/CustomInput";
import { FONT_FAMILY } from "../../styles/Fonts";
import ItemContainer from "../../components/ItemContainer/ItemContainer";
const Lyrics = () => {
const [containerLayout, setContainerLayout] = useState(null);
return (
<Page headerType="NONE">
<MusicLandHeader onPressBack={goBack} progress={95} />
<View style={{ flex: 1, marginTop: 16, paddingBottom: gutters, gap: 48 }}>
<BorderGradient
gradientProps={{
colors: ["#FFFFFF00", "#FFFFFF"],
start: { x: 0, y: 0 },
end: { x: 0, y: 1 },
}}
style={styles.borderGradientStyle}
>
<View style={{ borderRadius: 20, overflow: "hidden", flex: 1 }}>
<BlurView intensity={40} style={{ flex: 1 }}>
<ScrollView
contentContainerStyle={{
paddingHorizontal: 14,
paddingVertical: 10,
gap: 10,
flexGrow: 1,
<View
style={{
flex: 1,
marginTop: 16,
gap: 48,
}}
onLayout={(e) => setContainerLayout(e.nativeEvent.layout)}
>
<ItemContainer height={containerLayout?.height}>
<ScrollView
contentContainerStyle={{
paddingHorizontal: 14,
paddingVertical: 10,
gap: 10,
flexGrow: 1,
}}
>
<CustomInput label="Titre" placeholder="Titre" height={45} />
<View
style={{
height: 45,
justifyContent: "center",
backgroundColor: "#00000080",
borderRadius: 14,
paddingHorizontal: 12,
marginTop: 20,
}}
>
<Text
style={{
fontSize: 16,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
<CustomInput label="Titre" placeholder="Titre" height={45} />
<View
style={{
height: 45,
justifyContent: "center",
backgroundColor: "#00000080",
borderRadius: 14,
paddingHorizontal: 12,
marginTop: 20,
}}
>
<Text
style={{
fontSize: 16,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
Introduction instrumentale longue
</Text>
</View>
<CustomInput
label="Couplet"
placeholder="Couplet"
height={225}
/>
<CustomInput
label="Refrain"
placeholder="Refrain"
height={170}
/>
</ScrollView>
</BlurView>
</View>
</BorderGradient>
Introduction instrumentale longue
</Text>
</View>
<CustomInput label="Couplet" placeholder="Couplet" height={225} />
<CustomInput label="Refrain" placeholder="Refrain" height={170} />
</ScrollView>
</ItemContainer>
</View>
<View
style={{
paddingTop: gutters,
paddingBottom: gutters * 2,
paddingHorizontal: gutters,
gap: 12,
@@ -90,11 +79,3 @@ const Lyrics = () => {
};
export default Lyrics;
const styles = StyleSheet.create({
borderGradientStyle: {
height: "100%",
borderWidth: 1,
borderRadius: 20,
},
});