1 | import styled from 'styled-components';
|
---|
2 | import { Typography, Divider } from '@mui/material';
|
---|
3 | import MapOutlinedIcon from '@mui/icons-material/MapOutlined';
|
---|
4 | import EqualizerOutlinedIcon from '@mui/icons-material/EqualizerOutlined';
|
---|
5 |
|
---|
6 | export const NamesWrapper = styled.div`
|
---|
7 | margin-bottom: 10px;
|
---|
8 | text-align: center;
|
---|
9 | display: flex;
|
---|
10 | flex-direction: row;
|
---|
11 | justify-content: space-between;
|
---|
12 | align-items: center;
|
---|
13 | padding: 10px 175px;
|
---|
14 | `;
|
---|
15 |
|
---|
16 | export const ParkingAndZoneName = styled(Typography).attrs((props) => ({
|
---|
17 | fontSize: '2rem',
|
---|
18 | fontWeight: '600',
|
---|
19 | margin: 0,
|
---|
20 | color: `${props.theme.palette.primary.main}`,
|
---|
21 | }))``;
|
---|
22 |
|
---|
23 | export const DividerUnderNames = styled(Divider).attrs({
|
---|
24 | variant: 'middle',
|
---|
25 | sx: {
|
---|
26 | margin: '0 160px',
|
---|
27 | borderWidth: '2px',
|
---|
28 | borderBottomWidth: 'thin',
|
---|
29 | },
|
---|
30 | })``;
|
---|
31 |
|
---|
32 | export const MapsIcon = styled(MapOutlinedIcon).attrs((props) => ({
|
---|
33 | sx: {
|
---|
34 | width: props.$isactive ? '60px' : '50px',
|
---|
35 | height: props.$isactive ? '60px' : '50px',
|
---|
36 | color: props.$isactive ? `${props.theme.palette.primary.main}` : '',
|
---|
37 | },
|
---|
38 | }))``;
|
---|
39 |
|
---|
40 | export const ComponentIcon = styled(EqualizerOutlinedIcon).attrs((props) => ({
|
---|
41 | sx: {
|
---|
42 | width: props.$isactive ? '60px' : '50px',
|
---|
43 | height: props.$isactive ? '60px' : '50px',
|
---|
44 | color: props.$isactive ? `${props.theme.palette.primary.main}` : '',
|
---|
45 | },
|
---|
46 | }))``;
|
---|
47 |
|
---|
48 | export const NavigationIconsWrapper = styled.div`
|
---|
49 | height: 86px;
|
---|
50 | width: 160px;
|
---|
51 | display: flex;
|
---|
52 | justify-content: space-between;
|
---|
53 | align-self: center;
|
---|
54 | `;
|
---|
55 |
|
---|
56 | export const MainSection = styled.div`
|
---|
57 | height: 100%;
|
---|
58 | `;
|
---|