git.sesse.net Git - pkanalytics/blob - ultimate.css

   1 :root {
   2         font-family: sans-serif;
   3         background-color: white;
   4         color: #111;
   5 }
   6 #mainmenu {
   7         text-transform: uppercase;
   8         color: #3366dd;
   9         font-weight: bold;
  10         padding-top: 10px;
  11         padding-bottom: 10px;
  12         margin-bottom: 10px;
  13         font-size: 90%;
  14         border-top: 1px solid #ddd;
  15         border-bottom: 1px solid #ddd;
  16 }
  17 #mainmenu span, #mainmenu a {
  18         padding-left: 20px;
  19         padding-right: 20px;
  20         padding-bottom: 9px;
  21 }
  22 #mainmenu span {
  23         border-bottom: 3px solid #3366dd;
  24 }
  25 #mainmenu a {
  26         color: rgba(0, 0, 0, 0.6);
  27         text-decoration: none;
  28 }
  29 .filter {
  30         padding-left: 10px;
  31         margin-top: 0;
  32         padding-top: 0;
  33         border-bottom: 1px solid #ddd;
  34         padding-bottom: 10px;
  35         margin-bottom: 10px;
  36 }
  37 .filtermenus {
  38         margin-bottom: 20px;
  39 }
  40 .filter-icon {
  41         vertical-align: middle;
  42 }
  43 .filter-legend {
  44         vertical-align: bottom;
  45         font-size: 14px;
  46         font-weight: bold;
  47 }
  48 .filter-pill {
  49         display: inline-block;
  50         vertical-align: bottom;
  51         margin-left: 5px;
  52         margin-top: 0;
  53         font-size: 13px;
  54         background-color: #35f;
  55         color: white;
  56         border-radius: 6px;
  57         padding-left: 6px;
  58         padding-right: 6px;
  59 }
  60 .filter-click-to-add {
  61         margin-left: 10px;
  62         vertical-align: bottom;
  63         font-size: 14px;
  64         font-style: italic;
  65         color: rgba(0, 0, 0, 0.4);
  66 }
  67 #filter-add-container {
  68         display: inline-block;
  69         top: 2px;
  70 }
  71 #filter-add-menu, #filter-submenu {
  72         z-index: 1;
  73 }
  74 #filter-add-menu {
  75         display: none;
  76         /* display: block; */
  77         border: 1px solid black;
  78         position: absolute;
  79         top: 27px;
  80         left: 10px;
  81         background: white;
  82         width: 250px;
  83 }
  84 #filter-add-menu div.option, #filter-submenu div.option {
  85         padding-left: 10px;
  86         padding-top: 8px;
  87         padding-bottom: 8px;
  88         white-space: nowrap;
  89 }
  90 #filter-add-menu div.option:hover, #filter-submenu div.option:hover {
  91         background-color: #eee;
  92 }
  93 #filter-add-menu div.arrow {
  94         display: inline-block;
  95         position: absolute;
  96         right: 10px;
  97 }
  98 #filter-submenu {
  99         display: none;
 100         border: 1px solid black;
 101         position: absolute;
 102         top: 27px;  /* JavaScript will override with 35px extra for each line the submenu should be moved down. */
 103         left: 261px;
 104         background: white;
 105 }
 106 #filter-submenu div.option {
 107         padding-right: 12px;
 108 }
 109 .filter:not(:nth-child(1 of .filter)) svg,
 110 .filter:not(:nth-child(1 of .filter)) .filter-legend {
 111         opacity: 0;
 112 }
 113 div.option input[type="checkbox"] {
 114         margin-right: 0.5em;
 115 }
 116 table {
 117         border-collapse: collapse;
 118         margin-bottom: calc(100vh - 4lh);
 119 }
 120 th {
 121         background-color: rgb(95% 95% 95%);
 122         position: sticky;
 123         z-index: 0;
 124         top: 0;
 125 }
 126 tr {
 127         border-top: 1px solid #ddd;
 128         border-bottom: 1px solid #ddd;
 129 }
 130 th, td {
 131         margin-left: 0;
 132         margin-right: 0;
 133         padding-left: 3px;
 134         padding-right: 3px;
 135         line-height: 2em;
 136 }
 137 th {
 138         padding-left: 15px;
 139         padding-right: 15px;
 140 }
 141 td {
 142         white-space: nowrap;
 143 }
 144 td.num {  /* Surrounded by pad. */
 145         text-align: right;
 146         max-width: content-width;
 147 }
 148 td:not(.pad) {
 149         width: 1px;  /* Causes pad to stretch. */
 150 }
 151 td.name {
 152         padding-right: 20px;
 153 }
 154
 155 .ci, .invertedci, .fillerci {
 156         vertical-align: middle;
 157         margin-left: 8px;
 158 }
 159
 160 .ci .marker { stroke: #000; stroke-width: 2px; }
 161 .ci .range.s0 { fill: #fdd; }
 162 .ci .range.s1 { fill: #dfd; }
 163
 164 .invertedci .marker { stroke: #000; stroke-width: 2px; }
 165 .invertedci .range.s0 { fill: #dfd; }
 166 .invertedci .range.s1 { fill: #fdd; }
 167
 168 .bar { fill: steelblue; }
 169
 170 .filtermarker { font-size: smaller; text-transform: uppercase; }