index.css (4365B)
1 * { 2 box-sizing: border-box; 3 } 4 .header-panel { 5 background-color: #ffb400; 6 height: 144px; 7 position: relative; 8 z-index: 3; 9 } 10 .header-panel div { 11 position: relative; 12 height: 100%; 13 } 14 .header-panel h1 { 15 color: #FFF; 16 font-size: 20px; 17 font-weight: 400; 18 position: absolute; 19 bottom: 10px; 20 padding-left: 35px; 21 } 22 .menu { 23 position:fixed !important; 24 width:27% !important; 25 height:75% !important; 26 overflow: auto !important; 27 padding: 0 !important; 28 } 29 .menu, .menu * { 30 -webkit-user-select: none !important; 31 -moz-user-select: none !important; 32 user-select: none !important; 33 } 34 .menu ul { 35 padding: 0 !important; 36 margin: 7px 0 !important; 37 } 38 .menu ul li { 39 list-style: none !important; 40 padding: 20px 0 20px 50px !important; 41 font-size: 15px !important; 42 font-weight: normal !important; 43 cursor: pointer !important; 44 } 45 .menu ul li.active { 46 background-color: #dedede !important; 47 position: relative !important; 48 } 49 .menu ul li a { 50 color: rgb(51, 51, 51) !important; 51 text-decoration: none !important; 52 } 53 .pages { 54 position: absolute; 55 top: 0; 56 right: 0; 57 z-index: 4; 58 padding: 0; 59 overflow: auto; 60 } 61 .pages > div { 62 padding: 0 5px; 63 padding-top: 64px; 64 } 65 .pages .header { 66 color: rgb(0, 158, 224); 67 font-size: 24px; 68 font-weight: normal; 69 margin-top: 5px; 70 margin-bottom: 60px; 71 letter-spacing: 1.20000004768372px; 72 } 73 .page { 74 transform: translateY(1080px); 75 transition: transform 0 linear; 76 display: none; 77 opacity: 0; 78 font-size: 16px; 79 } 80 .page.active { 81 transform: translateY(0px); 82 transition: all 0.3s ease-out; 83 display: block; 84 opacity: 1; 85 } 86 #opensource { 87 color: rgba(0, 0, 0, 0.62); 88 position: fixed; 89 margin-top: 50px; 90 margin-left: 50px; 91 z-index: 100; 92 } 93 #source-modal h4 { 94 color: black; 95 } 96 #checkbox .sample1 label { 97 font-weight: bold; 98 } 99 #checkbox .hint { 100 padding-left: 45px; 101 padding-top: 20px; 102 font-weight: 400; 103 } 104 #checkbox .sample1 { 105 padding-bottom: 20px; 106 } 107 #checkbox h2 { 108 font-size: 18.7199993133545px; 109 font-weight: bold; 110 margin-bottom: 30px; 111 } 112 #checkbox .sample2 { 113 width: 300px; 114 clear: both; 115 font-weight: 400; 116 } 117 #checkbox .sample2 { 118 padding: 10px 0; 119 } 120 #checkbox .sample2 .text { 121 display: inline-block; 122 } 123 #checkbox .sample2 .checkbox { 124 float: right; 125 margin: 0; 126 } 127 #radio-button h2 { 128 font-size: 18.7199993133545px; 129 font-weight: bold; 130 margin-bottom: 30px; 131 margin-top: 50px; 132 } 133 #radio-button .radio { 134 margin: 20px 10px; 135 } 136 #toggle-button h2 { 137 font-size: 18.7199993133545px; 138 font-weight: bold; 139 margin-bottom: 30px; 140 margin-top: 50px; 141 } 142 #toggle-button .togglebutton label { 143 margin: 20px 10px; 144 width: 200px; 145 } 146 #toggle-button .togglebutton .toggle { 147 float: right; 148 } 149 #input h2 { 150 padding: 14px; 151 font-size: 16px; 152 font-weight: 400; 153 } 154 #input .inputs { 155 width: 80%; 156 } 157 #input .form-control-wrapper { 158 margin: 30px 0; 159 } 160 #progress-bar h2 { 161 font-size: 18.7199993133545px; 162 font-weight: bold; 163 margin-bottom: 30px; 164 } 165 #slider .sample1, #slider .sample2 { 166 padding: 20px 0; 167 background-color: #f0f0f0; 168 margin-bottom: 20px; 169 } 170 #slider .sample2 { 171 height: 150px; 172 } 173 #slider .sample2 .slider { 174 margin: 0 40px; 175 } 176 #slider h2 { 177 padding: 14px; 178 margin: 0; 179 font-size: 16px; 180 font-weight: 400; 181 } 182 #slider .slider { 183 margin: 15px; 184 } 185 #button h2 { 186 padding: 14px; 187 margin: 0; 188 font-size: 16px; 189 font-weight: 400; 190 } 191 #floating-action-button .btn { 192 margin: 20px; 193 } 194 #floating-action-button h2 { 195 padding: 14px; 196 margin: 0; 197 font-size: 16px; 198 font-weight: 400; 199 } 200 #dropdown h2 { 201 padding: 14px; 202 margin: 0; 203 font-size: 16px; 204 font-weight: 400; 205 } 206 #dropdown .dropdown { 207 font-size: 30px; 208 padding: 20px; 209 } 210 #dropdown-menu h2 { 211 padding: 14px; 212 margin: 0; 213 font-size: 16px; 214 font-weight: 400; 215 } 216 #dropdown-menu .sample { 217 width: 200px; 218 } 219 #dropdown-menu .form-group { 220 margin: 30px 0; 221 } 222 #dialog h2 { 223 padding: 14px; 224 margin: 0; 225 font-size: 16px; 226 font-weight: 400; 227 } 228 #shadow h2 { 229 padding: 14px; 230 margin: 0; 231 font-size: 16px; 232 font-weight: 400; 233 } 234 #shadow .sample { 235 width: 100px; 236 height: 100px; 237 margin: 16px; 238 padding: 16px; 239 display: inline-block; 240 } 241 #shadow-sample2 { 242 display: inline-block; 243 width: 100px; 244 height: 100px; 245 margin: 16px; 246 padding: 16px; 247 cursor: pointer; 248 -webkit-user-select: none; 249 -moz-user-select: none; 250 user-select: none; 251 } 252 #shadow-sample3 { 253 display: inline-block; 254 width: 100px; 255 height: 100px; 256 margin: 16px; 257 padding: 16px; 258 border-radius: 100px; 259 cursor: pointer; 260 -webkit-user-select: none; 261 -moz-user-select: none; 262 user-select: none; 263 }