git.roojs.org Git - bootswatch/blob - simplex/bootswatch.less

   1 // Bootswatch.less
   2 // Swatch: Simplex
   3 // Version: 2.0.3
   4 // -----------------------------------------------------
   5
   6 @boxShadow: 0 1px 1px rgba(0, 0, 0, 0.3);
   7
   8 // TYPOGRAPHY
   9 // -----------------------------------------------------
  10
  11 h6, .hero-unit {
  12         color: @headingsColor;
  13 }
  14
  15 // NAVBAR
  16 // -----------------------------------------------------
  17
  18 .navbar .navbar-inner {
  19         .box-shadow(inset 0 -1px #CFCACA);
  20         border-bottom: 1px solid #FFF;
  21         border-bottom: none;
  22 }
  23
  24 .navbar .brand {
  25         padding-top: 10px;
  26         color: @headingsColor;
  27 }
  28
  29 .navbar .nav > li > a {
  30         padding-top: 14px;
  31         text-shadow: none;
  32         font-weight: normal;
  33         font-size: 11px;
  34 }
  35
  36 .navbar .navbar-text {
  37         padding: 14px 10px 11px;
  38         text-shadow: none;
  39         font-weight: normal;
  40         font-size: 11px;
  41 }
  42
  43 .navbar .nav > li > a:hover {
  44         text-decoration: underline;
  45 }
  46
  47 .navbar .nav .active > a,
  48 .navbar .nav .active > a:hover {
  49         background-color: transparent;
  50 }
  51
  52 .navbar .nav li.dropdown .dropdown-toggle .caret,
  53 .navbar .nav li.open.dropdown .dropdown-toggle .caret {
  54         border-top-color: @textColor;
  55 }
  56
  57 .dropdown.open .dropdown-toggle {
  58         color: @headingsColor;
  59 }
  60
  61 div.subnav {
  62
  63         background-image: none;
  64         background-color: @navbarBackground;
  65         border-bottom: 1px solid transparent;
  66         .box-shadow(@boxShadow);
  67
  68         &.subnav-fixed {
  69                 .box-shadow(inset 0 5px #fff~"," @boxShadow);
  70         }
  71
  72         .nav > li > a {
  73                 padding-top: 12px;
  74                 color: @navbarText;
  75                 font-weight: normal;
  76                 font-size: 11px;
  77
  78                 &:hover {
  79                         text-decoration: underline;
  80                 }
  81         }
  82
  83         .nav > li.open > a,
  84         .nav > li.open > a:hover {
  85                 background-color: transparent;
  86                 border-left: 1px solid whiteSmoke;
  87                 border-right: 1px solid #E5E5E5;
  88         }
  89 }
  90
  91 .dropdown-menu {
  92         .border-radius(0);
  93         font-size: 11px;
  94 }
  95
  96 .nav .nav-header {
  97         font-weight: normal;
  98         text-transform: none;
  99 }
 100 .navbar .nav-collapse.in .nav li > a {
 101         color: @headingsColor;
 102         font-weight: normal;
 103 }
 104
 105 .navbar .nav-collapse.in .nav li > a:hover {
 106         background-color: transparent;
 107         color: @black;
 108         text-decoration: underline;
 109 }
 110
 111 @media (max-width: 979px) {
 112         form.navbar-form, form.navbar-search {
 113                 border-top: 1px solid #ccc;
 114                 border-bottom: 1px solid #ccc;
 115         }
 116 }
 117
 118 // NAV
 119 // -----------------------------------------------------
 120
 121 .nav > li > a {
 122         font-size: 11px;
 123         border-width: 1px;
 124 }
 125
 126 .nav-tabs > li > a,
 127 .nav-tabs > li > a:hover,
 128 .tabbable > .nav-tabs > li > a,
 129 .tabbable > .nav-tabs > li > a:hover {
 130         background-color: darken(@bodyBackground, 3%);
 131         border: 1px solid #ccc;
 132 }
 133
 134 .tabbable > .nav-tabs > li.active > a {
 135         border-bottom: 1px solid transparent;
 136 }
 137
 138 .tabbable.tabs-below > .nav-tabs > li.active > a,
 139 .tabbable.tabs-left > .nav-tabs > li.active > a,
 140 .tabbable.tabs-right > .nav-tabs > li.active > a {
 141         border-bottom: 1px solid #ccc;
 142 }
 143
 144 .nav-pills > li > a:hover {
 145         background-color: transparent;
 146 }
 147
 148 .nav-tabs > li.active > a,
 149 .nav-tabs > li.active > a:hover {
 150         background-color: @bodyBackground;
 151 }
 152
 153 // FORMS
 154 // -----------------------------------------------------
 155
 156 .navbar-search .search-query {
 157         border: 1px solid #CCC;
 158         .border-radius(0);
 159         background-color: @bodyBackground;
 160         color: @gray;
 161 }
 162
 163 .help-inline, .help-block {
 164         font-size: 11px;
 165 }
 166
 167 // TABLES
 168 // -----------------------------------------------------
 169
 170 .table th {
 171         font-weight: normal;
 172 }
 173
 174 // BUTTONS
 175 // -----------------------------------------------------
 176
 177 .btn {
 178   .border-radius(2px);
 179   font-weight: bold;
 180   #gradient > .vertical-three-colors(@white, @white, 25%, darken(@white, 10%));
 181 }
 182
 183 .btn-primary {
 184   .buttonBackground(lighten(@btnPrimaryBackground, 5%), @btnPrimaryBackground);
 185 }
 186
 187 .btn-warning {
 188   .buttonBackground(lighten(@orange, 5%), @orange);
 189 }
 190
 191 .btn-danger {
 192   .buttonBackground(lighten(@red, 5%), @red);
 193 }
 194
 195 .btn-success {
 196   .buttonBackground(lighten(@green, 5%), @green);
 197 }
 198
 199 .btn-info {
 200   .buttonBackground(lighten(#5bc0de, 5%), #5bc0de);
 201 }
 202
 203 .btn-inverse {
 204   .buttonBackground(lighten(@purple, 5%), @purple);
 205 }
 206
 207 // MODALS
 208 // -----------------------------------------------------
 209
 210 .modal,
 211 .modal-header,
 212 .modal-footer {
 213         .border-radius(0);
 214 }
 215
 216 .modal-header {
 217         border-bottom: none;
 218 }
 219
 220 .modal-header,
 221 .modal-body {
 222         background-color: @navbarBackground;
 223 }
 224
 225 .modal-footer {
 226         background-color: @bodyBackground;
 227 }
 228
 229 // MISCELLANEOUS
 230 // -----------------------------------------------------
 231
 232 i[class^="icon-"]{
 233         opacity: 0.6;
 234         vertical-align: -2px;
 235 }
 236
 237 .alert, .alert p, .alert-heading {
 238         font-size: 11px;
 239 }
 240
 241 .progress {
 242     #gradient > .vertical(#e0e0e0, #e8e8e8);
 243 }
 244
 245 .label {
 246         font-size: 11px;
 247         font-weight: normal;
 248 }
 249
 250 .hero-unit {
 251         background-color: @white;
 252         .box-shadow(@boxShadow);
 253 }
 254
 255 .well {
 256         .box-shadow(@boxShadow);
 257         background-color: @white;
 258         border: none;
 259 }
 260
 261 .breadcrumb {
 262         .box-shadow(@boxShadow);
 263         border: 0px solid transparent;
 264         font-size: 11px;
 265 }
 266
 267 footer.footer p {
 268         font-size: 11px;
 269 }