utils/test/reporting/3rd_party/sass/base/_typography.scss

   1 ///\r
   2 /// Phantom by HTML5 UP\r
   3 /// html5up.net | @ajlkn\r
   4 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)\r
   5 ///\r
   6 \r
   7 /* Type */\r
   8 \r
   9         body, input, select, textarea {\r
  10                 color: _palette(fg);\r
  11                 font-family: _font(family);\r
  12                 font-size: 16pt;\r
  13                 font-weight: _font(weight);\r
  14                 line-height: 1.75;\r
  15 \r
  16                 @include breakpoint(xlarge) {\r
  17                         font-size: 14pt;\r
  18                 }\r
  19 \r
  20                 @include breakpoint(large) {\r
  21                         font-size: 12pt;\r
  22                 }\r
  23         }\r
  24 \r
  25         a {\r
  26                 @include vendor('transition', (\r
  27                         'border-bottom-color #{_duration(transition)} ease',\r
  28                         'color #{_duration(transition)} ease'\r
  29                 ));\r
  30                 text-decoration: none;\r
  31                 color: _palette(fg);\r
  32                 border-bottom: dotted 1px transparentize(_palette(fg), 0.5);\r
  33 \r
  34                 &:hover {\r
  35                         border-bottom-color: transparent;\r
  36                         color: _palette(accent1) !important;\r
  37                 }\r
  38         }\r
  39 \r
  40         strong, b {\r
  41                 color: _palette(fg-bold);\r
  42                 font-weight: _font(weight-bold);\r
  43         }\r
  44 \r
  45         em, i {\r
  46                 font-style: italic;\r
  47         }\r
  48 \r
  49         p {\r
  50                 margin: 0 0 _size(element-margin) 0;\r
  51         }\r
  52 \r
  53         h1 {\r
  54                 font-size: 2.75em;\r
  55                 color: _palette(fg-bold);\r
  56                 font-weight: _font(weight-bold-alt);\r
  57                 line-height: 1.3;\r
  58                 margin: 0 0 (_size(element-margin) * 0.5) 0;\r
  59                 letter-spacing: _font(letter-spacing-alt);\r
  60 \r
  61                 a {\r
  62                         color: inherit;\r
  63                 }\r
  64 \r
  65                 @include breakpoint(small) {\r
  66                         font-size: 2em;\r
  67                         margin: 0 0 (_size(element-margin) * 0.5) 0;\r
  68                 }\r
  69 \r
  70                 @include breakpoint(xxsmall) {\r
  71                         font-size: 1.75em;\r
  72                 }\r
  73         }\r
  74 \r
  75         h2, h3, h4, h5, h6 {\r
  76                 color: _palette(fg-bold);\r
  77                 font-weight: _font(weight-bold);\r
  78                 line-height: 1.5;\r
  79                 margin: 0 0 (_size(element-margin) * 1) 0;\r
  80                 text-transform: uppercase;\r
  81                 letter-spacing: _font(letter-spacing);\r
  82 \r
  83                 a {\r
  84                         color: inherit;\r
  85                 }\r
  86         }\r
  87 \r
  88         h2 {\r
  89                 font-size: 1.1em;\r
  90         }\r
  91 \r
  92         h3 {\r
  93                 font-size: 1em;\r
  94         }\r
  95 \r
  96         h4 {\r
  97                 font-size: 0.8em;\r
  98         }\r
  99 \r
 100         h5 {\r
 101                 font-size: 0.8em;\r
 102         }\r
 103 \r
 104         h6 {\r
 105                 font-size: 0.8em;\r
 106         }\r
 107 \r
 108         @include breakpoint(medium) {\r
 109                 h1, h2, h3, h4, h5, h6 {\r
 110                         br {\r
 111                                 display: none;\r
 112                         }\r
 113                 }\r
 114         }\r
 115 \r
 116         @include breakpoint(small) {\r
 117                 h2 {\r
 118                         font-size: 1em;\r
 119                 }\r
 120 \r
 121                 h3 {\r
 122                         font-size: 0.8em;\r
 123                 }\r
 124         }\r
 125 \r
 126         sub {\r
 127                 font-size: 0.8em;\r
 128                 position: relative;\r
 129                 top: 0.5em;\r
 130         }\r
 131 \r
 132         sup {\r
 133                 font-size: 0.8em;\r
 134                 position: relative;\r
 135                 top: -0.5em;\r
 136         }\r
 137 \r
 138         blockquote {\r
 139                 border-left: solid (_size(border-width) * 4) _palette(border);\r
 140                 font-style: italic;\r
 141                 margin: 0 0 _size(element-margin) 0;\r
 142                 padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);\r
 143         }\r
 144 \r
 145         code {\r
 146                 background: _palette(border-bg);\r
 147                 border-radius: _size(border-radius);\r
 148                 border: solid _size(border-width) _palette(border);\r
 149                 font-family: _font(family-fixed);\r
 150                 font-size: 0.9em;\r
 151                 margin: 0 0.25em;\r
 152                 padding: 0.25em 0.65em;\r
 153         }\r
 154 \r
 155         pre {\r
 156                 -webkit-overflow-scrolling: touch;\r
 157                 font-family: _font(family-fixed);\r
 158                 font-size: 0.9em;\r
 159                 margin: 0 0 _size(element-margin) 0;\r
 160 \r
 161                 code {\r
 162                         display: block;\r
 163                         line-height: 1.75;\r
 164                         padding: 1em 1.5em;\r
 165                         overflow-x: auto;\r
 166                 }\r
 167         }\r
 168 \r
 169         hr {\r
 170                 border: 0;\r
 171                 border-bottom: solid _size(border-width) _palette(border);\r
 172                 margin: _size(element-margin) 0;\r
 173 \r
 174                 &.major {\r
 175                         margin: (_size(element-margin) * 1.5) 0;\r
 176                 }\r
 177         }\r
 178 \r
 179         .align-left {\r
 180                 text-align: left;\r
 181         }\r
 182 \r
 183         .align-center {\r
 184                 text-align: center;\r
 185         }\r
 186 \r
 187         .align-right {\r
 188                 text-align: right;\r
 189         }