Commit f9a2f64d17097fa810efaf86edd889a75f59e89d
- Diff rendering mode:
- inline
- side by side
mouchak/static/css/main.css
(245 / 0)
  | |||
24 | 24 | } | |
25 | 25 | body { | |
26 | 26 | font-size: 14px; | |
27 | overflow-y:scroll; | ||
27 | 28 | } | |
28 | 29 | ||
29 | 30 | /* | |
… | … | ||
184 | 184 | .container { | |
185 | 185 | /*margin: 0;*/ | |
186 | 186 | } | |
187 | |||
188 | /* side menu css */ | ||
189 | |||
190 | #page-content-wrapper { | ||
191 | visibility: hidden; | ||
192 | } | ||
193 | |||
194 | @media (max-width:767px) { | ||
195 | .wrapper { | ||
196 | padding-left: 70px; | ||
197 | } | ||
198 | .sidebar-wrapper { | ||
199 | left: 70px; | ||
200 | } | ||
201 | |||
202 | .wrapper.active { | ||
203 | padding-left: 150px; | ||
204 | } | ||
205 | |||
206 | .wrapper.active .sidebar-wrapper { | ||
207 | left: 150px; | ||
208 | width: 150px; | ||
209 | } | ||
210 | |||
211 | } | ||
212 | |||
213 | .link_disabled { | ||
214 | pointer-events: none; | ||
215 | cursor: none; | ||
216 | color: gray; | ||
217 | } | ||
218 | |||
219 | @media (max-width:450px) { | ||
220 | .thumbnail { | ||
221 | height: 350px; | ||
222 | } | ||
223 | |||
224 | .caption_heading { | ||
225 | height: 100px; | ||
226 | } | ||
227 | |||
228 | } | ||
229 | /* -------------end ----------- */ | ||
230 | |||
231 | .sidebar-wrapper { | ||
232 | /*transform*/ | ||
233 | |||
234 | -webkit-transform: translateZ(0); | ||
235 | -moz-transform: translateZ(0); | ||
236 | -o-transform: translateZ(0); | ||
237 | -ms-transform: translateZ(0); | ||
238 | transform: translateZ(0); | ||
239 | margin-left: -150px; | ||
240 | left: 20px; | ||
241 | margin-top:0px; | ||
242 | width: 165px; | ||
243 | // background: #222; | ||
244 | position: fixed; | ||
245 | height: 100%; | ||
246 | -ms-overflow-y: auto; | ||
247 | overflow-y: auto; | ||
248 | |||
249 | z-index: 10000; | ||
250 | -webkit-transition: all .4s ease 0s; | ||
251 | -moz-transition: all .4s ease 0s; | ||
252 | -o-transition: all .4s ease 0s; | ||
253 | -ms-transition: all .4s ease 0s; | ||
254 | transition: all .4s ease 0s; | ||
255 | } | ||
256 | |||
257 | .nav-collapse.collapse { | ||
258 | height: auto !important; | ||
259 | overflow: visible !important; | ||
260 | } | ||
261 | |||
262 | .page-content { | ||
263 | height: auto; | ||
264 | } | ||
265 | |||
266 | #page-content-wrapper { | ||
267 | padding-left: 0; | ||
268 | margin-left: 0; | ||
269 | width: 100%; | ||
270 | height: auto; | ||
271 | } | ||
272 | |||
273 | .sidebar-nav { | ||
274 | display: block; | ||
275 | float: left; | ||
276 | width: 150px; | ||
277 | list-style: none; | ||
278 | margin: 0; | ||
279 | padding: 0; | ||
280 | } | ||
281 | |||
282 | #sidebar_menu { | ||
283 | display: block; | ||
284 | float: left; | ||
285 | top: 0; | ||
286 | width: 150px; | ||
287 | list-style: none; | ||
288 | margin: 0; | ||
289 | padding: 0; | ||
290 | } | ||
291 | |||
292 | #sidebar_menu li,.sidebar-nav li { | ||
293 | line-height: 20px; | ||
294 | text-indent: 5px; | ||
295 | } | ||
296 | |||
297 | #sidebar_menu li a,.sidebar-nav li a { | ||
298 | // color: #999; | ||
299 | display: block; | ||
300 | float: left; | ||
301 | text-decoration: none; | ||
302 | width: 150px; | ||
303 | // background: #00FFFF; | ||
304 | // border-top: 1px solid #00FFFF; | ||
305 | // border-bottom: 1px solid #00FFFF; /*transition*/ | ||
306 | |||
307 | -webkit-transition: background .5s; | ||
308 | -moz-transition: background .5s; | ||
309 | -o-transition: background .5s; | ||
310 | -ms-transition: background .5s; | ||
311 | transition: background .5s; | ||
312 | } | ||
313 | |||
314 | #sidebar_menu li a:hover,.sidebar-nav li a:hover { | ||
315 | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; | ||
316 | filter: alpha(opacity=80); | ||
317 | opacity: .8; | ||
318 | text-decoration: none; | ||
319 | } | ||
320 | |||
321 | #sidebar_menu li a:active,#sidebar_menu li a:focus,.sidebar-nav li a:active,.sidebar-nav li a:focus { | ||
322 | text-decoration: none; | ||
323 | } | ||
324 | |||
325 | #sidebar_menu>.sidebar-brand { | ||
326 | height: 40px; | ||
327 | line-height: 30px; | ||
328 | font-size: 15px; | ||
329 | } | ||
330 | |||
331 | |||
332 | .active_nav a .fa { | ||
333 | color: #3cc; | ||
334 | |||
335 | } | ||
336 | |||
337 | .sidebar_name { | ||
338 | padding-top: 25px; | ||
339 | color: #fff; | ||
340 | -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; | ||
341 | filter: alpha(opacity=70); | ||
342 | opacity: .7; | ||
343 | } | ||
344 | |||
345 | .side_name { | ||
346 | visibility: hidden; | ||
347 | } | ||
348 | |||
349 | .side_name p { | ||
350 | font-size: 1.1em; | ||
351 | } | ||
352 | |||
353 | .side_name.active { | ||
354 | visibility: visible; | ||
355 | } | ||
356 | |||
357 | #side_download { | ||
358 | margin-top: 40px; | ||
359 | } | ||
360 | |||
361 | .content-header { | ||
362 | height: 65px; | ||
363 | line-height: 65px; | ||
364 | } | ||
365 | |||
366 | .content-header h1 { | ||
367 | margin: 0; | ||
368 | margin-left: 20px; | ||
369 | line-height: 65px; | ||
370 | display: inline-block; | ||
371 | } | ||
372 | |||
373 | .wrapper.active { | ||
374 | padding-left: 0px; | ||
375 | // border-right:2px solid #000; | ||
376 | // margin-left:90px; | ||
377 | } | ||
378 | |||
379 | .wrapper.active .sidebar-wrapper { | ||
380 | left: 200px; | ||
381 | border-right:1px solid #00FFFF; | ||
382 | } | ||
383 | |||
384 | .row,.row-pad { | ||
385 | margin-left: 0; | ||
386 | margin-right: 0; | ||
387 | } | ||
388 | |||
389 | #message { | ||
390 | padding-left: 15px; | ||
391 | padding-right: -15px; | ||
392 | } | ||
393 | |||
394 | |||
395 | .menu-toggle { | ||
396 | font-size:18px; | ||
397 | color:#000; | ||
398 | } | ||
399 | .menu-icon { | ||
400 | margin-right: 10px; | ||
401 | } | ||
402 | |||
403 | .personal-info,.server-stats { | ||
404 | list-style: none; | ||
405 | padding-left: 0; | ||
406 | } | ||
407 | |||
408 | .progress { | ||
409 | |||
410 | height: 5px; | ||
411 | } | ||
412 | |||
413 | h5 { | ||
414 | color: #000; | ||
415 | } | ||
416 | |||
417 | .radio, .checkbox { | ||
418 | color:#000; | ||
419 | margin-left: 10px; | ||
420 | } | ||
421 | .radio label, .checkbox label { | ||
422 | font-size:14px; | ||
423 | } | ||
424 | |||
425 | /* side menu css ends here */ | ||
426 | |||
427 | p { | ||
428 | text-align:justify; | ||
429 | } | ||
430 | |||
187 | 431 | ||
188 | 432 | /* ========================================================================== | |
189 | 433 | Helper classes |