New favicon

This commit is contained in:
2020-08-12 20:19:41 +02:00
parent e4a4d3951d
commit 9d967a2b37
5 changed files with 192 additions and 146 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.4 KiB

View File

@@ -16,6 +16,7 @@ import StepLabel from "@material-ui/core/StepLabel";
import Paper from "@material-ui/core/Paper";
import Autocomplete from "@material-ui/lab/Autocomplete";
import InputAdornment from "@material-ui/core/InputAdornment";
import validator from "validator";
// ICONS
import FastfoodIcon from "@material-ui/icons/Fastfood";
import LocationCityIcon from "@material-ui/icons/LocationCity";
@@ -23,6 +24,9 @@ import PhoneIcon from "@material-ui/icons/Phone";
import FacebookIcon from "@material-ui/icons/Facebook";
import TwitterIcon from "@material-ui/icons/Twitter";
import LanguageIcon from "@material-ui/icons/Language";
import ButtonPrimary from "../Input/ButtonPrimary";
// SETUP
const useStyles = makeStyles((theme) => ({
root: {
@@ -81,9 +85,15 @@ export default function NewRestaurant() {
const initialState = {
name: "",
city: "",
adress: "",
hoursFrom: "",
hoursTo: "",
description: "",
tags: [],
phone: "",
facebook: "",
twitter: "",
www: "",
};
const steps = ["Informacje", "Zdjęcie", "Lokalizacja"];
const [state, setState] = useState(initialState);
@@ -101,6 +111,22 @@ export default function NewRestaurant() {
"Dowozimy",
];
// HANDLERS
const handleNextButton = () => {
if (activeStep < 2) {
setActiveStep(activeStep + 1);
console.log(activeStep);
}
};
const handlePreviousButton = () => {
setActiveStep(activeStep - 1);
console.log(activeStep);
};
// COMPONENTS
return (
<div>
<Dialog
@@ -125,154 +151,175 @@ export default function NewRestaurant() {
</Step>
))}
</Stepper>
<Paper variant="outlined">
<div className="newRestaurant-content">
<TextField
className={styles.textInput}
required
label="Nazwa lokalu"
variant="outlined"
onChange={(event) =>
(state.restaurantName = event.target.value)
}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<FastfoodIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
required
label="Miasto"
variant="outlined"
onChange={(event) =>
(state.restaurantName = event.target.value)
}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<LocationCityIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
label="Otwarcie"
type="time"
defaultValue="07:00"
onChange={(event) => (state.hoursFrom = event.target.value)}
variant="outlined"
className={styles.timePicker}
InputLabelProps={{
shrink: true,
}}
inputProps={{
step: 300, // 5 min
}}
/>
<TextField
label="Zamknięcie"
type="time"
defaultValue="22:00"
onChange={(event) => (state.hoursTo = event.target.value)}
variant="outlined"
className={styles.timePicker}
InputLabelProps={{
shrink: true,
}}
inputProps={{
step: 300, // 5 min
}}
/>
{activeStep === 0 && (
<Paper variant="outlined">
<div className="newRestaurant-content-fullwidth">
<TextField
className={styles.textInputFullWidth}
fullWidth
label="Opis"
multiline
rows={3}
required
label="Nazwa lokalu"
variant="outlined"
/>
<Autocomplete
multiple
options={availableTags}
renderInput={(params) => (
<TextField
{...params}
className={styles.textInputFullWidth}
variant="outlined"
label="Tagi"
placeholder="Dodaj tagi"
/>
)}
onChange={(event) => (state.name = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<FastfoodIcon color="primary" />
</InputAdornment>
),
}}
/>
</div>
<TextField
className={styles.textInput}
label="Telefon"
variant="outlined"
onChange={(event) =>
(state.restaurantName = event.target.value)
}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<PhoneIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
label="Facebook"
variant="outlined"
onChange={(event) =>
(state.restaurantName = event.target.value)
}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<FacebookIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
label="Twitter"
variant="outlined"
onChange={(event) =>
(state.restaurantName = event.target.value)
}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<TwitterIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
label="www"
variant="outlined"
onChange={(event) =>
(state.restaurantName = event.target.value)
}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<LanguageIcon color="primary" />
</InputAdornment>
),
}}
/>
</div>
</Paper>
<ButtonSecondary text={activeStep === 2 ? "Dodaj lokal" : "Dalej"} />
<div className="newRestaurant-content">
<TextField
className={styles.textInput}
required
label="Miasto"
variant="outlined"
onChange={(event) => (state.city = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<LocationCityIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
required
label="Adres"
variant="outlined"
onChange={(event) => (state.adress = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<LocationCityIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
label="Otwarcie"
type="time"
defaultValue="07:00"
onChange={(event) => (state.hoursFrom = event.target.value)}
variant="outlined"
className={styles.timePicker}
InputLabelProps={{
shrink: true,
}}
inputProps={{
step: 300, // 5 min
}}
/>
<TextField
label="Zamknięcie"
type="time"
defaultValue="22:00"
onChange={(event) => (state.hoursTo = event.target.value)}
variant="outlined"
className={styles.timePicker}
InputLabelProps={{
shrink: true,
}}
inputProps={{
step: 300, // 5 min
}}
/>
<div className="newRestaurant-content-fullwidth">
<TextField
className={styles.textInputFullWidth}
fullWidth
label="Opis"
onChange={(event) =>
(state.description = event.target.value)
}
multiline
rows={3}
variant="outlined"
/>
<Autocomplete
multiple
options={availableTags}
onChange={(event, values) =>
setState({ ...state, tags: values })
}
renderInput={(params) => (
<TextField
{...params}
className={styles.textInputFullWidth}
variant="outlined"
label="Tagi"
placeholder="Dodaj tagi"
/>
)}
/>
</div>
<TextField
className={styles.textInput}
label="Telefon"
type="tel"
variant="outlined"
onChange={(event) => (state.phone = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<PhoneIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
label="Facebook"
variant="outlined"
onChange={(event) => (state.facebook = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<FacebookIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
label="Twitter"
variant="outlined"
onChange={(event) => (state.twitter = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<TwitterIcon color="primary" />
</InputAdornment>
),
}}
/>
<TextField
className={styles.textInput}
label="www"
variant="outlined"
onChange={(event) => (state.www = event.target.value)}
InputProps={{
startAdornment: (
<InputAdornment position="start">
<LanguageIcon color="primary" />
</InputAdornment>
),
}}
/>
</div>
</Paper>
)}
{activeStep !== 0 && (
<ButtonPrimary onClick={handlePreviousButton} text="Cofnij" />
)}
<ButtonSecondary
onClick={handleNextButton}
text={activeStep === 2 ? "Dodaj lokal" : "Dalej"}
/>
</DialogContent>
</Dialog>
</div>

View File

@@ -4,13 +4,12 @@ import Button from "@material-ui/core/Button";
const StyledButton = withStyles({
root: {
background: "none",
color: "white",
border: "solid 1px white",
backgroundColor: "#696969",
color: "#262626",
margin: "16px 16px 16px 0px",
padding: "8px 12px 8px 12px",
"&:hover": {
color: "white",
backgroundColor: "#808080",
},
},
label: {
@@ -19,5 +18,5 @@ const StyledButton = withStyles({
})(Button);
export default function ButtonPrimary(props) {
return <StyledButton>{props.text}</StyledButton>;
return <StyledButton onClick={props.onClick}>{props.text}</StyledButton>;
}