70 lines
2.0 KiB
JavaScript
70 lines
2.0 KiB
JavaScript
import { BlurView } from "expo-blur";
|
|
import React, { useState } from "react";
|
|
import { Platform, Text, View } from "react-native";
|
|
import { responsiveHeight } from "react-native-responsive-dimensions";
|
|
import { background } from "../../assets";
|
|
import AppCheckbox from "../../components/AppCheckbox";
|
|
import { isWeb } from "../../hooks/useLayoutType";
|
|
import Page from "../../layouts/Page";
|
|
import { gutters, Palette } from "../../styles";
|
|
import { FONT_FAMILY } from "../../styles/Fonts";
|
|
|
|
const LANGUAGE = ["Anglais", "Français", "Chinois", "Japonais", "Coreen"];
|
|
|
|
const Language = () => {
|
|
const [selected, setSelected] = useState("Français");
|
|
|
|
return (
|
|
<Page
|
|
headerType="NAVIGATE"
|
|
title="Paramètres"
|
|
backgroundImg={background.profileBG}
|
|
contentContainerStyle={{
|
|
paddingBottom: gutters * 4,
|
|
}}
|
|
containerStyle={{
|
|
backgroundColor: isWeb ? "transparent" : "#0000004D",
|
|
}}
|
|
>
|
|
<View style={{ flex: 1, marginTop: responsiveHeight(2) }}>
|
|
<BlurView
|
|
intensity={Platform.OS !== "ios" ? 10 : 20}
|
|
style={{
|
|
paddingVertical: 10,
|
|
paddingHorizontal: 20,
|
|
backgroundColor: Palette.glass,
|
|
gap: 10,
|
|
borderRadius: 20,
|
|
overflow: "hidden",
|
|
}}
|
|
// experimentalBlurMethod={
|
|
// Platform.OS !== "ios" ? "dimezisBlurView" : "none"
|
|
// }
|
|
>
|
|
<Text
|
|
style={{
|
|
fontSize: 20,
|
|
color: Palette.white,
|
|
fontFamily: FONT_FAMILY.HelveticaNeueMedium,
|
|
}}
|
|
>
|
|
Langue
|
|
</Text>
|
|
<View style={{ gap: 12 }}>
|
|
{LANGUAGE.map((item, index) => (
|
|
<AppCheckbox
|
|
key={index}
|
|
label={item}
|
|
onPress={() => setSelected(item)}
|
|
selected={selected === item}
|
|
/>
|
|
))}
|
|
</View>
|
|
</BlurView>
|
|
</View>
|
|
</Page>
|
|
);
|
|
};
|
|
|
|
export default Language;
|