web client v0.8

src/components/Input/InputLunchMenuHours.js

@@ -0,0 +1,57 @@
+import React from "react";
+import TextField from "@material-ui/core/TextField";
+import Checkbox from "@material-ui/core/Checkbox";
+import FormControlLabel from "@material-ui/core/FormControlLabel";
+import { makeStyles } from "@material-ui/core/styles";
+
+const useStyles = makeStyles((theme) => ({
+  timePicker: {
+    "& .MuiInputBase-root": {
+      color: "#bbbbbb",
+    },
+    "& .MuiInputLabel-root": {
+      color: "#bbbbbb",
+    },
+  },
+  checkbox: {
+    marginLeft: theme.spacing(1),
+    "& .MuiFormControlLabel-label": {
+      color: "#979797",
+      fontSize: "14px",
+    },
+  },
+}));
+
+export default function InputWorkingHoursSingle(props) {
+  const handleChangeValue = (event) => {
+    props.changeValue(event.target.value);
+  };
+  const handleCheckbox = () => {
+    if (!props.off) {
+      props.changeValue("");
+    } else {
+      props.changeValue("13:00 - 15:00");
+    }
+  };
+
+  const classes = useStyles();
+  return (
+    <div className="workingHours-day">
+      <h5>Lunch menu</h5>
+      <TextField
+        value={props.hours}
+        variant="outlined"
+        onChange={handleChangeValue}
+        className={classes.timePicker}
+        margin="dense"
+      />
+      <FormControlLabel
+        className={classes.checkbox}
+        control={
+          <Checkbox onClick={handleCheckbox} checked={props.off} name="brak" />
+        }
+        label="Wyłącz"
+      />
+    </div>
+  );
+}