PerformanceTests/JetStream/JetStream.css

   1 body {
   2     font-family: "Helvetica Neue", Helvetica, Verdana, sans-serif;
   3     font-size: 14px;
   4     line-height: 19px;
   5     background-image: url(Swoosh.png);
   6     background-repeat: no-repeat;
   7     background-position: center -40px;
   8     background-size: 3000px auto;
   9     padding-bottom: 00px;
  10 }
  11
  12 ::selection {
  13     background-color: rgb(19, 157, 215);
  14     color: white;
  15 }
  16
  17 main {
  18     display: block; /* For IE11 */
  19     width: 850px;
  20     margin: auto;
  21     text-align: center;
  22     padding: 10px;
  23 }
  24
  25 img {
  26     -webkit-user-select: none;
  27     -webkit-user-drag: none;
  28 }
  29
  30 #logo {
  31     width: 621px;
  32     height: 96px;
  33     margin-top: 40px;
  34 }
  35
  36 #magic {
  37     position: absolute;
  38     top: -900px;
  39     left: -900px;
  40     width: 300px;
  41     height: 300px;
  42     display: none;
  43 }
  44
  45 @media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 2dppx), (min-resolution: 192dpi) {
  46     #logo {
  47         content: url(JetStream-Logo@2x.png); /* FIXME: This does not work in Firefox. */
  48     }
  49
  50     body {
  51         background-image: url(Swoosh@2x.png);
  52     }
  53 }
  54
  55 p.summary {
  56     margin: 18px auto 5px;
  57     background-image: -webkit-linear-gradient(right, white 70%, rgba(255, 255, 255, 0));
  58     background-image: -moz-linear-gradient(right, white 70%, rgba(255, 255, 255, 0));
  59     background-image: linear-gradient(to right, white 70%, rgba(255, 255, 255, 0));
  60     padding: 15px 125px 0;
  61     text-align: center;
  62 }
  63
  64 p.summary + p.summary {
  65     padding-top: 5px;
  66     margin-top: 5px;
  67 }
  68
  69 p.summary:empty {
  70     display: none;
  71 }
  72
  73 h1 {
  74     color: rgb(19, 157, 215);
  75     text-align: left;
  76     margin-top: 40px;
  77 }
  78
  79 p {
  80     text-align: left;
  81     text-indent: 20px;
  82 }
  83
  84 p:first-of-type {
  85     text-indent: 0;
  86 }
  87
  88 dt {
  89     margin-top: 10px;
  90     font-weight: bold;
  91     text-align: left;
  92 }
  93
  94 dd {
  95     text-align: left;
  96     padding: 10px 20px;
  97     margin: 0;
  98 }
  99
 100 #status {
 101     margin-top: 20px;
 102 }
 103
 104 #status {
 105     height: 20px;
 106 }
 107
 108 #status a:link {
 109     font-weight: bold;
 110 }
 111
 112 #result-summary:empty {
 113     display: none;
 114 }
 115
 116 #result-summary {
 117         margin-top: 20px;
 118 }
 119
 120 #result-summary label {
 121     font-weight: bold;
 122 }
 123
 124 #result-summary .score {
 125         font-weight: bold;
 126     font-size: 40px;
 127         line-height: 40px;
 128     color: rgb(19, 157, 215);
 129 }
 130
 131 #result-summary .score .interval {
 132         display: block;
 133         font-size: 16px;
 134         line-height: 16px;
 135         font-weight: normal;
 136 }
 137
 138 .interval {
 139     opacity: 0.75;
 140 }
 141
 142 a:link, a:visited {
 143     color: rgb(19, 157, 215);
 144     text-decoration: none;
 145 }
 146
 147 a:link:hover {
 148     text-decoration: underline;
 149 }
 150
 151 table {
 152     border-spacing: 0;
 153     border-collapse: collapse;
 154     margin-top: 15px;
 155     width: 100%;
 156     table-layout: fixed;
 157 }
 158
 159 td, th {
 160     padding: 4px 8px;
 161 }
 162
 163 th {
 164     font-size: 12px;
 165 }
 166
 167 tr:first-child > th:nth-child(odd):not(:first-child) {
 168     border-left: 15px solid white;
 169 }
 170
 171 tr:first-child > th:nth-child(odd) {
 172     text-align: left;
 173 }
 174
 175 tr:first-child > th:nth-child(even) {
 176     width: px;
 177 }
 178
 179 tr:nth-child(even):not(:first-child) {
 180     background-color: rgb(230, 238, 242);
 181 }
 182
 183 .result {
 184     color: rgb(19, 157, 215);
 185     white-space: nowrap;
 186 }
 187
 188 .benchmark-name {
 189     white-space: nowrap;
 190     text-align: left;
 191 }
 192
 193 .result.category,
 194 .benchmark-name.category {
 195     font-weight: bold;
 196 }
 197
 198 .benchmark-name:not(.category):not(.geometric-mean) {
 199     text-indent: 0.5em;
 200 }
 201
 202 .geometric-mean {
 203     font-weight: bold;
 204 }
 205
 206 .benchmark-name:not(:first-child) {
 207     border-left: 15px solid white;
 208 }
 209
 210 .benchmark-name a:link,
 211 .benchmark-name a:visited {
 212     color: black;
 213 }
 214
 215 .highlighted-result {
 216     background-color: rgb(19, 157, 215);
 217     color: white;
 218 }