web style

This commit is contained in:
2025-10-01 14:07:13 +02:00
parent 7ee47a1943
commit 2908afc259
4 changed files with 222 additions and 131 deletions
+4 -3
View File
@@ -1,9 +1,9 @@
import { View } from "react-native";
import React, { useState } from "react";
import CreateLyricsHeader from "./components/CreateLyricsHeader";
import { EMOTION_CONVEY } from "../../data/data";
import { View } from "react-native";
import ItemContainer from "../../components/ItemContainer/ItemContainer";
import ListSelection from "../../components/ListSelection/ListSelection";
import { EMOTION_CONVEY } from "../../data/data";
import CreateLyricsHeader from "./components/CreateLyricsHeader";
const EmotionConvey = ({
selected: selectedProp,
@@ -29,6 +29,7 @@ const EmotionConvey = ({
>
<ItemContainer height={containerLayout?.height}>
<ListSelection
disableHover
options={EMOTION_CONVEY}
variant="emotion"
selected={selected}
@@ -66,29 +66,31 @@ const CreateLyricsHeader = ({
...blurViewStyle,
}}
>
{title && (
<Text
style={{
fontSize: 22,
color: Palette.white,
fontFamily: FONT_FAMILY.InterSemiBold,
}}
>
{title}
</Text>
)}
{subTitle && (
<Text
style={{
fontSize: 12,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
{subTitle}
</Text>
)}
{children}
<>
{title && (
<Text
style={{
fontSize: 22,
color: Palette.white,
fontFamily: FONT_FAMILY.InterSemiBold,
}}
>
{title}
</Text>
)}
{subTitle && (
<Text
style={{
fontSize: 12,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
{subTitle}
</Text>
)}
{children}
</>
</View>
) : (
<BlurView
@@ -104,29 +106,31 @@ const CreateLyricsHeader = ({
// Platform.OS !== "ios" ? "dimezisBlurView" : "none"
// }
>
{title && (
<Text
style={{
fontSize: 22,
color: Palette.white,
fontFamily: FONT_FAMILY.InterSemiBold,
}}
>
{title}
</Text>
)}
{subTitle && (
<Text
style={{
fontSize: 12,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
{subTitle}
</Text>
)}
{children}
<>
{title && (
<Text
style={{
fontSize: 22,
color: Palette.white,
fontFamily: FONT_FAMILY.InterSemiBold,
}}
>
{title}
</Text>
)}
{subTitle && (
<Text
style={{
fontSize: 12,
color: Palette.white,
fontFamily: FONT_FAMILY.InterRegular,
}}
>
{subTitle}
</Text>
)}
{children}
</>
</BlurView>
)}
</View>
+38 -36
View File
@@ -1,5 +1,5 @@
import { View, Text, TextInput } from "react-native";
import React from "react";
import { Text, TextInput, View } from "react-native";
import { Palette } from "../../../styles";
import { FONT_FAMILY } from "../../../styles/Fonts";
@@ -17,44 +17,46 @@ const CustomInput = ({
}) => {
return (
<View style={{ gap: 8 }} onLayout={onLayout}>
{label && (
<Text
<>
{label && (
<Text
style={{
fontSize: 16,
color: Palette.white,
fontFamily: FONT_FAMILY.InterMedium,
}}
>
{label}
</Text>
)}
<View
style={{
fontSize: 16,
color: Palette.white,
fontFamily: FONT_FAMILY.InterMedium,
backgroundColor: Palette.white,
height,
padding: 12,
borderRadius: 12,
}}
>
{label}
</Text>
)}
<View
style={{
backgroundColor: Palette.white,
height,
padding: 12,
borderRadius: 12,
}}
>
<TextInput
placeholder={placeholder}
placeholderTextColor={Palette.grayMid}
value={value}
onChangeText={setValue}
style={{
height: "100%",
fontSize: 16,
color: Palette.black,
fontFamily: FONT_FAMILY.InterRegularItalic,
}}
multiline={multiline}
numberOfLines={multiline ? undefined : 1}
maxLength={maxLength}
textAlignVertical={multiline ? "top" : "center"}
onFocus={onFocus}
onBlur={onBlur}
/>
</View>
<TextInput
placeholder={placeholder}
placeholderTextColor={Palette.grayMid}
value={value}
onChangeText={setValue}
style={{
height: "100%",
fontSize: 16,
color: Palette.black,
fontFamily: FONT_FAMILY.InterRegularItalic,
}}
multiline={multiline}
numberOfLines={multiline ? undefined : 1}
maxLength={maxLength}
textAlignVertical={multiline ? "top" : "center"}
onFocus={onFocus}
onBlur={onBlur}
/>
</View>
</>
</View>
);
};