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

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