Home | History | Annotate | Download | only in bootstrap
      1 //
      2 // Scaffolding
      3 // --------------------------------------------------
      4 
      5 
      6 // Reset the box-sizing
      7 //
      8 // Heads up! This reset may cause conflicts with some third-party widgets.
      9 // For recommendations on resolving such conflicts, see
     10 // http://getbootstrap.com/getting-started/#third-box-sizing
     11 * {
     12   .box-sizing(border-box);
     13 }
     14 *:before,
     15 *:after {
     16   .box-sizing(border-box);
     17 }
     18 
     19 
     20 // Body reset
     21 
     22 html {
     23   font-size: 10px;
     24   -webkit-tap-highlight-color: rgba(0,0,0,0);
     25 }
     26 
     27 body {
     28   font-family: @font-family-base;
     29   font-size: @font-size-base;
     30   line-height: @line-height-base;
     31   color: @text-color;
     32   background-color: @body-bg;
     33 }
     34 
     35 // Reset fonts for relevant elements
     36 input,
     37 button,
     38 select,
     39 textarea {
     40   font-family: inherit;
     41   font-size: inherit;
     42   line-height: inherit;
     43 }
     44 
     45 
     46 // Links
     47 
     48 a {
     49   color: @link-color;
     50   text-decoration: none;
     51 
     52   &:hover,
     53   &:focus {
     54     color: @link-hover-color;
     55     text-decoration: @link-hover-decoration;
     56   }
     57 
     58   &:focus {
     59     .tab-focus();
     60   }
     61 }
     62 
     63 
     64 // Figures
     65 //
     66 // We reset this here because previously Normalize had no `figure` margins. This
     67 // ensures we don't break anyone's use of the element.
     68 
     69 figure {
     70   margin: 0;
     71 }
     72 
     73 
     74 // Images
     75 
     76 img {
     77   vertical-align: middle;
     78 }
     79 
     80 // Responsive images (ensure images don't scale beyond their parents)
     81 .img-responsive {
     82   .img-responsive();
     83 }
     84 
     85 // Rounded corners
     86 .img-rounded {
     87   border-radius: @border-radius-large;
     88 }
     89 
     90 // Image thumbnails
     91 //
     92 // Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`.
     93 .img-thumbnail {
     94   padding: @thumbnail-padding;
     95   line-height: @line-height-base;
     96   background-color: @thumbnail-bg;
     97   border: 1px solid @thumbnail-border;
     98   border-radius: @thumbnail-border-radius;
     99   .transition(all .2s ease-in-out);
    100 
    101   // Keep them at most 100% wide
    102   .img-responsive(inline-block);
    103 }
    104 
    105 // Perfect circle
    106 .img-circle {
    107   border-radius: 50%; // set radius in percents
    108 }
    109 
    110 
    111 // Horizontal rules
    112 
    113 hr {
    114   margin-top:    @line-height-computed;
    115   margin-bottom: @line-height-computed;
    116   border: 0;
    117   border-top: 1px solid @hr-border;
    118 }
    119 
    120 
    121 // Only display content to screen readers
    122 //
    123 // See: http://a11yproject.com/posts/how-to-hide-content/
    124 
    125 .sr-only {
    126   position: absolute;
    127   width: 1px;
    128   height: 1px;
    129   margin: -1px;
    130   padding: 0;
    131   overflow: hidden;
    132   clip: rect(0,0,0,0);
    133   border: 0;
    134 }
    135 
    136 // Use in conjunction with .sr-only to only display content when it's focused.
    137 // Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
    138 // Credit: HTML5 Boilerplate
    139 
    140 .sr-only-focusable {
    141   &:active,
    142   &:focus {
    143     position: static;
    144     width: auto;
    145     height: auto;
    146     margin: 0;
    147     overflow: visible;
    148     clip: auto;
    149   }
    150 }
    151 
    152 
    153 // iOS "clickable elements" fix for role="button"
    154 //
    155 // Fixes "clickability" issue (and more generally, the firing of events such as focus as well)
    156 // for traditionally non-focusable elements with role="button"
    157 // see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
    158 // Upstream patch for normalize.css submitted: https://github.com/necolas/normalize.css/pull/379 - remove this fix once that is merged
    159 
    160 [role="button"] {
    161   cursor: pointer;
    162 }