/
headerLinksStyle.jsx
111 lines (108 loc) · 2.33 KB
/
headerLinksStyle.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
import {
defaultFont,
dangerColor,
} from "assets/jss/material-dashboard-react.jsx";
import dropdownStyle from "assets/jss/material-dashboard-react/dropdownStyle.jsx";
const headerLinksStyle = theme => ({
...dropdownStyle(theme),
search: {
"& > div": {
marginTop: "0"
},
[theme.breakpoints.down("sm")]: {
margin: "10px 15px !important",
float: "none !important",
paddingTop: "1px",
paddingBottom: "1px",
padding: "0!important",
width: "60%",
marginTop: "40px",
"& input": {
color: "#FFFFFF"
}
}
},
linkText: {
zIndex: "4",
...defaultFont,
fontSize: "14px",
margin: "0px"
},
buttonLink: {
[theme.breakpoints.down("sm")]: {
display: "flex",
margin: "10px 15px 0",
width: "-webkit-fill-available",
"& svg": {
width: "24px",
height: "30px",
marginRight: "15px",
marginLeft: "-15px"
},
"& .fab,& .fas,& .far,& .fal,& .material-icons": {
fontSize: "24px",
lineHeight: "30px",
width: "24px",
height: "30px",
marginRight: "15px",
marginLeft: "-15px"
},
"& > span": {
justifyContent: "flex-start"
}
}
},
searchButton: {
[theme.breakpoints.down("sm")]: {
top: "-50px !important",
marginRight: "22px",
float: "right"
}
},
margin: {
zIndex: "4",
margin: "0"
},
searchIcon: {
width: "17px",
zIndex: "4"
},
notifications: {
zIndex: "4",
[theme.breakpoints.up("md")]: {
position: "absolute",
top: "2px",
border: "1px solid #FFF",
right: "4px",
fontSize: "9px",
background: dangerColor,
color: "#FFFFFF",
minWidth: "16px",
height: "16px",
borderRadius: "10px",
textAlign: "center",
lineHeight: "16px",
verticalAlign: "middle",
display: "block"
},
[theme.breakpoints.down("sm")]: {
...defaultFont,
fontSize: "14px",
marginRight: "8px"
}
},
manager: {
[theme.breakpoints.down("sm")]: {
width: "100%"
},
display: "inline-block"
},
searchWrapper: {
[theme.breakpoints.down("sm")]: {
width: "-webkit-fill-available",
margin: "10px 15px 0",
},
display: "inline-block"
}
});
export default headerLinksStyle;