_ Git - blog/blob - _sass/_base.scss

   1 // Body resets
   2 //
   3 // Update the foundational and global aspects of the page.
   4
   5 * {
   6   -webkit-box-sizing: border-box;
   7      -moz-box-sizing: border-box;
   8           box-sizing: border-box;
   9 }
  10
  11 html,
  12 body {
  13   margin: 0;
  14   padding: 0;
  15 }
  16
  17 html {
  18   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  19   font-size: 16px;
  20   line-height: 1.5;
  21
  22   @media (min-width: 38em) {
  23     font-size: 18px;
  24   }
  25 }
  26
  27 body {
  28   color: #515151;
  29   background-color: #fff;
  30   -webkit-text-size-adjust: 100%;
  31       -ms-text-size-adjust: 100%;
  32 }
  33
  34 // No `:visited` state is required by default (browsers will use `a`)
  35 a {
  36   color: #268bd2;
  37   text-decoration: none;
  38
  39   // `:focus` is linked to `:hover` for basic accessibility
  40   &:hover,
  41   &:focus {
  42     text-decoration: underline;
  43   }
  44
  45   strong {
  46     color: inherit;
  47   }
  48 }
  49
  50 img {
  51   display: block;
  52   max-width: 100%;
  53   margin: 0 0 1rem;
  54   border-radius: 5px;
  55 }
  56
  57 table {
  58   margin-bottom: 1rem;
  59   width: 100%;
  60   font-size: 85%;
  61   border: 1px solid #e5e5e5;
  62   border-collapse: collapse;
  63 }
  64
  65 td,
  66 th {
  67   padding: .25rem .5rem;
  68   border: 1px solid #e5e5e5;
  69 }
  70
  71 th {
  72   text-align: left;
  73 }
  74
  75 tbody tr:nth-child(odd) td,
  76 tbody tr:nth-child(odd) th {
  77   background-color: #f9f9f9;
  78 }