40 lines
915 B
JavaScript
40 lines
915 B
JavaScript
import { View, TouchableOpacity, StyleSheet } from "react-native";
|
|
import { useSettings } from "../context/SettingsContext";
|
|
|
|
const COLORS = ["#5784BA", "#9C6ADE", "#FF6B6B", "#4ECDC4", "#45B7D1"];
|
|
|
|
export default function ColorPicker({ selectedColor, onColorSelect }) {
|
|
return (
|
|
<View style={styles.container}>
|
|
{COLORS.map((color) => (
|
|
<TouchableOpacity
|
|
key={color}
|
|
style={[
|
|
styles.colorOption,
|
|
{ backgroundColor: color },
|
|
selectedColor === color && styles.selected,
|
|
]}
|
|
onPress={() => onColorSelect(color)}
|
|
/>
|
|
))}
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flexDirection: "row",
|
|
gap: 10,
|
|
},
|
|
colorOption: {
|
|
width: 30,
|
|
height: 30,
|
|
borderRadius: 15,
|
|
borderWidth: 2,
|
|
borderColor: "transparent",
|
|
},
|
|
selected: {
|
|
borderColor: "black",
|
|
},
|
|
});
|