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

   1 // Bootswatch.less
   2 // Swatch: Cerulean
   3 // Version: 2.0.4
   4 // -----------------------------------------------------
   5
   6 // IMPORTS
   7 // -----------------------------------------------------
   8
   9 @import url(https://fonts.googleapis.com/css?family=Telex);
  10
  11 // NAVBAR
  12 // -----------------------------------------------------
  13
  14 .navbar {
  15
  16         font-family: @headingsFontFamily;
  17
  18         .navbar-inner {
  19                 #gradient > .vertical-three-colors(@navbarBackground, @navbarBackground, 90%, @navbarBackgroundHighlight);
  20         }
  21
  22         .brand {
  23                 padding: 15px 20px;
  24         }
  25
  26         .nav > li > a {
  27                 padding: 16px 10px 14px;
  28         }
  29
  30         .nav li.dropdown.active > .dropdown-toggle,
  31         .nav li.dropdown.active.open > .dropdown-toggle {
  32                 background-color: @navbarLinkBackgroundActive;
  33         }
  34
  35         .nav-collapse.in > .nav > li .dropdown-menu a {
  36                 color: @white;
  37
  38                 &:hover {
  39                         color: @white;
  40                 }
  41         }
  42
  43         .nav-collapse.in .nav li > a {
  44                 color: @white;
  45
  46                 &:hover {
  47                         background-color: #2B7CAC;
  48                 }
  49         }
  50
  51         .search-query {
  52                 border: 1px solid darken(@linkColor, 10%);
  53         }
  54
  55         .btn-navbar:hover {
  56             background-color: darken(@white, 20%);
  57         }
  58
  59         .navbar-text {
  60                 padding: 19px 10px 18px;
  61                 line-height: 13px;
  62                 color: rgba(0, 0, 0, 0.5);
  63                 text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.25);
  64         }
  65 }
  66
  67 div.subnav {
  68         font-family: @headingsFontFamily;
  69
  70         &-fixed {
  71                 top: @navbarHeight;
  72         }
  73 }
  74
  75 // BUTTONS
  76 // -----------------------------------------------------
  77
  78 .btn {
  79   #gradient > .vertical-three-colors(@white, @white, 5%, darken(@white, 0%));
  80   @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
  81   .box-shadow(@shadow);
  82
  83   &:hover {
  84         background-position: 0 0;
  85   }
  86 }
  87
  88 .btn-primary {
  89   .buttonBackground(lighten(@btnPrimaryBackground, 5%), @btnPrimaryBackground);
  90 }
  91
  92 .btn-info {
  93   .buttonBackground(lighten(@btnInfoBackground, 5%), @btnInfoBackground);
  94 }
  95
  96 .btn-success {
  97   .buttonBackground(lighten(@btnSuccessBackground, 5%), @btnSuccessBackground);
  98 }
  99
 100 .btn-warning {
 101   .buttonBackground(lighten(@btnWarningBackground, 5%), @btnWarningBackground);
 102 }
 103
 104 .btn-danger {
 105   .buttonBackground(lighten(@btnDangerBackground, 5%), @btnDangerBackground);
 106 }
 107
 108 .btn-inverse {
 109   .buttonBackground(lighten(@btnInverseBackground, 5%), @btnInverseBackground);
 110 }
 111
 112 // ICONS
 113 // -----------------------------------------------------
 114
 115 // Make icons gray
 116 i[class^="icon-"]{
 117         opacity: 0.8;
 118 }