static/critical.css

   1 @font-face {
   2   font-family: 'Inconsolata';
   3   src: local('Inconsolata'), url(/Inconsolata.woff2) format('woff2'), url(/Inconsolata.woff) format('woff');
   4 }
   5
   6 @font-face {
   7   font-family: 'Roboto';
   8   font-style: normal;
   9   font-weight: 400;
  10   src: local('Roboto'), local('Roboto Regular'), local('Roboto-Regular'), url(/Roboto-Regular.woff2) format('woff2'), url(/Roboto-Regular.woff) format('woff');
  11 }
  12
  13 @font-face {
  14   font-family: 'Roboto';
  15   font-style: normal;
  16   font-weight: 700;
  17   /* TODO: is local('Roboto Bold') really correct? */
  18   src: local('Roboto Bold'), local('Roboto-Bold'), url(/Roboto-Bold.woff2) format('woff2'), url(/Roboto-Bold.woff) format('woff');
  19 }
  20
  21 body {
  22         background-image: linear-gradient(to bottom, #d7d9e2, #fff 70px);
  23         background-position: 0 0;
  24         background-repeat: repeat-x;
  25         font-family: 'Roboto', sans-serif;
  26         font-size: 100%;
  27         line-height: 1.5;
  28         letter-spacing: 0.15px;
  29         margin: 0;
  30         padding: 0;
  31 }
  32
  33 #header {
  34         padding: 0 10px 0 52px;
  35 }
  36
  37 #logo {
  38         position: absolute;
  39         top: 0;
  40         left: 0;
  41         border-left: 1px solid transparent;
  42         border-right: 1px solid transparent;
  43         border-bottom: 1px solid transparent;
  44         width: 50px;
  45         height: 5.07em;
  46         min-height: 65px;
  47 }
  48
  49 #logo a {
  50         display: block;
  51         height: 100%;
  52 }
  53
  54 #logo img {
  55         margin-top: 5px;
  56         position: absolute;
  57         bottom: 0.3em;
  58         overflow: auto;
  59         border: 0;
  60 }
  61
  62 p.section {
  63         margin: 0;
  64         padding: 0 5px 0 5px;
  65         font-family: monospace;
  66         font-size: 13px;
  67         line-height: 16px;
  68         color: white;
  69         letter-spacing: 0.08em;
  70         position: absolute;
  71         top: 0px;
  72         left: 52px;
  73         background-color: #c70036;
  74 }
  75
  76 p.section a {
  77         color: white;
  78         text-decoration: none;
  79 }
  80
  81 #searchbox input[type=text] {
  82         width: 350px;
  83 }
  84
  85 .hidecss {
  86         display: none;
  87 }
  88
  89 #searchbox {
  90         text-align:left;
  91         line-height: 1;
  92         margin: 0 10px 0 0.5em;
  93         padding: 1px 0 1px 0;
  94         position: absolute;
  95         top: 0;
  96         right: 0;
  97         font-size: .75em;
  98 }
  99
 100 #navbar {
 101         border-bottom: 1px solid #c70036;
 102 }
 103
 104 #navbar ul {
 105         margin: 0;
 106         padding: 0;
 107         overflow: hidden;
 108 }
 109
 110 #navbar li {
 111         list-style: none;
 112         float: left;
 113 }
 114
 115 #navbar a {
 116         display: block;
 117         padding: 1.75em .5em .25em .5em;
 118         color: #0035c7;
 119         text-decoration: none;
 120         border-left: 1px solid transparent;
 121         border-right: 1px solid transparent;
 122 }
 123
 124 #navbar a:hover
 125 , #navbar a:visited:hover {
 126         background-color: #f5f6f7;
 127         border-left: 1px solid  #d2d3d7;
 128         border-right: 1px solid #d2d3d7;
 129         text-decoration: underline;
 130 }
 131
 132 a:link {
 133         color: #0035c7;
 134 }
 135
 136 a:visited {
 137         color: #54638c;
 138 }
 139
 140 #breadcrumbs {
 141         line-height: 2;
 142         min-height: 20px;
 143         margin: 0;
 144         padding: 0;
 145         font-size: 0.75em;
 146         background-color: #f5f6f7;
 147         border-bottom: 1px solid #d2d3d7;
 148 }
 149
 150 #breadcrumbs:before {
 151         content: "/";
 152         margin-left: 0.5em;
 153         margin-right: 0.5em;
 154 }
 155
 156 @keyframes pos {
 157         from {
 158                 transform: translateX(-40px);
 159         }
 160         to {
 161                 transform: translateX(0px);
 162         }
 163 }
 164
 165 #content {
 166         margin: 0 10px 0 52px;
 167 }
 168
 169 #progressbar {
 170         margin-top: 1em;
 171         margin-bottom: 1em;
 172         width: 100%;
 173         border-radius: 4px;
 174         /* Workaround for WebKit bug (border-radius on the left side was not
 175         effective when .stripes is animated to negative x positions, see
 176         http://stackoverflow.com/a/10296258 */
 177         -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
 178         background-color: #333;
 179         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
 180         overflow: hidden;
 181         height: 30px;
 182 }
 183
 184 .progress-active {
 185         height: 30px;
 186         line-height: 28px;
 187         overflow: hidden;
 188 }
 189
 190 .stripes {
 191         height: 30px;
 192         /* We shift the background image by 40px, so we need to have an extra 40px
 193          * of repeated background image. */
 194         /* Using - - instead of + is a workaround for a yui-compressor issue, see
 195          * https://github.com/yui/yuicompressor/issues/59 */
 196         width: calc(100% - -40px);
 197         background-color: #cc1446;
 198 }
 199
 200 .progress-active .stripes {
 201         background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
 202         background-size: 40px 40px;
 203         animation: pos 2s linear infinite;
 204 }
 205
 206 #progressbar span {
 207         position: absolute;
 208         left: 0;
 209         right: 0;
 210         text-align: center;
 211         line-height: 28px;
 212         color: white;
 213         z-index: 1;
 214 }
 215
 216 #footer {
 217         border: 1px solid #dfdfe0;
 218         border-left: 0;
 219         border-right: 0;
 220         background-color: #f5f6f7;
 221         padding: 1em;
 222         margin: 0 10px 0 52px;
 223         font-size: 0.75em;
 224         line-height: 1.5em;
 225 }
 226
 227 hr {
 228         border-top: 1px solid #d2d3d7;
 229         border-bottom: 1px solid white;
 230         border-left: 0;
 231         border-right: 0;
 232         margin: 1.4375em 0 1.5em 0;
 233         height: 0;
 234         background-color: #bbb;
 235 }
 236