ceph/src/pybind/mgr/dashboard/static/AdminLTE-2.3.7/build/less/navs.less

   1 /*
   2  * Component: Nav
   3  * --------------
   4  */
   5
   6 .nav {
   7   > li > a:hover,
   8   > li > a:active,
   9   > li > a:focus {
  10     color: #444;
  11     background: #f7f7f7;
  12   }
  13 }
  14
  15 /* NAV PILLS */
  16 .nav-pills {
  17   > li > a {
  18     .border-radius(0);
  19     border-top: 3px solid transparent;
  20     color: #444;
  21     > .fa,
  22     > .glyphicon,
  23     > .ion {
  24       margin-right: 5px;
  25     }
  26   }
  27   > li.active > a,
  28   > li.active > a:hover,
  29   > li.active > a:focus {
  30     border-top-color: @light-blue;
  31   }
  32   > li.active > a {
  33     font-weight: 600;
  34   }
  35 }
  36
  37 /* NAV STACKED */
  38 .nav-stacked {
  39   > li > a {
  40     .border-radius(0);
  41     border-top: 0;
  42     border-left: 3px solid transparent;
  43     color: #444;
  44   }
  45   > li.active > a,
  46   > li.active > a:hover {
  47     background: transparent;
  48     color: #444;
  49     border-top: 0;
  50     border-left-color: @light-blue;
  51   }
  52
  53   > li.header {
  54     border-bottom: 1px solid #ddd;
  55     color: #777;
  56     margin-bottom: 10px;
  57     padding: 5px 10px;
  58     text-transform: uppercase;
  59   }
  60 }
  61
  62 /* NAV TABS */
  63 .nav-tabs-custom {
  64   margin-bottom: 20px;
  65   background: #fff;
  66   box-shadow: @box-boxshadow;
  67   border-radius: @box-border-radius;
  68   > .nav-tabs {
  69     margin: 0;
  70     border-bottom-color: #f4f4f4;
  71     .border-top-radius(@box-border-radius);
  72     > li {
  73       border-top: 3px solid transparent;
  74       margin-bottom: -2px;
  75       > a {
  76         color: #444;
  77         .border-radius(0);
  78         &.text-muted {
  79           color: #999;
  80         }
  81         &,
  82         &:hover {
  83           background: transparent;
  84           margin: 0;
  85         }
  86         &:hover {
  87           color: #999;
  88         }
  89       }
  90       &:not(.active) {
  91         > a:hover,
  92         > a:focus,
  93         > a:active {
  94           border-color: transparent;
  95         }
  96       }
  97       margin-right: 5px;
  98     }
  99
 100     > li.active {
 101       border-top-color: @light-blue;
 102       & > a,
 103       &:hover > a {
 104         background-color: #fff;
 105         color: #444;
 106       }
 107       > a {
 108         border-top-color: transparent;
 109         border-left-color: #f4f4f4;
 110         border-right-color: #f4f4f4;
 111       }
 112
 113     }
 114
 115     > li:first-of-type {
 116       margin-left: 0;
 117       &.active {
 118         > a {
 119           border-left-color: transparent;
 120         }
 121       }
 122     }
 123
 124     //Pulled to the right
 125     &.pull-right {
 126       float: none !important;
 127       > li {
 128         float: right;
 129       }
 130       > li:first-of-type {
 131         margin-right: 0;
 132         > a {
 133           border-left-width: 1px;
 134         }
 135         &.active {
 136           > a {
 137             border-left-color: #f4f4f4;
 138             border-right-color: transparent;
 139           }
 140         }
 141       }
 142     }
 143
 144     > li.header {
 145       line-height: 35px;
 146       padding: 0 10px;
 147       font-size: 20px;
 148       color: #444;
 149       > .fa,
 150       > .glyphicon,
 151       > .ion {
 152         margin-right: 5px;
 153       }
 154     }
 155   }
 156
 157   > .tab-content {
 158     background: #fff;
 159     padding: 10px;
 160     .border-bottom-radius(@box-border-radius);
 161   }
 162
 163   .dropdown.open > a {
 164     &:active,
 165     &:focus {
 166       background: transparent;
 167       color: #999;
 168     }
 169   }
 170   // Tab color variations
 171   &.tab-primary {
 172     > .nav-tabs {
 173       > li.active {
 174         border-top-color: @light-blue;
 175       }
 176     }
 177   }
 178   &.tab-info {
 179     > .nav-tabs {
 180       > li.active {
 181         border-top-color: @aqua;
 182       }
 183     }
 184   }
 185   &.tab-danger {
 186     > .nav-tabs {
 187       > li.active {
 188         border-top-color: @red;
 189       }
 190     }
 191   }
 192   &.tab-warning {
 193     > .nav-tabs {
 194       > li.active {
 195         border-top-color: @yellow;
 196       }
 197     }
 198   }
 199   &.tab-success {
 200     > .nav-tabs {
 201       > li.active {
 202         border-top-color: @green;
 203       }
 204     }
 205   }
 206   &.tab-default {
 207     > .nav-tabs {
 208       > li.active {
 209         border-top-color: @gray;
 210       }
 211     }
 212   }
 213 }
 214
 215 /* PAGINATION */
 216 .pagination {
 217   > li > a {
 218     background: #fafafa;
 219     color: #666;
 220   }
 221   &.pagination-flat {
 222     > li > a {
 223       .border-radius(0) !important;
 224     }
 225   }
 226 }