export const HouseOptions = ({title, onChange, onChangeColor}) => {
const handleNameChange = (event) => {
onChange(event.target.value)
}
const colorChange = (event) => {
onChangeColor(event.target.value)
}
return (
<div className={styles.main}>
<div className={styles.h1}>{title}</div>
<button className={styles.button}>delete</button>
{/*суда нужно removeHouse добавить*/}
<div className={styles.container}>
<div className={styles.flexContainer}>
<div className={styles.text}>Floors:</div>
<input className={styles.input} onChange={handleNameChange}/>
</div>
<div className={styles.flexContainer}>
<div className={styles.text}>Color</div>
<select name="choice" onChange={colorChange}>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
</select>
</div>
</div>
<input type={"range"} min={1} max={10} className={styles.slider}/>
</div>
);
};
export default HouseOptions;