nbot

A clone of the eBot by @deStrO fully based on node.js with build in Web Page - WIP
git clone git://archive.git.mtrnord.blog/MTRNord/nbot.git
Log | Files | Refs | README | LICENSE

sidebar.css (2209B)


      1 /*!
      2  * Start Bootstrap - Simple Sidebar HTML Template (http://startbootstrap.com)
      3  * Code licensed under the Apache License v2.0.
      4  * For details, see http://www.apache.org/licenses/LICENSE-2.0.
      5  */
      6 
      7 /* Toggle Styles */
      8 
      9 #wrapper {
     10     padding-left: 0;
     11     -webkit-transition: all 0.5s ease;
     12     -moz-transition: all 0.5s ease;
     13     -o-transition: all 0.5s ease;
     14     transition: all 0.5s ease;
     15 }
     16 
     17 #wrapper.toggled {
     18     padding-left: 250px;
     19 }
     20 
     21 #sidebar-wrapper {
     22     z-index: 1000;
     23     position: fixed;
     24     left: 250px;
     25     width: 0;
     26     height: 100%;
     27     margin-left: -250px;
     28     overflow-y: auto;
     29     -webkit-transition: all 0.5s ease;
     30     -moz-transition: all 0.5s ease;
     31     -o-transition: all 0.5s ease;
     32     transition: all 0.5s ease;
     33     background: rgba(217,217,217,0.2);
     34 }
     35 
     36 #wrapper.toggled #sidebar-wrapper {
     37     width: 250px;
     38 }
     39 
     40 #page-content-wrapper {
     41     width: 100%;
     42     position: absolute;
     43     padding: 15px;
     44 }
     45 
     46 #wrapper.toggled #page-content-wrapper {
     47     position: absolute;
     48     margin-right: -250px;
     49 }
     50 
     51 /* Sidebar Styles */
     52 
     53 .sidebar-nav {
     54     position: absolute;
     55     top: 0;
     56     width: 250px;
     57     margin: 0;
     58     padding: 0;
     59     list-style: none;
     60 }
     61 
     62 .sidebar-nav li {
     63     text-indent: 20px;
     64     line-height: 40px;
     65 }
     66 
     67 .sidebar-nav li a {
     68     display: block;
     69     text-decoration: none;
     70     color: #635C5C;
     71 }
     72 
     73 .sidebar-nav li a:hover {
     74     text-decoration: none;
     75     color: #000;
     76     background: rgba(128,128,128,0.2);
     77 }
     78 
     79 .sidebar-nav li a:active,
     80 .sidebar-nav li a:focus {
     81     text-decoration: none;
     82 }
     83 
     84 .sidebar-nav > .sidebar-brand {
     85     height: 65px;
     86     font-size: 18px;
     87     line-height: 60px;
     88 }
     89 
     90 .sidebar-nav > .sidebar-brand a {
     91     color: #635C5C;
     92 }
     93 
     94 .sidebar-nav > .sidebar-brand a:hover {
     95     color: #000;
     96     background: rgba(128,128,128,0.2);
     97 }
     98 
     99 @media(min-width:768px) {
    100     #wrapper {
    101         padding-left: 250px;
    102     }
    103 
    104     #wrapper.toggled {
    105         padding-left: 0;
    106     }
    107 
    108     #sidebar-wrapper {
    109         width: 250px;
    110     }
    111 
    112     #wrapper.toggled #sidebar-wrapper {
    113         width: 0;
    114     }
    115 
    116     #page-content-wrapper {
    117         padding: 20px;
    118         position: relative;
    119     }
    120 
    121     #wrapper.toggled #page-content-wrapper {
    122         position: relative;
    123         margin-right: 0;
    124     }
    125 }