Changeset 90743 in spip-zone


Ignore:
Timestamp:
Jul 6, 2015, 3:01:43 PM (4 years ago)
Author:
cedric@…
Message:

Renommage des variables/mixins/... pour faire compiler correctement avec BS3

Location:
_plugins_/bootstrap/trunk/bootstrap2spip/css
Files:
16 edited
1 moved

Legend:

Unmodified
Added
Removed
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/alerts.less

    r67103 r90743  
    33.info {.alert; .alert-info;}
    44.success {.alert; .alert-success;}
    5 .warning {.alert;}
    6 .error {.alert;.alert-error}
     5.warning {.alert; .alert-warning;}
     6.error {.alert;.alert-danger}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/box.less

    r67031 r90743  
    88/* **************** BLOCK STRUCTURES ***************** */
    99/* box */
    10 .box{margin:0;margin-bottom: @baseLineHeight;}
     10.box{margin:0;margin-bottom: @line-height-computed;}
    1111.bd,.ft{/*overflow:hidden;_overflow:visible; _zoom:1;*/}
    12 .hd {margin-bottom: @baseLineHeight;}
    13 .box .inner{position:relative;padding: @baseLineHeight/2-1px;}
     12.hd {margin-bottom: @line-height-computed;}
     13.box .inner{position:relative;padding: @line-height-computed/2-1px;}
    1414.box b{display:block;background-repeat:no-repeat;font-size:1%;position:relative;z-index:10;}
    1515.box .inner b{display:inline;font-size:inherit;position:static;}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/buttons.less

    r67476 r90743  
    22
    33/* boutons admin forum */
    4 .boutons.modererforum .submit {.btn-mini;}
     4.boutons.modererforum .submit {.btn-xs}
    55.boutons.modererforum .poubelle .submit {.btn-danger;}
    6 .boutons.modererforum .spam .submit {.btn-inverse;}
     6.boutons.modererforum .spam .submit {.btn-warning;}
    77
    88/* boutons d'admin */
    9 body .spip-admin-bloc, body .spip-admin-float {z-index: @zindexFixedNavbar + 1;}
     9body .spip-admin-bloc, body .spip-admin-float {z-index: @zindex-navbar-fixed + 1;}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/code.less

    r81542 r90743  
    11@import "bootstrap/css/code.less";
    22
    3 code {color:inherit;background-color: @tableBackgroundAccent;white-space:inherit}
    4 .spip_code {&:extend(code);color:inherit;background-color: @tableBackgroundAccent;white-space:inherit}
     3code {white-space:inherit}
     4.spip_code {&:extend(code);white-space:inherit}
    55.spip_code >code {border: none;padding: 0;background: none;color:inherit}
    6 pre,code,kbd,samp,var,tt,.spip_code,.spip_cadre { #font > #family > .monospace; font-size: 1em; }
     6pre,code,kbd,samp,var,tt,.spip_code,.spip_cadre {font-family: @font-family-monospace; font-size: 1em; }
    77
    8 pre { margin: 1.5em 0;
     8pre { margin: @emVertMargin 0;
    99  /* Cf.: http://perishablepress.com/press/2010/06/01/wrapping-content/ */
    1010  white-space: pre;           /* CSS 2.0 */
     
    1717  word-wrap: break-word;      /* IE 5+ */
    1818}
    19 kbd { background-color: #222222; color: #FFFFFF; }
     19
    2020samp { font-weight: bold; }
    2121var { font-style: italic; }
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/forms.less

    r90641 r90743  
    66.rtl {
    77  .form-search .input-append .search-query {
    8     .border-radius(0 14px 14px 0);
     8                border-radius : 0 14px 14px 0;
    99  }
    1010  .form-search .input-append .btn {
    11   .border-radius(14px 0 0 14px);
     11                border-radius : 14px 0 0 14px;
    1212  }
    1313  .form-search .input-prepend .search-query {
    14   .border-radius(14px 0 0 14px);
     14                border-radius : 14px 0 0 14px;
    1515  }
    1616  .form-search .input-prepend .btn {
    17   .border-radius(0 14px 14px 0);
     17                border-radius : 0 14px 14px 0;
    1818  }
    1919}
     
    2222/* Structure generale des formulaires
    2323----------------------------------------------- */
    24 .formulaire_spip { clear: both; margin-bottom: @emLineHeight; padding: @emLineHeight; background-color: @wellBackground;position: relative;}
     24.formulaire_spip { clear: both; margin-bottom: @emLineHeight; padding: @emLineHeight; background-color: @well-bg;position: relative;}
    2525.formulaire_spip form {margin-bottom: 0}
    26 .formulaire_spip .boutons {.form-actions;margin: 0 -@emLineHeight -@emLineHeight; padding: @emLineHeight;text-align: right;}
     26.formulaire_spip .boutons {
     27        background-color: @well-bg;
     28        border-top: 1px solid @legend-border-color;
     29        .clearfix(); // Adding clearfix to allow for .pull-right button containers
     30        margin: 0 -@emLineHeight -@emLineHeight;
     31        padding: @emLineHeight;
     32        text-align: right;
     33}
    2734.secondary {
    2835  .formulaire_spip {padding: @emLineHeight/2;}
     
    4249.formulaire_spip .fieldset>ul,
    4350.formulaire_spip form>ul,
    44 .formulaire_spip form>div>ul {margin-left: 0;list-style: none;.control-group;}
     51.formulaire_spip form>div>ul {margin-left: 0;list-style: none;.form-group;}
    4552
    4653.formulaire_spip .editer { list-style: none;clear: both; margin: 0 -@emLineHeight; padding: @emLineHeight/4 @emLineHeight; }
     
    5259
    5360/* choix de mot dans le form forum notamment */
     61/* TODO BS3
    5462.formulaire_spip .choix_mots {#grid > .fluid > .row-fluid}
    5563.formulaire_spip .choix_mots .saisie_mot {
     
    5967  *margin-left: @fluidGridGutterWidth - (.5 / @gridRowWidth * 100 * 1%);
    6068  #grid > .fluid > .span(4);
    61 }
     69}*/
    6270.formulaire_spip .choix_mots .saisie_mot:nth-child(3n-2) {margin-left: 0;clear: both;}
    6371.formulaire_spip .choix_mots .saisie_mot label {display:inline;font-weight:normal;}
     
    112120
    113121/* * Erreurs */
    114 .editer.erreur { background-color: @errorBackground; }
    115 .editer .erreur_message { display: block; color: @errorText; font-weight: bold;}
     122.editer.erreur { background-color: @state-danger-bg; }
     123.editer .erreur_message { display: block; color: @state-danger-text; font-weight: bold;}
    116124.editer .erreur_message label {display: inline;}
    117125.editer .erreur_message input {margin: 0;}
     
    120128.reponse_formulaire {.alert;}
    121129.reponse_formulaire_ok {.alert-success;}
    122 .reponse_formulaire_erreur {.alert-error;}
     130.reponse_formulaire_erreur {.alert-danger;}
    123131
    124132/* Variantes et cas particuliers
     
    139147
    140148/* Formulaires de recherche (site / petitions) */
    141 .formulaire_recherche,.secondary .formulaire_recherche {.form-search}
     149.formulaire_recherche,.secondary .formulaire_recherche {/*.form-search*/}
    142150.formulaire_recherche,.secondary .formulaire_recherche { padding: 0; background: none; border: 0;}
    143151
    144152/* Formulaire de login dans une page */
     153/* TODO BS3
    145154.formulaire_login form .editer {clear:left;}
    146155.formulaire_login form input.text,
    147156.formulaire_login form input.password {#grid > .core > .span(5)}
     157*/
    148158
    149159.formulaire_login form .editer_password .details {margin-bottom:0;}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/hashgrid.less

    r75326 r90743  
    44 */
    55#grid {
    6   .hashgrid (@gridColumnWidth, @gridGutterWidth, @baseLineHeight) {
     6  .hashgrid (@grid-column-width, @grid-gutter-width, @grid-columns, @line-height-computed) {
    77    #bsgrid{
    88      /* Dimensions - same width as your grid with gutters */
    9       width: (@gridColumnWidth * @gridColumns) + (@gridGutterWidth * (@gridColumns + 1));
    10       margin-left: -((@gridColumnWidth * @gridColumns) + (@gridGutterWidth * (@gridColumns + 1)))/2;
     9      width: (@grid-column-width * @grid-columns) + (@grid-gutter-width * (@grid-columns + 1));
     10      margin-left: -((@grid-column-width * @grid-columns) + (@grid-gutter-width * (@grid-columns + 1)))/2;
    1111    }
    1212
     
    1818     */
    1919    #bsgrid div.vert{
    20         width: @gridColumnWidth - 1px;
     20        width: @grid-column-width - 1px;
    2121        border: solid darkturquoise;
    2222        border-width: 0 1px;
    23         margin-right: @gridGutterWidth - 1px;
     23        margin-right: @grid-gutter-width - 1px;
    2424    }
    2525    #bsgrid div.vert.first-line{
    26         margin-left: @gridGutterWidth - 1px;
     26        margin-left: @grid-gutter-width - 1px;
    2727    }
    2828
     
    3535    #bsgrid div.horiz{
    3636        /* 20px line height */
    37         height: @baseLineHeight - 1px;
     37        height: @line-height-computed - 1px;
    3838        border-bottom: 1px dotted darkgray;
    3939        margin: 0;
     
    4545
    4646// Fixed (940px)
    47 #grid > .hashgrid(@gridColumnWidth, @gridGutterWidth, @baseLineHeight);
    48 @media (min-width: 768px) and (max-width: 979px) {
    49   #grid > .hashgrid(@gridColumnWidth768, @gridGutterWidth768, @baseLineHeight);
     47#grid > .hashgrid(@container-md / @grid-columns - @grid-gutter-width, @grid-gutter-width, @grid-columns, @line-height-computed);
     48@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
     49  #grid > .hashgrid(@container-sm / @grid-columns - @grid-gutter-width, @grid-gutter-width, @grid-columns, @line-height-computed);
    5050}
    51 @media (min-width: 1200px) {
    52   #grid > .hashgrid(@gridColumnWidth1200, @gridGutterWidth1200, @baseLineHeight);
     51@media (min-width: @screen-lg-min) {
     52  #grid > .hashgrid(@container-lg / @grid-columns - @grid-gutter-width, @grid-gutter-width, @grid-columns, @line-height-computed);
    5353}
    5454#bsgrid{
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/jumbotron.less

    r90731 r90743  
    1 //@import "bootstrap/css/hero-unit.less";
     1@import "bootstrap/css/jumbotron.less";
    22//
    3 // Hero unit
     3// Jumbotron
    44// --------------------------------------------------
    55
    66
    7 .hero-unit {
     7.jumbotron {
    88  font-size: 1.25em;
    9   padding: @emLineHeight * 2 / 1.25;
    10   margin-bottom: @emLineHeight * 2 / 1.25;
    119  line-height: @emLineHeight;
    12   color: @heroUnitLeadColor;
    13   background-color: @heroUnitBackground;
    14   .border-radius(6px);
    15   h1 {
    16     color: @heroUnitHeadingColor;
     10
     11        p {
     12                font-size: inherit;
     13                line-height: @emLineHeight;
     14                margin-bottom: @emVertMargin;
     15        }
     16  h1,.h1 {
    1717    letter-spacing: -1px;
    1818  }
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/navbar.less

    r69754 r90743  
    11@import "bootstrap/css/navbar.less";
    22
    3 @media (max-width: @navbarCollapseWidth) {
     3@media (max-width: @grid-float-breakpoint-max) {
    44  .navbar-responsive {
    55    position: absolute;
     
    1010      .box-shadow(none);
    1111      border: none;
    12       .nav-collapse {background-color: @navbarBackgroundHighlight;}
     12      .nav-collapse {background-color: @navbar-default-bg;}
    1313    }
    14     &.navbar-inverse .navbar-inner .nav-collapse {background-color: @navbarInverseBackgroundHighlight;}
     14    &.navbar-inverse .navbar-inner .nav-collapse {background-color: @navbar-inverse-bg;}
    1515  }
    1616}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/navs.less

    r83017 r90743  
    44.texte_libre {&:extend(.nav-header);}
    55
    6 // Make links block level
    7 /*
    8 .nav > li > strong {
    9   display: block;
    10 }
    11 
    12 .nav-list > li > strong {
    13   margin-left:  -15px;
    14   margin-right: -15px;
    15   text-shadow: 0 1px 0 rgba(255,255,255,.5);
    16 }
    17 .nav-list > li > strong {
    18   padding: 3px 15px;
    19 }
    20 .nav-list > .active > strong {
    21   color: @white;
    22   text-shadow: 0 -1px 0 rgba(0,0,0,.2);
    23   background-color: @linkColor;
    24 }
    25 */
     6// TODO : retablir nav-list et nav-header ?
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/pagination.less

    r67067 r90743  
    44.pagination .pagination-label {
    55  display: inline-block;
    6   .ie7-inline-block();
    76}
    87.pagination .label {
     
    1211  text-shadow: none;
    1312  padding: 4px;
    14   line-height: @baseLineHeight;
     13  line-height: @line-height-base;
    1514}
    1615
     
    2120.tri {
    2221  display: block;
    23   margin: @baseLineHeight 0;
     22  margin: @line-height-computed 0;
    2423}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/scaffolding.less

    r87497 r90743  
    1212body {
    1313  margin: 0;
    14   font-family: @baseFontFamily;
     14  font-family: @font-family-base;
    1515  font-size: @emFontSize;
    1616  line-height: @emLineHeight;
    17   color: @textColor;
    18   background-color: @bodyBackground;
     17  color: @text-color;
     18  background-color: @body-bg;
    1919}
    2020
     
    4444dl.spip_documents { dt,dd {margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}}
    4545
    46 .spip_documents_left { float: left; margin: @paddingLarge;margin-left: 0; }
    47 .spip_documents_right { float: right; margin: @paddingLarge;margin-right: 0; }
     46.spip_documents_left { float: left; margin: @padding-large-vertical @padding-large-horizontal;margin-left: 0; }
     47.spip_documents_right { float: right; margin: @padding-large-vertical @padding-large-horizontal;margin-right: 0; }
    4848.spip_doc_titre {}
    4949.spip_doc_descriptif { clear: both; }
     
    5151.cartouche {&:last-child{margin-bottom: 0};margin-bottom: @emVertMargin;}
    5252.cartouche,.hero-unit,.entry-title {
    53   .spip_logos {float: right; clear: right; margin: @paddingLarge; margin-top: 0;margin-right: 0; line-height: 1px;}
     53  .spip_logos {float: right; clear: right; margin: @padding-large-vertical @padding-large-horizontal; margin-top: 0;margin-right: 0; line-height: 1px;}
    5454}
    5555.cartouche,.hero-unit,.entry{
     
    5858}
    5959.entry {margin-bottom: @emVertMargin;}
    60 .secondary .entry-title .spip_logos { margin: @paddingSmall; margin-top: 0;margin-right: 0; }
     60.secondary .entry-title .spip_logos { margin: @padding-small-vertical @padding-small-horizontal; margin-top: 0;margin-right: 0; }
    6161.postmeta >:first-child >.sep:first-child {display: none}
    6262
     
    6666  padding-top: @emVertMargin;
    6767  margin-top: @emVertMargin;
    68   max-width: 5 * ( @gridColumnWidth + @gridGutterWidth );
     68  max-width: @container-md * 5 / 12;
    6969}
    70 .notes > h2 {border-bottom: 2px solid lighten(@grayLight, 20%);}
     70.notes > h2 {border-bottom: 2px solid lighten(@gray-light, 20%);}
    7171.notes > div p {font-size: inherit;line-height: inherit;font-weight: 200;}
    72 .notes > div {padding-left: @gridColumnWidth+@gridGutterWidth; position: relative; }
    73 .notes .spip_note_ref { display:block;position:absolute;left:0;width: @gridColumnWidth;}
     72.notes > div {padding-left: @container-md / @grid-columns; position: relative; }
     73.notes .spip_note_ref { display:block;position:absolute;left:0;width: @container-md / @grid-columns - @grid-gutter-width;}
    7474.secondary {
    75   .notes > div {padding-left: 2*@gridGutterWidth;}
    76   .notes .spip_note_ref { width: 2*@gridGutterWidth;}
     75  .notes > div {padding-left: 2*@grid-gutter-width;}
     76  .notes .spip_note_ref { width: 2*@grid-gutter-width;}
    7777}
    7878
    7979/* Liens */
    80 a {color: @linkColor;}
     80a {color: @link-color;}
    8181a:focus,
    8282a:hover,
    83 a:active { background-color: spin(lighten(@linkColor,50%) / 4 + @grayLighter / 4 * 3, 20%); color: @linkColorHover; text-decoration: none; }
     83a:active { background-color: spin(lighten(@link-color,50%) / 4 + @gray-lighter / 4 * 3, 20%); color: @link-hover-color; text-decoration: none; }
    8484a[hreflang]:after { content: "\0000a0(" attr(hreflang) ")"; }
    8585@media print {
    86   a, a:visited { color: @textColor; text-decoration: underline; }
     86  a, a:visited { color: @text-color; text-decoration: underline; }
    8787  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
    8888}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/spip.comment.less

    r66300 r90743  
    44
    55@import "css/variables.less";
     6@import "css/spip.variables.less";
    67@import "css/mixins.less";
    78
     
    1213.comments-items {list-style: none;margin-left: 0;}
    1314//.comments-items {border-bottom: 1px solid #eee;}
    14 .comments-items .comments-items {margin-left: @gridColumnWidth+@gridGutterWidth;}
    15 .comments-items .comments-items .comments-items .comments-items .comments-items {margin-left: @gridGutterWidth;}
     15.comments-items .comments-items {margin-left: @gridColumnWidth+@grid-gutter-width;}
     16.comments-items .comments-items .comments-items .comments-items .comments-items {margin-left: @grid-gutter-width;}
    1617
    1718//.comments-items .comment-item {border-top: 1px solid #eee;}
    1819//.comments-items .comment-item .comment-item {border-top: 0;}
    1920
    20 .comment {overflow:hidden;position: relative;padding-bottom: @baseLineHeight;}
     21.comment {overflow:hidden;position: relative;padding-bottom: @line-height-computed;}
    2122.comment-meta {
    2223  min-height: 20px;
    2324  padding: 19px;
    24   background-color: @wellBackground;
    25   border: 1px solid darken(@wellBackground, 7%);
    26   .border-radius(@baseBorderRadius);
     25  background-color: @well-bg;
     26  border: 1px solid @well-border;
     27        border-radius: @border-radius-base;
    2728  .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
    2829  border:0;
    29   margin-bottom: @baseLineHeight/2;
     30  margin-bottom: @line-height-computed / 2;
    3031}
    31 .comment-meta {padding-left: @gridColumnWidth+2*@gridGutterWidth;position: relative;}
    32 .comment-meta .spip_logos {position:absolute;left: @gridGutterWidth;}
    33 .comment-meta .permalink { position: absolute;right: 0;font-size: 2em;color:@grayLight;}
     32.comment-meta {padding-left: @gridColumnWidth+2*@grid-gutter-width;position: relative;}
     33.comment-meta .spip_logos {position:absolute;left: @grid-gutter-width;}
     34.comment-meta .permalink { position: absolute;right: 0;font-size: 2em;color:@gray-light;}
    3435
    3536//.comment-item .comment-item .comment-meta {background : #f4f4f4;}
    3637.comment-meta .forum-titre {display: block;}
    37 .comment-content {background: transparent;padding-left: @gridColumnWidth+2*@gridGutterWidth;max-height:60em;overflow:auto;overflow-x:none;}
    38 .comment-reply { clear: both; text-align: right; margin-bottom:0;margin-top: -@baseLineHeight/2;visibility: hidden;}
     38.comment-content {background: transparent;padding-left: @gridColumnWidth+2*@grid-gutter-width;max-height:60em;overflow:auto;overflow-x:none;}
     39.comment-reply { clear: both; text-align: right; margin-bottom:0;margin-top: -@line-height-computed/2;visibility: hidden;}
    3940.comment:hover .comment-reply {visibility: visible;position: relative;}
    4041/* avec plugin comments */
     
    4243
    4344/* en thread */
    44 .comments-thread .comment-item {margin-bottom:@baseLineHeight;}
     45.comments-thread .comment-item {margin-bottom:@line-height-computed;}
    4546.comments-thread .comment-item .comment-item {margin-bottom:0;}
    4647.comments-thread .permalink.in-reply-to {bottom:0;}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/spip.list.less

    r86858 r90743  
    2929*/
    3030
    31 @listBorderColor : (4*(@bodyBackground/5)+@gray/5);
     31@listBorderColor : @list-group-border;
    3232
    3333.liste {margin-bottom: @emVertMargin};
     
    4242
    4343.entry {
    44   div.spip,p,.p {margin-bottom: @emVertMargin / 2;}.entry-title {margin-bottom: @baseLineHeight * (@emVertMargin/@emLineHeight) / 2;}
     44  div.spip,p,.p {margin-bottom: @emVertMargin / 2;}.entry-title {margin-bottom: @line-height-computed * (@emVertMargin/@emLineHeight) / 2;}
    4545  .entry-content > :last-child {margin-bottom: 0;}
    4646  .entry-content {margin-bottom: @emVertMargin / 2;}
     
    5151  display: block;
    5252  font-weight: bold;
    53   color: @grayLight;
     53  color: @gray-light;
    5454  text-shadow: 0 1px 0 rgba(255,255,255,.5);
    5555  text-transform: uppercase;
     
    9191}
    9292.thumb {
    93   .entry-title {padding-top: 120px+@baseLineHeight;display: block}
    94   .spip_logos {display: block;float: left;margin:0;margin-top: -1*(120px+@baseLineHeight);.box-sizing(border-box);height:120px;width: 100% !important;padding: 0;text-align: center;overflow: hidden}
     93  .entry-title {padding-top: 120px + @line-height-computed;display: block}
     94  .spip_logos {display: block;float: left;margin:0;margin-top: -1*(120px + @line-height-computed);.box-sizing(border-box);height:120px;width: 100% !important;padding: 0;text-align: center;overflow: hidden}
    9595  .spip_logos img {height: 100%!important;width: 100%}
    96   .entry-content {max-height: 5*@emLineHeight;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;}
     96  .entry-content {max-height: 5 * @emLineHeight;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;}
    9797}
    9898
     
    117117  .liste-items {
    118118    .item {padding:@emVertMargin / 4 0;}
    119     .spip_logos {max-width: 2.5*@emLineHeight;}
     119    .spip_logos {max-width: 2.5 * @emLineHeight;}
    120120    .spip_logos img {height: auto !important;}
    121     .entry-content {max-height: 5*@emLineHeight;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;}
     121    .entry-content {max-height: 5 * @emLineHeight;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;}
    122122  }
    123123  .short .item, .item.short {
     
    129129  }
    130130  .long {
    131     .entry-content {max-height: 10*@emLineHeight;}
     131    .entry-content {max-height: 10 * @emLineHeight;}
    132132  }
    133133}
     
    135135/* liste de documents */
    136136.documents {
    137   .item {padding-right:0;padding-left: 3*@emLineHeight;}
     137  .item {padding-right:0;padding-left: 3 * @emLineHeight;}
    138138}
    139139.entry.document {
    140140  padding-bottom: 0;
    141141  .entry-title {font-size: inherit;line-height: inherit;margin-bottom: 0}
    142   .spip_logos {float: left;max-width: 1.5*@emLineHeight;margin:@paddingSmall;margin-left: -3*@emLineHeight;margin-top: 0;}
     142  .spip_logos {float: left;max-width: 1.5 * @emLineHeight;margin:@padding-small-vertical @padding-small-horizontal;margin-left: -3*@emLineHeight;margin-top: 0;}
    143143  .publication {display: block; margin-bottom: 0;}
    144144  .read-more {display: none}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/spip.variables.less

    r69317 r90743  
    1 @emFontSize : 1em * (@baseFontSize / 16);
    2 @emLineHeight : 1em * (@baseLineHeight / @baseFontSize);
     1.border-radius(@border-radius) {
     2        border-radius: @border-radius;
     3}
     4
     5@paddingLarge : @padding-large-vertical @padding-large-horizontal;
     6@paddingSmall: @padding-small-vertical @padding-small-horizontal;
     7@paddingMini: @padding-xs-vertical @padding-xs-horizontal;
     8
     9@gridColumnWidth: @container-md / @grid-columns - @grid-gutter-width;
     10@gridColumnWidth768: @container-sm / @grid-columns - @grid-gutter-width;
     11@gridColumnWidth1200: @container-lg / @grid-columns - @grid-gutter-width;
     12
     13@emFontSize : 1em * (@font-size-base / 16);
     14@emLineHeight : 1em * (@line-height-base);
    315@emVertMargin : @emLineHeight;
    4 @indentStep : (@gridColumnWidth + @gridGutterWidth) / 2;
    5 @indentStep1200 : (@gridColumnWidth1200 + @gridGutterWidth1200) / 2;
    6 @indentStep768 : (@gridColumnWidth768 + @gridGutterWidth768) / 2;
     16
     17@indentStep : (@container-md / @grid-columns) / 2;
     18@indentStep1200 : (@container-lg / @grid-columns) / 2;
     19@indentStep768 : (@container-sm / @grid-columns) / 2;
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/thumbnails.less

    r67030 r90743  
    1111  }
    1212
    13   .two (@width, @gridGutterWidth) {
     13  .two (@width, @grid-gutter-width) {
    1414    .thumbnails {margin-left: 0;}
    15     .thumbnails li {width: @width;/*width:calc(50% - (@gridGutterWidth/2));width:-moz-calc(50% - (@gridGutterWidth/2));*/float: left;}
     15    .thumbnails li {width: @width;/*width:calc(50% - (@grid-gutter-width/2));width:-moz-calc(50% - (@grid-gutter-width/2));*/float: left;}
    1616    .thumbnails li:nth-child(2n-1) {clear: both;float: left;margin-right: 0;margin-left: 0;}
    1717    .thumbnails li:nth-child(2n) {clear: none;float: right;margin-left: 0;}
    1818  }
    1919
    20   .three(@width, @gridGutterWidth){
     20  .three(@width, @grid-gutter-width){
    2121    .thumbnails {margin-left: 0;}
    22     .thumbnails li {width: @width;/*width:calc(33%-(2*@gridGutterWidth/3));width:-moz-calc(33%-(2*@gridGutterWidth/3));*/float: left;}
     22    .thumbnails li {width: @width;/*width:calc(33%-(2*@grid-gutter-width/3));width:-moz-calc(33%-(2*@grid-gutter-width/3));*/float: left;}
    2323    .thumbnails li:nth-child(3n-2) {clear: both;float: left;margin-right: 0;margin-left: 0;}
    24     .thumbnails li:nth-child(3n-1) {clear: none;float: left;margin-left: (100% - 3*@width)/2 - 0.1%;/*margin-left:calc(@gridGutterWidth);margin-left:-moz-calc(@gridGutterWidth);*/margin-right: 0;}
     24    .thumbnails li:nth-child(3n-1) {clear: none;float: left;margin-left: (100% - 3*@width)/2 - 0.1%;/*margin-left:calc(@grid-gutter-width);margin-left:-moz-calc(@grid-gutter-width);*/margin-right: 0;}
    2525    .thumbnails li:nth-child(3n) {clear: none;float: right;margin-left: 0;}
    2626  }
    2727
    28   .four(@width, @gridGutterWidth){
    29     .thumbnails li {width: @width;/*width:calc(25% - (3*@gridGutterWidth/4));width:-moz-calc(25% - (3*@gridGutterWidth/4));*/float: left;}
     28  .four(@width, @grid-gutter-width){
     29    .thumbnails li {width: @width;/*width:calc(25% - (3*@grid-gutter-width/4));width:-moz-calc(25% - (3*@grid-gutter-width/4));*/float: left;}
    3030    .thumbnails li:nth-child(4n-3) {clear: both;float: left;margin-right: 0;margin-left: 0;}
    31     .thumbnails li:nth-child(4n-2) {clear: none;float: left;margin-left: (100% - 4*@width)/3 - 0.1%;/*margin-left:calc(@gridGutterWidth);margin-left:-moz-calc(@gridGutterWidth);*/margin-right: 0;}
    32     .thumbnails li:nth-child(4n-1) {clear: none;float: left;margin-left: (100% - 4*@width)/3 - 0.1%;/*margin-left:calc(@gridGutterWidth);margin-left:-moz-calc(@gridGutterWidth);*/margin-right: 0;}
     31    .thumbnails li:nth-child(4n-2) {clear: none;float: left;margin-left: (100% - 4*@width)/3 - 0.1%;/*margin-left:calc(@grid-gutter-width);margin-left:-moz-calc(@grid-gutter-width);*/margin-right: 0;}
     32    .thumbnails li:nth-child(4n-1) {clear: none;float: left;margin-left: (100% - 4*@width)/3 - 0.1%;/*margin-left:calc(@grid-gutter-width);margin-left:-moz-calc(@grid-gutter-width);*/margin-right: 0;}
    3333    .thumbnails li:nth-child(4n) {clear: none;float: right;margin-left: 0;}
    3434  }
     
    3737
    3838/* mapper avec le plugin album */
    39 .album {#thumbgrid > .three(31%,@gridGutterWidth)}
     39.album {#thumbgrid > .three(31%,@grid-gutter-width)}
    4040.span3,
    4141.span4{
    42   .album {#thumbgrid > .two(48%,@gridGutterWidth)}
     42  .album {#thumbgrid > .two(48%,@grid-gutter-width)}
    4343}
    4444.span1,
     
    5151.thumbnails .caption img {margin-top: -9px;margin-bottom: 9px;}
    5252.thumbnails figure {margin:0;}
    53 .album .thumbnail {text-align: center; min-height: 150+2*9+@baseLineHeight;}
     53.album .thumbnail {text-align: center; min-height: 150+2*9+@line-height-computed;}
    5454// Add a hover state for linked versions only
    5555.album .thumbnail:hover {
    56   border-color: @linkColor;
     56  border-color: @link-color;
    5757  .box-shadow(0 1px 4px rgba(0,105,214,.25));
    5858}
    5959
    6060
    61 @media (min-width: 1200px) {
     61@media (min-width: @screen-lg-min) {
    6262  .span7,
    6363  .span8,
     
    6666  .span11,
    6767  .span12 {
    68     .album {#thumbgrid > .four(22%,@gridGutterWidth1200)}
     68    .album {#thumbgrid > .four(22%,@grid-gutter-width)}
    6969  }
    7070  .span3{
    71     .album {#thumbgrid > .two(48%,@gridGutterWidth1200)}
     71    .album {#thumbgrid > .two(48%,@grid-gutter-width)}
    7272  }
    7373}
    74 @media (min-width: 768px) and (max-width: 979px) {
     74@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
    7575  .span7 {
    76     .album {#thumbgrid > .three(30%,@gridGutterWidth768)}
     76    .album {#thumbgrid > .three(30%,@grid-gutter-width)}
    7777  }
    7878  .span5{
    79     .album {#thumbgrid > .two(48%,@gridGutterWidth768)}
     79    .album {#thumbgrid > .two(48%,@grid-gutter-width)}
    8080  }
    8181  .span3{
     
    8383  }
    8484}
    85 @media (max-width: 767px) {
    86   .album {#thumbgrid > .two(48%,@gridGutterWidth768)}
     85@media (max-width: @screen-xs-max) {
     86  .album {#thumbgrid > .two(48%,@grid-gutter-width)}
    8787}
    8888@media (max-width: 450px) {
    89   .album {#thumbgrid > .two(48%,@gridGutterWidth768)}
     89  .album {#thumbgrid > .two(48%,@grid-gutter-width)}
    9090}
    9191@media (max-width: 380px) {
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/type.less

    r81645 r90743  
    1818h5,.h5,.h5-like,
    1919h6,.h6,.h6-like {
    20   font-family: @headingsFontFamily;
    21   color:@headingsColor;
    22   display: block; margin: 0; padding: 0; font-size: 100%; font-weight: @headingsFontWeight;
     20  font-family: @headings-font-family;
     21  color:@headings-color;
     22  display: block; margin: 0; padding: 0; font-size: 100%; font-weight: @headings-font-weight;
    2323  text-rendering: optimizelegibility; // Fix the character spacing for headings
    2424  small {
    2525    font-weight: normal;
    2626    line-height: 1;
    27     color: @grayLight;
     27    color: @headings-small-color;
    2828    display:inline;
    2929    display:inline-block; /* evite de le couper si ne tient pas sur la fin de la ligne */
    3030  }
    3131}
    32 hr { height: 1px;margin: @emLineHeight 0;border: 0;background: @hrBorder; color: @hrBorder;}
    33 
    34 h1,.h1,.h1-like { font-size: 2em; line-height: @emLineHeight; margin-bottom: @emVertMargin / 2; small { font-size: 0.65em; }}
    35 h2,.h2,.h2-like { font-size: 1.5em; line-height: @emLineHeight / 1.5; margin-bottom: @emVertMargin / 1.5; small { font-size: 0.70em; }}
    36 h3,.h3,.h3-like { font-size: 1.25em; line-height: @emLineHeight / 1.25; margin-bottom: @emVertMargin / 1.25; small { font-size: 0.80em; }}
    37 h4,.h4,.h4-like { font-size: 1.1em; line-height: @emLineHeight / 1.1; margin-bottom: @emVertMargin / 1.1; }
    38 h5,.h5,.h5-like { font-size: 1em; font-weight: bold; margin-bottom: @emVertMargin; }
    39 h6,.h6,.h6-like { font-size: 1em; font-weight: bold; }
    40 
    41 // Utility classes
    42 .muted               { color: @grayLight; }
    43 a.muted:hover        { color: darken(@grayLight, 10%); }
    44 
    45 .text-warning        { color: @warningText; }
    46 a.text-warning:hover { color: darken(@warningText, 10%); }
    47 
    48 .text-error          { color: @errorText; }
    49 a.text-error:hover   { color: darken(@errorText, 10%); }
    50 
    51 .text-info           { color: @infoText; }
    52 a.text-info:hover    { color: darken(@infoText, 10%); }
    53 
    54 .text-success        { color: @successText; }
    55 a.text-success:hover { color: darken(@successText, 10%); }
    56 
     32hr { height: 1px;margin: @emLineHeight 0;border: 0;background: @hr-border; color: @hr-border;}
     33
     34h1,.h1,.h1-like { font-size: @font-size-h1; line-height: @headings-line-height; margin-bottom: @emVertMargin / 2; small { font-size: 0.65em; }}
     35h2,.h2,.h2-like { font-size: @font-size-h2; line-height: @emLineHeight / @font-size-h2; margin-bottom: @emVertMargin / 1.5; small { font-size: 0.70em; }}
     36h3,.h3,.h3-like { font-size: @font-size-h3; line-height: @emLineHeight / @font-size-h3; margin-bottom: @emVertMargin / 1.25; small { font-size: 0.80em; }}
     37h4,.h4,.h4-like { font-size: @font-size-h4; line-height: @emLineHeight / @font-size-h4; margin-bottom: @emVertMargin / 1.1; }
     38h5,.h5,.h5-like { font-size: @font-size-h5; line-height: @emLineHeight / @font-size-h5; font-weight: bold; margin-bottom: @emVertMargin; }
     39h6,.h6,.h6-like { font-size: @font-size-h6; line-height: @emLineHeight / @font-size-h6; font-weight: bold; }
     40
     41// Alignment
     42.text-left           { text-align: left; }
     43.text-right          { text-align: right; }
     44.text-center         { text-align: center; }
     45.text-justify        { text-align: justify; }
     46.text-nowrap         { white-space: nowrap; }
     47
     48// Transformation
     49.text-lowercase      { text-transform: lowercase; }
     50.text-uppercase      { text-transform: uppercase; }
     51.text-capitalize     { text-transform: capitalize; }
     52
     53// Contextual colors
     54.muted,.text-muted   {
     55        .text-emphasis-variant(@text-muted);
     56}
     57.text-primary {
     58  .text-emphasis-variant(@brand-primary);
     59}
     60.text-success {
     61  .text-emphasis-variant(@state-success-text);
     62}
     63.text-info {
     64  .text-emphasis-variant(@state-info-text);
     65}
     66.text-warning {
     67  .text-emphasis-variant(@state-warning-text);
     68}
     69.text-danger {
     70  .text-emphasis-variant(@state-danger-text);
     71}
     72
     73
     74// Contextual backgrounds
     75// For now we'll leave these alongside the text classes until v4 when we can
     76// safely shift things around (per SemVer rules).
     77.bg-primary {
     78  // Given the contrast here, this is the only class to have its color inverted
     79  // automatically.
     80  color: #fff;
     81  .bg-variant(@brand-primary);
     82}
     83.bg-success {
     84  .bg-variant(@state-success-bg);
     85}
     86.bg-info {
     87  .bg-variant(@state-info-bg);
     88}
     89.bg-warning {
     90  .bg-variant(@state-warning-bg);
     91}
     92.bg-danger {
     93  .bg-variant(@state-danger-bg);
     94}
    5795
    5896/* Enrichissements typographiques */
    5997strong, b { font-weight: bold; }
    6098em, i { font-style: italic; }
    61 small, .small { font-size: 85%; }
    62 big, .big { font-size: 130%; }
     99small, .small { font-size: floor((100% * @font-size-small / @font-size-base)); }
     100big, .big { font-size: floor((100% * @font-size-large / @font-size-base)); }
     101mark,.mark { background-color: @state-warning-bg;}
     102
    63103// Abbreviations and acronyms
    64104// Added data-* attribute to help out our tooltip plugin, per https://github.com/twitter/bootstrap/issues/5257
    65 abbr[title], acronym[title], abbr[data-original-title] { border-bottom: .1em dotted @grayLight; cursor: help; }
     105abbr[title], acronym[title], abbr[data-original-title] { border-bottom: .1em dotted @gray-light; cursor: help; }
    66106abbr.initialism {
    67107  font-size: 90%;
     
    83123ul, ol, li, dl, dt, dd {margin:0;padding:0;}
    84124ul,ol {margin-left: @indentStep;margin-bottom: @emVertMargin;}
    85 @media (min-width: 1200px) {ul,ol { margin-left: @indentStep1200; }}
    86 @media (max-width: 979px) {ul,ol{ margin-left: @indentStep768; }}
     125@media (min-width: @screen-lg-min) {ul,ol { margin-left: @indentStep1200; }}
     126@media (max-width: @screen-sm-max) {ul,ol{ margin-left: @indentStep768; }}
    87127ul ul, ol ol, ul ol, ol ul { margin-top: 0; margin-bottom: 0; }
    88128
    89129// Remove default list styles
    90 ul.unstyled,
    91 ol.unstyled {
     130.list-unstyled,
     131ul.list-unstyled,
     132ol.list-unstyled {
    92133  margin-left: 0;
    93134  list-style: none;
     
    95136
    96137// Single-line list items
    97 ul.inline,
    98 ol.inline {
    99   margin-left: 0;
    100   list-style: none;
     138.list-inline,
     139ul.list-inline,
     140ol.list-inline {
     141        .list-unstyled();
     142        margin-left: -5px;
    101143  & > li {
    102144    display: inline-block;
    103     /*padding-left: 5px;*/
     145    padding-left: 5px;
    104146    padding-right: 5px;
    105147  }
     
    110152dl dd {}
    111153dl dt, dl dd { padding-left: @indentStep; }
    112 @media (min-width: 1200px) { dl dt, dl dd { padding-left: @indentStep1200; } }
    113 @media (max-width: 979px) { dl dt, dl dd { padding-left: @indentStep768; } }
     154@media (min-width: @screen-lg-min) { dl dt, dl dd { padding-left: @indentStep1200; } }
     155@media (max-width: @screen-sm-max) { dl dt, dl dd { padding-left: @indentStep768; } }
    114156
    115157// Horizontal layout (like forms)
    116158.dl-horizontal {
    117   .clearfix(); // Ensure dl clears floats if empty dd elements present
    118   dt {
    119     float: left;
    120     width: @horizontalComponentOffset - 20;
    121     clear: left;
    122     text-align: right;
    123     .text-overflow();
    124     padding-left:0;
    125   }
    126   dd {
    127     padding-left:0;
    128     margin-left: @horizontalComponentOffset;
    129   }
     159        dd {
     160   &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present
     161 }
     162
     163 @media (min-width: @grid-float-breakpoint) {
     164   dt {
     165     float: left;
     166     width: (@dl-horizontal-offset - 20);
     167     clear: left;
     168     text-align: right;
     169     .text-overflow();
     170   }
     171   dd {
     172     margin-left: @dl-horizontal-offset;
     173   }
     174 }
    130175}
    131176
     
    147192q { font-style: italic; }
    148193blockquote { margin:0;padding: 0 @indentStep; }
    149 @media (min-width: 1200px) {
     194@media (min-width: @screen-lg-min) {
    150195  blockquote { padding: 0 @indentStep1200; }
    151196}
    152 @media (max-width: 979px) {
     197@media (max-width: @screen-sm-max) {
    153198  blockquote { padding: 0 @indentStep768; }
    154199}
     
    157202// Blockquotes
    158203blockquote {
    159   border-left: 1px solid @grayLight;
    160   small {
    161     display: block;
    162     line-height: inherit;
    163     color: @grayLight;
    164     &:before {
    165       content: '\2014 \00A0';
     204        font-size: @blockquote-font-size;
     205        border-left: 1px solid @blockquote-border-color;
     206
     207        p,
     208        ul,
     209        ol {
     210                &:last-child {
     211                        margin-bottom: 0;
     212                }
     213        }
     214
     215 // Note: Deprecated small and .small as of v3.1.0
     216 // Context: https://github.com/twbs/bootstrap/issues/11660
     217 footer,
     218 small,
     219 .small {
     220   display: block;
     221         line-height: inherit;
     222   color: @blockquote-small-color;
     223
     224   &:before {
     225     content: '\2014 \00A0'; // em dash, nbsp
     226   }
     227 }
     228}
     229
     230
     231// Opposite alignment of blockquote
     232//
     233// Heads up: `blockquote.pull-right` has been deprecated as of v3.1.0.
     234.blockquote-reverse,
     235blockquote.pull-right {
     236  border-right: 5px solid @blockquote-border-color;
     237  border-left: 0;
     238  text-align: right;
     239
     240  // Account for citation
     241  footer,
     242  small,
     243  .small {
     244    &:before { content: ''; }
     245    &:after {
     246      content: '\00A0 \2014'; // nbsp, em dash
    166247    }
    167248  }
    168 
    169   // Float right with text-align: right
    170   &.pull-right {
    171     float: right;
    172     border-right: 1px solid @grayLight;
    173     border-left: 0;
    174     text-align: right;
    175     small {
    176       &:before {
    177         content: '';
    178       }
    179       &:after {
    180         content: '\00A0 \2014';
    181       }
    182     }
    183   }
    184 }
    185 
     249}
     250
     251// Addresses
    186252address { font-style: italic; }
    187253
     
    192258
    193259.lead {
    194   margin-bottom: @baseLineHeight;
     260  margin-bottom: @line-height-computed;
    195261  font-size: 1.5em;
    196262  font-weight: 200;
     
    234300
    235301.page-header {
    236   padding-bottom: (@baseLineHeight / 2) - 1;
    237   margin: @baseLineHeight 0 (@baseLineHeight * 1.5);
    238   border-bottom: 1px solid @grayLighter;
     302  padding-bottom: (@line-height-computed / 2) - 1;
     303  margin: @line-height-computed 0 (@line-height-computed * 1.5);
     304  border-bottom: 1px solid @page-header-border-color;
    239305}
    240306
     
    246312.secondary { h5,.h5,.h5-like {&:extend(h6); small {display: block;}}}
    247313
    248 .hero-unit h1 {word-wrap: break-word;}
    249 
    250 .chapo {font-weight: bold;color:lighten(@textColor,7%);}
    251 .spip_surligne { background-color: @infoBackground; color: @infoText;}
     314.jumbotron h1 {word-wrap: break-word;}
     315
     316.chapo {font-weight: bold;color:lighten(@text-color,7%);}
     317.spip_surligne { background-color: @state-info-bg; color: @state-info-text;}
    252318#descriptif_site_spip {.lead}
    253319
     
    267333/* Citations, poesie */
    268334blockquote.spip { min-height: 40px; }
    269 .spip_poesie { border-left: 1px solid @grayLight; }
     335.spip_poesie { border-left: 1px solid @blockquote-border-color; }
    270336.spip_poesie div { margin-left: @indentStep; text-indent: -1 * @indentStep; }
    271 @media (min-width: 1200px) {
     337@media (min-width: @screen-lg-min) {
    272338  .spip_poesie div { margin-left: @indentStep1200; text-indent: -1 * @indentStep1200; }
    273339}
    274 @media (max-width: 979px) {
     340@media (max-width: @screen-sm-max) {
    275341  .spip_poesie div { margin-left: @indentStep768; text-indent: -1 * @indentStep768; }
    276342}
  • _plugins_/bootstrap/trunk/bootstrap2spip/css/variables.less

    r69754 r90743  
    44
    55
    6 // Global values
    7 // --------------------------------------------------
    8 
    9 
    10 // Grays
    11 // -------------------------
    12 @black:                 #000;
    13 @grayDarker:            #222;
    14 @grayDark:              #333;
    15 @gray:                  #555;
    16 @grayLight:             #999;
    17 @grayLighter:           #eee;
    18 @white:                 #fff;
    19 
    20 
    21 // Accent colors
    22 // -------------------------
    23 @blue:                  #049cdb;
    24 @blueDark:              #0064cd;
    25 @green:                 #46a546;
    26 @red:                   #9d261d;
    27 @yellow:                #ffc40d;
    28 @orange:                #f89406;
    29 @pink:                  #c3325f;
    30 @purple:                #7a43b6;
    31 
    32 
    33 // Scaffolding
    34 // -------------------------
    35 @bodyBackground:        @white;
    36 @textColor:             @grayDark;
    37 
    38 
    39 // Links
    40 // -------------------------
    41 @linkColor:             #900;
    42 @linkColorHover:        darken(@linkColor, 15%);
    43 
    44 
    45 // Typography
    46 // -------------------------
    47 @sansFontFamily:        "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
    48 @serifFontFamily:       Georgia, Cambria, Times New Roman, Times, serif;
    49 @monoFontFamily:        "Courier New", Courier, monospace;
    50 
    51 @baseFontSize:          14px;
    52 @baseFontFamily:        @serifFontFamily;
    53 @baseLineHeight:        20px;
    54 @altFontFamily:         @sansFontFamily;
    55 
    56 @headingsFontFamily:    @baseFontFamily; // empty to use BS default, @baseFontFamily
    57 @headingsFontWeight:    normal;    // instead of browser default, bold
    58 @headingsColor:         inherit; // empty to use BS default, @textColor
    59 
    60 
    61 // Component sizing
    62 // -------------------------
    63 // Based on 14px font-size and 20px line-height
    64 
    65 @fontSizeLarge:         @baseFontSize * 1.25; // ~18px
    66 @fontSizeSmall:         @baseFontSize * 0.85; // ~12px
    67 @fontSizeMini:          @baseFontSize * 0.75; // ~11px
    68 
    69 @paddingLarge:          11px 19px; // 44px
    70 @paddingSmall:          2px 10px;  // 26px
    71 @paddingMini:           0 6px;   // 22px
    72 
    73 @baseBorderRadius:      4px;
    74 @borderRadiusLarge:     6px;
    75 @borderRadiusSmall:     3px;
    76 
    77 
    78 // Tables
    79 // -------------------------
    80 @tableBackground:                   transparent; // overall background-color
    81 @tableBackgroundAccent:             #f9f9f9; // for striping
    82 @tableBackgroundHover:              #f5f5f5; // for hover
    83 @tableBorder:                       #ddd; // table and cell border
    84 
    85 // Buttons
    86 // -------------------------
    87 @btnBackground:                     @white;
    88 @btnBackgroundHighlight:            darken(@white, 10%);
    89 @btnBorder:                         #bbb;
    90 
    91 @btnPrimaryBackground:              @linkColor;
    92 @btnPrimaryBackgroundHighlight:     spin(@btnPrimaryBackground, 20%);
    93 
    94 @btnInfoBackground:                 #5bc0de;
    95 @btnInfoBackgroundHighlight:        #2f96b4;
    96 
    97 @btnSuccessBackground:              #62c462;
    98 @btnSuccessBackgroundHighlight:     #51a351;
    99 
    100 @btnWarningBackground:              lighten(@orange, 15%);
    101 @btnWarningBackgroundHighlight:     @orange;
    102 
    103 @btnDangerBackground:               #ee5f5b;
    104 @btnDangerBackgroundHighlight:      #bd362f;
    105 
    106 @btnInverseBackground:              #444;
    107 @btnInverseBackgroundHighlight:     @grayDarker;
    108 
    109 
    110 // Forms
    111 // -------------------------
    112 @inputBackground:               @white;
    113 @inputBorder:                   #ccc;
    114 @inputBorderRadius:             @baseBorderRadius;
    115 @inputDisabledBackground:       @grayLighter;
    116 @formActionsBackground:         #f5f5f5;
    117 @inputHeight:                   @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
    118 
    119 
    120 // Dropdowns
    121 // -------------------------
    122 @dropdownBackground:            @white;
    123 @dropdownBorder:                rgba(0,0,0,.2);
    124 @dropdownDividerTop:            #e5e5e5;
    125 @dropdownDividerBottom:         @white;
    126 
    127 @dropdownLinkColor:             @grayDark;
    128 @dropdownLinkColorHover:        @white;
    129 @dropdownLinkColorActive:       @white;
    130 
    131 @dropdownLinkBackgroundActive:  @linkColor;
    132 @dropdownLinkBackgroundHover:   @dropdownLinkBackgroundActive;
    133 
    134 
    135 
    136 // COMPONENT VARIABLES
    137 // --------------------------------------------------
    138 
    139 
    140 // Z-index master list
    141 // -------------------------
    142 // Used for a bird's eye view of components dependent on the z-axis
    143 // Try to avoid customizing these :)
    144 @zindexDropdown:          1000;
    145 @zindexPopover:           1010;
    146 @zindexTooltip:           1030;
    147 @zindexFixedNavbar:       1030;
    148 @zindexModalBackdrop:     1040;
    149 @zindexModal:             1050;
    150 
    151 
    152 // Sprite icons path
    153 // -------------------------
    154 @iconSpritePath:          "../img/glyphicons-halflings.png";
    155 @iconWhiteSpritePath:     "../img/glyphicons-halflings-white.png";
    156 
    157 
    158 // Input placeholder text color
    159 // -------------------------
    160 @placeholderText:         @grayLight;
    161 
    162 
    163 // Hr border color
    164 // -------------------------
    165 @hrBorder:                @grayLighter;
    166 
    167 
    168 // Horizontal forms & lists
    169 // -------------------------
    170 @horizontalComponentOffset:       180px;
    171 
    172 
    173 // Wells
    174 // -------------------------
    175 @wellBackground:                  #f5f5f5;
    176 
    177 
    178 // Navbar
    179 // -------------------------
    180 @navbarCollapseWidth:             767px;
    181 @navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;
    182 
    183 @navbarHeight:                    40px;
    184 @navbarBackgroundHighlight:       #ffffff;
    185 @navbarBackground:                darken(@navbarBackgroundHighlight, 5%);
    186 @navbarBorder:                    darken(@navbarBackground, 12%);
    187 
    188 @navbarText:                      #777;
    189 @navbarLinkColor:                 #777;
    190 @navbarLinkColorHover:            @grayDark;
    191 @navbarLinkColorActive:           @gray;
    192 @navbarLinkBackgroundHover:       transparent;
    193 @navbarLinkBackgroundActive:      darken(@navbarBackground, 5%);
    194 
    195 @navbarBrandColor:                @navbarLinkColor;
    196 
    197 // Inverted navbar
    198 @navbarInverseBackground:                #111111;
    199 @navbarInverseBackgroundHighlight:       #222222;
    200 @navbarInverseBorder:                    #252525;
    201 
    202 @navbarInverseText:                      @grayLight;
    203 @navbarInverseLinkColor:                 @grayLight;
    204 @navbarInverseLinkColorHover:            @white;
    205 @navbarInverseLinkColorActive:           @navbarInverseLinkColorHover;
    206 @navbarInverseLinkBackgroundHover:       transparent;
    207 @navbarInverseLinkBackgroundActive:      @navbarInverseBackground;
    208 
    209 @navbarInverseSearchBackground:          lighten(@navbarInverseBackground, 25%);
    210 @navbarInverseSearchBackgroundFocus:     @white;
    211 @navbarInverseSearchBorder:              @navbarInverseBackground;
    212 @navbarInverseSearchPlaceholderColor:    #ccc;
    213 
    214 @navbarInverseBrandColor:                @navbarInverseLinkColor;
    215 
    216 
    217 // Pagination
    218 // -------------------------
    219 @paginationBackground:                #fff;
    220 @paginationBorder:                    #ddd;
    221 @paginationActiveBackground:          #f5f5f5;
    222 
    223 
    224 // Hero unit
    225 // -------------------------
    226 @heroUnitBackground:              @grayLighter;
    227 @heroUnitHeadingColor:            inherit;
    228 @heroUnitLeadColor:               inherit;
    229 
    230 
    231 // Form states and alerts
    232 // -------------------------
    233 @warningText:             #c09853;
    234 @warningBackground:       #fcf8e3;
    235 @warningBorder:           darken(spin(@warningBackground, -10), 3%);
    236 
    237 @errorText:               #b94a48;
    238 @errorBackground:         #f2dede;
    239 @errorBorder:             darken(spin(@errorBackground, -10), 3%);
    240 
    241 @successText:             #468847;
    242 @successBackground:       #dff0d8;
    243 @successBorder:           darken(spin(@successBackground, -10), 5%);
    244 
    245 @infoText:                #3a87ad;
    246 @infoBackground:          #d9edf7;
    247 @infoBorder:              darken(spin(@infoBackground, -10), 7%);
    248 
    249 
    250 // Tooltips and popovers
    251 // -------------------------
    252 @tooltipColor:            #fff;
    253 @tooltipBackground:       #000;
    254 @tooltipArrowWidth:       5px;
    255 @tooltipArrowColor:       @tooltipBackground;
    256 
    257 @popoverBackground:       #fff;
    258 @popoverArrowWidth:       10px;
    259 @popoverArrowColor:       #fff;
    260 @popoverTitleBackground:  darken(@popoverBackground, 3%);
    261 
    262 // Special enhancement for popovers
    263 @popoverArrowOuterWidth:  @popoverArrowWidth + 1;
    264 @popoverArrowOuterColor:  rgba(0,0,0,.25);
    265 
    266 
    267 
    268 // GRID
    269 // --------------------------------------------------
    270 
    271 
    272 // Default 940px grid
    273 // -------------------------
    274 @gridColumns:             12;
    275 @gridColumnWidth:         60px;
    276 @gridGutterWidth:         20px;
    277 @gridRowWidth:            (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
    278 
    279 // 1200px min
    280 @gridColumnWidth1200:     70px;
    281 @gridGutterWidth1200:     30px;
    282 @gridRowWidth1200:        (@gridColumns * @gridColumnWidth1200) + (@gridGutterWidth1200 * (@gridColumns - 1));
    283 
    284 // 768px-979px
    285 @gridColumnWidth768:      42px;
    286 @gridGutterWidth768:      20px;
    287 @gridRowWidth768:         (@gridColumns * @gridColumnWidth768) + (@gridGutterWidth768 * (@gridColumns - 1));
    288 
    289 
    290 // Fluid grid
    291 // -------------------------
    292 @fluidGridColumnWidth:    percentage(@gridColumnWidth/@gridRowWidth);
    293 @fluidGridGutterWidth:    percentage(@gridGutterWidth/@gridRowWidth);
    294 
    295 // 1200px min
    296 @fluidGridColumnWidth1200:     percentage(@gridColumnWidth1200/@gridRowWidth1200);
    297 @fluidGridGutterWidth1200:     percentage(@gridGutterWidth1200/@gridRowWidth1200);
    298 
    299 // 768px-979px
    300 @fluidGridColumnWidth768:      percentage(@gridColumnWidth768/@gridRowWidth768);
    301 @fluidGridGutterWidth768:      percentage(@gridGutterWidth768/@gridRowWidth768);
     6//== Colors
     7//
     8//## Gray and brand colors for use across Bootstrap.
     9
     10@gray-base:              #000;
     11@gray-darker:            lighten(@gray-base, 13.5%); // #222
     12@gray-dark:              lighten(@gray-base, 20%);   // #333
     13@gray:                   lighten(@gray-base, 33.5%); // #555
     14@gray-light:             lighten(@gray-base, 46.7%); // #777
     15@gray-lighter:           lighten(@gray-base, 93.5%); // #eee
     16
     17@brand-primary:         #900; // #337ab7
     18@brand-success:         #5cb85c;
     19@brand-info:            #5bc0de;
     20@brand-warning:         #f0ad4e;
     21@brand-danger:          #d9534f;
     22
     23
     24//== Scaffolding
     25//
     26//## Settings for some of the most global styles.
     27
     28//** Background color for `<body>`.
     29@body-bg:               #fff;
     30//** Global text color on `<body>`.
     31@text-color:            @gray-dark;
     32
     33//** Global textual link color.
     34@link-color:            @brand-primary;
     35//** Link hover color set via `darken()` function.
     36@link-hover-color:      darken(@link-color, 15%);
     37//** Link hover decoration.
     38@link-hover-decoration: underline;
     39
     40
     41//== Typography
     42//
     43//## Font, line-height, and color for body text, headings, and more.
     44
     45@font-family-sans-serif:  "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;;
     46@font-family-serif:       Georgia, Cambria, Times New Roman, Times, serif;
     47//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
     48@font-family-monospace:   "Courier New", Courier, monospace;
     49@font-family-base:        @font-family-serif;
     50
     51@font-size-base:          14px;
     52@font-size-large:         ceil((@font-size-base * 1.25)); // ~18px
     53@font-size-small:         ceil((@font-size-base * 0.85)); // ~12px
     54
     55@font-size-h1:            2em;
     56@font-size-h2:            1.5em;
     57@font-size-h3:            1.25em;
     58@font-size-h4:            1.1em;
     59@font-size-h5:            1em;
     60@font-size-h6:            1em;
     61
     62//** Unit-less `line-height` for use in components like buttons.
     63@line-height-base:        1.428571429; // 20/14
     64//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
     65@line-height-computed:    floor((@font-size-base * @line-height-base)); // ~20px
     66
     67//** By default, this inherits from the `<body>`.
     68@headings-font-family:    inherit;
     69@headings-font-weight:    500;
     70@headings-line-height:    1.1;
     71@headings-color:          inherit;
     72
     73
     74//== Iconography
     75//
     76//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
     77
     78//** Load fonts from this directory.
     79@icon-font-path:          "../fonts/";
     80//** File name for all font files.
     81@icon-font-name:          "glyphicons-halflings-regular";
     82//** Element ID within SVG icon file.
     83@icon-font-svg-id:        "glyphicons_halflingsregular";
     84
     85
     86//== Components
     87//
     88//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
     89
     90@padding-base-vertical:     6px;
     91@padding-base-horizontal:   12px;
     92
     93@padding-large-vertical:    10px;
     94@padding-large-horizontal:  16px;
     95
     96@padding-small-vertical:    5px;
     97@padding-small-horizontal:  10px;
     98
     99@padding-xs-vertical:       1px;
     100@padding-xs-horizontal:     5px;
     101
     102@line-height-large:         1.3333333; // extra decimals for Win 8.1 Chrome
     103@line-height-small:         1.5;
     104
     105@border-radius-base:        4px;
     106@border-radius-large:       6px;
     107@border-radius-small:       3px;
     108
     109//** Global color for active items (e.g., navs or dropdowns).
     110@component-active-color:    #fff;
     111//** Global background color for active items (e.g., navs or dropdowns).
     112@component-active-bg:       @brand-primary;
     113
     114//** Width of the `border` for generating carets that indicator dropdowns.
     115@caret-width-base:          4px;
     116//** Carets increase slightly in size for larger components.
     117@caret-width-large:         5px;
     118
     119
     120//== Tables
     121//
     122//## Customizes the `.table` component with basic values, each used across all table variations.
     123
     124//** Padding for `<th>`s and `<td>`s.
     125@table-cell-padding:            8px;
     126//** Padding for cells in `.table-condensed`.
     127@table-condensed-cell-padding:  5px;
     128
     129//** Default background color used for all tables.
     130@table-bg:                      transparent;
     131//** Background color used for `.table-striped`.
     132@table-bg-accent:               #f9f9f9;
     133//** Background color used for `.table-hover`.
     134@table-bg-hover:                #f5f5f5;
     135@table-bg-active:               @table-bg-hover;
     136
     137//** Border color for table and cell borders.
     138@table-border-color:            #ddd;
     139
     140
     141//== Buttons
     142//
     143//## For each of Bootstrap's buttons, define text, background and border color.
     144
     145@btn-font-weight:                normal;
     146
     147@btn-default-color:              #333;
     148@btn-default-bg:                 #fff;
     149@btn-default-border:             #bbb;
     150
     151@btn-primary-color:              #fff;
     152@btn-primary-bg:                 @brand-primary;
     153@btn-primary-border:             darken(@btn-primary-bg, 5%);
     154
     155@btn-success-color:              #fff;
     156@btn-success-bg:                 @brand-success;
     157@btn-success-border:             darken(@btn-success-bg, 5%);
     158
     159@btn-info-color:                 #fff;
     160@btn-info-bg:                    @brand-info;
     161@btn-info-border:                darken(@btn-info-bg, 5%);
     162
     163@btn-warning-color:              #fff;
     164@btn-warning-bg:                 @brand-warning;
     165@btn-warning-border:             darken(@btn-warning-bg, 5%);
     166
     167@btn-danger-color:               #fff;
     168@btn-danger-bg:                  @brand-danger;
     169@btn-danger-border:              darken(@btn-danger-bg, 5%);
     170
     171@btn-link-disabled-color:        @gray-light;
     172
     173// Allows for customizing button radius independently from global border radius
     174@btn-border-radius-base:         @border-radius-base;
     175@btn-border-radius-large:        @border-radius-large;
     176@btn-border-radius-small:        @border-radius-small;
     177
     178
     179//== Forms
     180//
     181//##
     182
     183//** `<input>` background color
     184@input-bg:                       #fff;
     185//** `<input disabled>` background color
     186@input-bg-disabled:              @gray-lighter;
     187
     188//** Text color for `<input>`s
     189@input-color:                    @gray;
     190//** `<input>` border color
     191@input-border:                   #ccc;
     192
     193// TODO: Rename `@input-border-radius` to `@input-border-radius-base` in v4
     194//** Default `.form-control` border radius
     195// This has no effect on `<select>`s in some browsers, due to the limited stylability of `<select>`s in CSS.
     196@input-border-radius:            @border-radius-base;
     197//** Large `.form-control` border radius
     198@input-border-radius-large:      @border-radius-large;
     199//** Small `.form-control` border radius
     200@input-border-radius-small:      @border-radius-small;
     201
     202//** Border color for inputs on focus
     203@input-border-focus:             #66afe9;
     204
     205//** Placeholder text color
     206@input-color-placeholder:        #999;
     207
     208//** Default `.form-control` height
     209@input-height-base:              (@line-height-computed + (@padding-base-vertical * 2) + 2);
     210//** Large `.form-control` height
     211@input-height-large:             (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
     212//** Small `.form-control` height
     213@input-height-small:             (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
     214
     215//** `.form-group` margin
     216@form-group-margin-bottom:       15px;
     217
     218@legend-color:                   @gray-dark;
     219@legend-border-color:            #e5e5e5;
     220
     221//** Background color for textual input addons
     222@input-group-addon-bg:           @gray-lighter;
     223//** Border color for textual input addons
     224@input-group-addon-border-color: @input-border;
     225
     226//** Disabled cursor for form controls and buttons.
     227@cursor-disabled:                not-allowed;
     228
     229
     230//== Dropdowns
     231//
     232//## Dropdown menu container and contents.
     233
     234//** Background for the dropdown menu.
     235@dropdown-bg:                    #fff;
     236//** Dropdown menu `border-color`.
     237@dropdown-border:                rgba(0,0,0,.15);
     238//** Dropdown menu `border-color` **for IE8**.
     239@dropdown-fallback-border:       #ccc;
     240//** Divider color for between dropdown items.
     241@dropdown-divider-bg:            #e5e5e5;
     242
     243//** Dropdown link text color.
     244@dropdown-link-color:            @gray-dark;
     245//** Hover color for dropdown links.
     246@dropdown-link-hover-color:      darken(@gray-dark, 5%);
     247//** Hover background for dropdown links.
     248@dropdown-link-hover-bg:         #f5f5f5;
     249
     250//** Active dropdown menu item text color.
     251@dropdown-link-active-color:     @component-active-color;
     252//** Active dropdown menu item background color.
     253@dropdown-link-active-bg:        @component-active-bg;
     254
     255//** Disabled dropdown menu item background color.
     256@dropdown-link-disabled-color:   @gray-light;
     257
     258//** Text color for headers within dropdown menus.
     259@dropdown-header-color:          @gray-light;
     260
     261//** Deprecated `@dropdown-caret-color` as of v3.1.0
     262@dropdown-caret-color:           #000;
     263
     264
     265//-- Z-index master list
     266//
     267// Warning: Avoid customizing these values. They're used for a bird's eye view
     268// of components dependent on the z-axis and are designed to all work together.
     269//
     270// Note: These variables are not generated into the Customizer.
     271
     272@zindex-navbar:            1000;
     273@zindex-dropdown:          1000;
     274@zindex-popover:           1060;
     275@zindex-tooltip:           1070;
     276@zindex-navbar-fixed:      1030;
     277@zindex-modal-background:  1040;
     278@zindex-modal:             1050;
     279
     280
     281//== Media queries breakpoints
     282//
     283//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
     284
     285// Extra small screen / phone
     286//** Deprecated `@screen-xs` as of v3.0.1
     287@screen-xs:                  480px;
     288//** Deprecated `@screen-xs-min` as of v3.2.0
     289@screen-xs-min:              @screen-xs;
     290//** Deprecated `@screen-phone` as of v3.0.1
     291@screen-phone:               @screen-xs-min;
     292
     293// Small screen / tablet
     294//** Deprecated `@screen-sm` as of v3.0.1
     295@screen-sm:                  768px;
     296@screen-sm-min:              @screen-sm;
     297//** Deprecated `@screen-tablet` as of v3.0.1
     298@screen-tablet:              @screen-sm-min;
     299
     300// Medium screen / desktop
     301//** Deprecated `@screen-md` as of v3.0.1
     302@screen-md:                  992px;
     303@screen-md-min:              @screen-md;
     304//** Deprecated `@screen-desktop` as of v3.0.1
     305@screen-desktop:             @screen-md-min;
     306
     307// Large screen / wide desktop
     308//** Deprecated `@screen-lg` as of v3.0.1
     309@screen-lg:                  1200px;
     310@screen-lg-min:              @screen-lg;
     311//** Deprecated `@screen-lg-desktop` as of v3.0.1
     312@screen-lg-desktop:          @screen-lg-min;
     313
     314// So media queries don't overlap when required, provide a maximum
     315@screen-xs-max:              (@screen-sm-min - 1);
     316@screen-sm-max:              (@screen-md-min - 1);
     317@screen-md-max:              (@screen-lg-min - 1);
     318
     319
     320//== Grid system
     321//
     322//## Define your custom responsive grid.
     323
     324//** Number of columns in the grid.
     325@grid-columns:              12;
     326//** Padding between columns. Gets divided in half for the left and right.
     327@grid-gutter-width:         30px;
     328// Navbar collapse
     329//** Point at which the navbar becomes uncollapsed.
     330@grid-float-breakpoint:     @screen-sm-min;
     331//** Point at which the navbar begins collapsing.
     332@grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
     333
     334
     335//== Container sizes
     336//
     337//## Define the maximum width of `.container` for different screen sizes.
     338
     339// Small screen / tablet
     340@container-tablet:             (720px + @grid-gutter-width);
     341//** For `@screen-sm-min` and up.
     342@container-sm:                 @container-tablet;
     343
     344// Medium screen / desktop
     345@container-desktop:            (940px + @grid-gutter-width);
     346//** For `@screen-md-min` and up.
     347@container-md:                 @container-desktop;
     348
     349// Large screen / wide desktop
     350@container-large-desktop:      (1140px + @grid-gutter-width);
     351//** For `@screen-lg-min` and up.
     352@container-lg:                 @container-large-desktop;
     353
     354
     355//== Navbar
     356//
     357//##
     358
     359// Basics of a navbar
     360@navbar-height:                    50px;
     361@navbar-margin-bottom:             @line-height-computed;
     362@navbar-border-radius:             @border-radius-base;
     363@navbar-padding-horizontal:        floor((@grid-gutter-width / 2));
     364@navbar-padding-vertical:          ((@navbar-height - @line-height-computed) / 2);
     365@navbar-collapse-max-height:       340px;
     366
     367@navbar-default-color:             #777;
     368@navbar-default-bg:                #f8f8f8;
     369@navbar-default-border:            darken(@navbar-default-bg, 6.5%);
     370
     371// Navbar links
     372@navbar-default-link-color:                #777;
     373@navbar-default-link-hover-color:          #333;
     374@navbar-default-link-hover-bg:             transparent;
     375@navbar-default-link-active-color:         #555;
     376@navbar-default-link-active-bg:            darken(@navbar-default-bg, 6.5%);
     377@navbar-default-link-disabled-color:       #ccc;
     378@navbar-default-link-disabled-bg:          transparent;
     379
     380// Navbar brand label
     381@navbar-default-brand-color:               @navbar-default-link-color;
     382@navbar-default-brand-hover-color:         darken(@navbar-default-brand-color, 10%);
     383@navbar-default-brand-hover-bg:            transparent;
     384
     385// Navbar toggle
     386@navbar-default-toggle-hover-bg:           #ddd;
     387@navbar-default-toggle-icon-bar-bg:        #888;
     388@navbar-default-toggle-border-color:       #ddd;
     389
     390
     391//=== Inverted navbar
     392// Reset inverted navbar basics
     393@navbar-inverse-color:                      lighten(@gray-light, 15%);
     394@navbar-inverse-bg:                         #222;
     395@navbar-inverse-border:                     darken(@navbar-inverse-bg, 10%);
     396
     397// Inverted navbar links
     398@navbar-inverse-link-color:                 lighten(@gray-light, 15%);
     399@navbar-inverse-link-hover-color:           #fff;
     400@navbar-inverse-link-hover-bg:              transparent;
     401@navbar-inverse-link-active-color:          @navbar-inverse-link-hover-color;
     402@navbar-inverse-link-active-bg:             darken(@navbar-inverse-bg, 10%);
     403@navbar-inverse-link-disabled-color:        #444;
     404@navbar-inverse-link-disabled-bg:           transparent;
     405
     406// Inverted navbar brand label
     407@navbar-inverse-brand-color:                @navbar-inverse-link-color;
     408@navbar-inverse-brand-hover-color:          #fff;
     409@navbar-inverse-brand-hover-bg:             transparent;
     410
     411// Inverted navbar toggle
     412@navbar-inverse-toggle-hover-bg:            #333;
     413@navbar-inverse-toggle-icon-bar-bg:         #fff;
     414@navbar-inverse-toggle-border-color:        #333;
     415
     416
     417//== Navs
     418//
     419//##
     420
     421//=== Shared nav styles
     422@nav-link-padding:                          10px 15px;
     423@nav-link-hover-bg:                         @gray-lighter;
     424
     425@nav-disabled-link-color:                   @gray-light;
     426@nav-disabled-link-hover-color:             @gray-light;
     427
     428//== Tabs
     429@nav-tabs-border-color:                     #ddd;
     430
     431@nav-tabs-link-hover-border-color:          @gray-lighter;
     432
     433@nav-tabs-active-link-hover-bg:             @body-bg;
     434@nav-tabs-active-link-hover-color:          @gray;
     435@nav-tabs-active-link-hover-border-color:   #ddd;
     436
     437@nav-tabs-justified-link-border-color:            #ddd;
     438@nav-tabs-justified-active-link-border-color:     @body-bg;
     439
     440//== Pills
     441@nav-pills-border-radius:                   @border-radius-base;
     442@nav-pills-active-link-hover-bg:            @component-active-bg;
     443@nav-pills-active-link-hover-color:         @component-active-color;
     444
     445
     446//== Pagination
     447//
     448//##
     449
     450@pagination-color:                     @link-color;
     451@pagination-bg:                        #fff;
     452@pagination-border:                    #ddd;
     453
     454@pagination-hover-color:               @link-hover-color;
     455@pagination-hover-bg:                  @gray-lighter;
     456@pagination-hover-border:              #ddd;
     457
     458@pagination-active-color:              #fff;
     459@pagination-active-bg:                 @brand-primary;
     460@pagination-active-border:             @brand-primary;
     461
     462@pagination-disabled-color:            @gray-light;
     463@pagination-disabled-bg:               #fff;
     464@pagination-disabled-border:           #ddd;
     465
     466
     467//== Pager
     468//
     469//##
     470
     471@pager-bg:                             @pagination-bg;
     472@pager-border:                         @pagination-border;
     473@pager-border-radius:                  15px;
     474
     475@pager-hover-bg:                       @pagination-hover-bg;
     476
     477@pager-active-bg:                      @pagination-active-bg;
     478@pager-active-color:                   @pagination-active-color;
     479
     480@pager-disabled-color:                 @pagination-disabled-color;
     481
     482
     483//== Jumbotron
     484//
     485//##
     486
     487@jumbotron-padding:              30px;
     488@jumbotron-color:                inherit;
     489@jumbotron-bg:                   @gray-lighter;
     490@jumbotron-heading-color:        inherit;
     491@jumbotron-font-size:            ceil((@font-size-base * 1.5));
     492@jumbotron-heading-font-size:    ceil((@font-size-base * 4.5));
     493
     494
     495//== Form states and alerts
     496//
     497//## Define colors for form feedback states and, by default, alerts.
     498
     499@state-success-text:             #3c763d;
     500@state-success-bg:               #dff0d8;
     501@state-success-border:           darken(spin(@state-success-bg, -10), 5%);
     502
     503@state-info-text:                #31708f;
     504@state-info-bg:                  #d9edf7;
     505@state-info-border:              darken(spin(@state-info-bg, -10), 7%);
     506
     507@state-warning-text:             #8a6d3b;
     508@state-warning-bg:               #fcf8e3;
     509@state-warning-border:           darken(spin(@state-warning-bg, -10), 5%);
     510
     511@state-danger-text:              #a94442;
     512@state-danger-bg:                #f2dede;
     513@state-danger-border:            darken(spin(@state-danger-bg, -10), 5%);
     514
     515
     516//== Tooltips
     517//
     518//##
     519
     520//** Tooltip max width
     521@tooltip-max-width:           200px;
     522//** Tooltip text color
     523@tooltip-color:               #fff;
     524//** Tooltip background color
     525@tooltip-bg:                  #000;
     526@tooltip-opacity:             .9;
     527
     528//** Tooltip arrow width
     529@tooltip-arrow-width:         5px;
     530//** Tooltip arrow color
     531@tooltip-arrow-color:         @tooltip-bg;
     532
     533
     534//== Popovers
     535//
     536//##
     537
     538//** Popover body background color
     539@popover-bg:                          #fff;
     540//** Popover maximum width
     541@popover-max-width:                   276px;
     542//** Popover border color
     543@popover-border-color:                rgba(0,0,0,.2);
     544//** Popover fallback border color
     545@popover-fallback-border-color:       #ccc;
     546
     547//** Popover title background color
     548@popover-title-bg:                    darken(@popover-bg, 3%);
     549
     550//** Popover arrow width
     551@popover-arrow-width:                 10px;
     552//** Popover arrow color
     553@popover-arrow-color:                 @popover-bg;
     554
     555//** Popover outer arrow width
     556@popover-arrow-outer-width:           (@popover-arrow-width + 1);
     557//** Popover outer arrow color
     558@popover-arrow-outer-color:           fadein(@popover-border-color, 5%);
     559//** Popover outer arrow fallback color
     560@popover-arrow-outer-fallback-color:  darken(@popover-fallback-border-color, 20%);
     561
     562
     563//== Labels
     564//
     565//##
     566
     567//** Default label background color
     568@label-default-bg:            @gray-light;
     569//** Primary label background color
     570@label-primary-bg:            @brand-primary;
     571//** Success label background color
     572@label-success-bg:            @brand-success;
     573//** Info label background color
     574@label-info-bg:               @brand-info;
     575//** Warning label background color
     576@label-warning-bg:            @brand-warning;
     577//** Danger label background color
     578@label-danger-bg:             @brand-danger;
     579
     580//** Default label text color
     581@label-color:                 #fff;
     582//** Default text color of a linked label
     583@label-link-hover-color:      #fff;
     584
     585
     586//== Modals
     587//
     588//##
     589
     590//** Padding applied to the modal body
     591@modal-inner-padding:         15px;
     592
     593//** Padding applied to the modal title
     594@modal-title-padding:         15px;
     595//** Modal title line-height
     596@modal-title-line-height:     @line-height-base;
     597
     598//** Background color of modal content area
     599@modal-content-bg:                             #fff;
     600//** Modal content border color
     601@modal-content-border-color:                   rgba(0,0,0,.2);
     602//** Modal content border color **for IE8**
     603@modal-content-fallback-border-color:          #999;
     604
     605//** Modal backdrop background color
     606@modal-backdrop-bg:           #000;
     607//** Modal backdrop opacity
     608@modal-backdrop-opacity:      .5;
     609//** Modal header border color
     610@modal-header-border-color:   #e5e5e5;
     611//** Modal footer border color
     612@modal-footer-border-color:   @modal-header-border-color;
     613
     614@modal-lg:                    900px;
     615@modal-md:                    600px;
     616@modal-sm:                    300px;
     617
     618
     619//== Alerts
     620//
     621//## Define alert colors, border radius, and padding.
     622
     623@alert-padding:               15px;
     624@alert-border-radius:         @border-radius-base;
     625@alert-link-font-weight:      bold;
     626
     627@alert-success-bg:            @state-success-bg;
     628@alert-success-text:          @state-success-text;
     629@alert-success-border:        @state-success-border;
     630
     631@alert-info-bg:               @state-info-bg;
     632@alert-info-text:             @state-info-text;
     633@alert-info-border:           @state-info-border;
     634
     635@alert-warning-bg:            @state-warning-bg;
     636@alert-warning-text:          @state-warning-text;
     637@alert-warning-border:        @state-warning-border;
     638
     639@alert-danger-bg:             @state-danger-bg;
     640@alert-danger-text:           @state-danger-text;
     641@alert-danger-border:         @state-danger-border;
     642
     643
     644//== Progress bars
     645//
     646//##
     647
     648//** Background color of the whole progress component
     649@progress-bg:                 #f5f5f5;
     650//** Progress bar text color
     651@progress-bar-color:          #fff;
     652//** Variable for setting rounded corners on progress bar.
     653@progress-border-radius:      @border-radius-base;
     654
     655//** Default progress bar color
     656@progress-bar-bg:             @brand-primary;
     657//** Success progress bar color
     658@progress-bar-success-bg:     @brand-success;
     659//** Warning progress bar color
     660@progress-bar-warning-bg:     @brand-warning;
     661//** Danger progress bar color
     662@progress-bar-danger-bg:      @brand-danger;
     663//** Info progress bar color
     664@progress-bar-info-bg:        @brand-info;
     665
     666
     667//== List group
     668//
     669//##
     670
     671//** Background color on `.list-group-item`
     672@list-group-bg:                 #fff;
     673//** `.list-group-item` border color
     674@list-group-border:             #ddd;
     675//** List group border radius
     676@list-group-border-radius:      @border-radius-base;
     677
     678//** Background color of single list items on hover
     679@list-group-hover-bg:           #f5f5f5;
     680//** Text color of active list items
     681@list-group-active-color:       @component-active-color;
     682//** Background color of active list items
     683@list-group-active-bg:          @component-active-bg;
     684//** Border color of active list elements
     685@list-group-active-border:      @list-group-active-bg;
     686//** Text color for content within active list items
     687@list-group-active-text-color:  lighten(@list-group-active-bg, 40%);
     688
     689//** Text color of disabled list items
     690@list-group-disabled-color:      @gray-light;
     691//** Background color of disabled list items
     692@list-group-disabled-bg:         @gray-lighter;
     693//** Text color for content within disabled list items
     694@list-group-disabled-text-color: @list-group-disabled-color;
     695
     696@list-group-link-color:         #555;
     697@list-group-link-hover-color:   @list-group-link-color;
     698@list-group-link-heading-color: #333;
     699
     700
     701//== Panels
     702//
     703//##
     704
     705@panel-bg:                    #fff;
     706@panel-body-padding:          15px;
     707@panel-heading-padding:       10px 15px;
     708@panel-footer-padding:        @panel-heading-padding;
     709@panel-border-radius:         @border-radius-base;
     710
     711//** Border color for elements within panels
     712@panel-inner-border:          #ddd;
     713@panel-footer-bg:             #f5f5f5;
     714
     715@panel-default-text:          @gray-dark;
     716@panel-default-border:        #ddd;
     717@panel-default-heading-bg:    #f5f5f5;
     718
     719@panel-primary-text:          #fff;
     720@panel-primary-border:        @brand-primary;
     721@panel-primary-heading-bg:    @brand-primary;
     722
     723@panel-success-text:          @state-success-text;
     724@panel-success-border:        @state-success-border;
     725@panel-success-heading-bg:    @state-success-bg;
     726
     727@panel-info-text:             @state-info-text;
     728@panel-info-border:           @state-info-border;
     729@panel-info-heading-bg:       @state-info-bg;
     730
     731@panel-warning-text:          @state-warning-text;
     732@panel-warning-border:        @state-warning-border;
     733@panel-warning-heading-bg:    @state-warning-bg;
     734
     735@panel-danger-text:           @state-danger-text;
     736@panel-danger-border:         @state-danger-border;
     737@panel-danger-heading-bg:     @state-danger-bg;
     738
     739
     740//== Thumbnails
     741//
     742//##
     743
     744//** Padding around the thumbnail image
     745@thumbnail-padding:           4px;
     746//** Thumbnail background color
     747@thumbnail-bg:                @body-bg;
     748//** Thumbnail border color
     749@thumbnail-border:            #ddd;
     750//** Thumbnail border radius
     751@thumbnail-border-radius:     @border-radius-base;
     752
     753//** Custom text color for thumbnail captions
     754@thumbnail-caption-color:     @text-color;
     755//** Padding around the thumbnail caption
     756@thumbnail-caption-padding:   9px;
     757
     758
     759//== Wells
     760//
     761//##
     762
     763@well-bg:                     #f5f5f5;
     764@well-border:                 darken(@well-bg, 7%);
     765
     766
     767//== Badges
     768//
     769//##
     770
     771@badge-color:                 #fff;
     772//** Linked badge text color on hover
     773@badge-link-hover-color:      #fff;
     774@badge-bg:                    @gray-light;
     775
     776//** Badge text color in active nav link
     777@badge-active-color:          @link-color;
     778//** Badge background color in active nav link
     779@badge-active-bg:             #fff;
     780
     781@badge-font-weight:           bold;
     782@badge-line-height:           1;
     783@badge-border-radius:         10px;
     784
     785
     786//== Breadcrumbs
     787//
     788//##
     789
     790@breadcrumb-padding-vertical:   8px;
     791@breadcrumb-padding-horizontal: 15px;
     792//** Breadcrumb background color
     793@breadcrumb-bg:                 #f5f5f5;
     794//** Breadcrumb text color
     795@breadcrumb-color:              #ccc;
     796//** Text color of current page in the breadcrumb
     797@breadcrumb-active-color:       @gray-light;
     798//** Textual separator for between breadcrumb elements
     799@breadcrumb-separator:          "/";
     800
     801
     802//== Carousel
     803//
     804//##
     805
     806@carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6);
     807
     808@carousel-control-color:                      #fff;
     809@carousel-control-width:                      15%;
     810@carousel-control-opacity:                    .5;
     811@carousel-control-font-size:                  20px;
     812
     813@carousel-indicator-active-bg:                #fff;
     814@carousel-indicator-border-color:             #fff;
     815
     816@carousel-caption-color:                      #fff;
     817
     818
     819//== Close
     820//
     821//##
     822
     823@close-font-weight:           bold;
     824@close-color:                 #000;
     825@close-text-shadow:           0 1px 0 #fff;
     826
     827
     828//== Code
     829//
     830//##
     831
     832@code-color:                  #c7254e;
     833@code-bg:                     #f9f2f4;
     834
     835@kbd-color:                   #fff;
     836@kbd-bg:                      #333;
     837
     838@pre-bg:                      #f5f5f5;
     839@pre-color:                   @gray-dark;
     840@pre-border-color:            #ccc;
     841@pre-scrollable-max-height:   340px;
     842
     843
     844//== Type
     845//
     846//##
     847
     848//** Horizontal offset for forms and lists.
     849@component-offset-horizontal: 180px;
     850//** Text muted color
     851@text-muted:                  @gray-light;
     852//** Abbreviations and acronyms border color
     853@abbr-border-color:           @gray-light;
     854//** Headings small color
     855@headings-small-color:        @gray-light;
     856//** Blockquote small color
     857@blockquote-small-color:      @gray-light;
     858//** Blockquote font size
     859@blockquote-font-size:        (@font-size-base * 1.25);
     860//** Blockquote border color
     861@blockquote-border-color:     @gray-lighter;
     862//** Page header border color
     863@page-header-border-color:    @gray-lighter;
     864//** Width of horizontal description list titles
     865@dl-horizontal-offset:        @component-offset-horizontal;
     866//** Horizontal line color.
     867@hr-border:                   @gray-lighter;
Note: See TracChangeset for help on using the changeset viewer.