web/squid.css

   1 body {
   2  font-size:.8rem;
   3  background-color:#eee
   4 }
   5
   6 html, body {
   7  height:100%;
   8  margin:0;
   9  padding:0
  10 }
  11
  12 header, .main {
  13  position:absolute;
  14  width:100%
  15 }
  16
  17 header {
  18  position:fixed;
  19  z-index:2000;
  20  float:left;
  21  height:5rem;
  22  transition:box-shadow .2s;
  23  box-shadow:0 2px 5px rgba(0,0,0,.26);
  24  color:white;
  25  background:deepskyblue
  26 }
  27
  28 footer {
  29  font-size:.8rem;
  30  overflow:hidden;
  31  text-align:right;
  32  white-space:nowrap;
  33  color:#aaa;
  34  text-shadow:0 0 2px #bbb;
  35  padding:1rem
  36 }
  37
  38 footer > a {
  39  text-decoration:none;
  40  color:#aaa
  41 }
  42
  43 .main {
  44  position:relative;
  45  top:5rem;
  46  bottom:0;
  47  overflow-y:auto;
  48  height:calc(100% - 5rem)
  49 }
  50
  51 #menu {
  52  position:fixed;
  53  top:5rem;
  54  float:left;
  55  overflow-x:auto;
  56  width:calc(0% + 15rem);
  57  height:calc(100% - 4rem);
  58  background-color:white
  59 }
  60
  61 .main-right {
  62  float:right;
  63  width:calc(100% - 15rem);
  64  height:calc(100% - 1rem);
  65  background-color:#eee
  66 }
  67
  68 header > .fill > .container {
  69  margin-top:.5rem;
  70  -webkit-user-select:none;
  71  -moz-user-select:none;
  72  -ms-user-select:none;
  73  user-select:none;
  74  padding:.5rem 1rem 0
  75 }
  76
  77 header > .fill > .container > #logo {
  78  margin:0 3.5rem 0 1.5rem
  79 }
  80
  81 header > .fill > .container > #logo > img {
  82  width: 3rem;
  83  margin-top:-.1rem
  84 }
  85
  86 header > .fill > .container > #brand {
  87  font-size:1.4rem;
  88  position:absolute;
  89  cursor:default;
  90  vertical-align:text-bottom;
  91  text-decoration:none;
  92  color:white;
  93  padding-top: 0.5rem;
  94 }
  95
  96 .nav {
  97  font-size: 1.15rem;
  98  margin-top: 0.5rem;
  99  padding: 0;
 100 }
 101
 102 .slide {
 103  list-style-type: none;
 104  padding: 0;
 105  user-select: none;
 106  display: none;
 107 }
 108
 109 .category {
 110  padding: 0.4rem 1rem;
 111  cursor: pointer;
 112 }
 113
 114 .slide-menu {
 115  padding: 0.4rem 2rem;
 116  list-style-type: none;
 117  cursor: pointer;
 118  user-select: none;
 119 }
 120
 121 .menu-item {
 122  padding: 0.2rem;
 123  list-style-type: none;
 124  cursor: pointer;
 125  user-select: none;
 126 }
 127
 128 .menu-item:hover, .category:hover {
 129  background-color: lightgray;
 130 }
 131
 132 #report-name {
 133  padding: 1rem;
 134  font-size: 2rem;
 135 }
 136
 137 .selector {
 138  display: inline-block;
 139  cursor: pointer;
 140  font-size: 1rem;
 141  margin: 0 0.5rem 0 0.5rem;
 142  padding: 0.5rem 2rem 0.5rem 2rem;
 143 }
 144
 145 .selector:hover {
 146  background-color: lightgray;
 147 }
 148
 149 .report-block, #report-dates, #filter, #page-selector {
 150  margin: 0 1rem 0 1rem;
 151  background-color: white;
 152 }
 153
 154 .report-block {
 155  min-height: 50%;
 156  padding: 0.2rem 1rem 1rem 1rem;
 157 }
 158
 159 #report-dates {
 160  font-size: 1rem;
 161  padding: 0.5rem 1rem 0.5rem 1rem;
 162  display: none;
 163 }
 164
 165 #report-button {
 166  float: right;
 167 }
 168
 169 #filter {
 170  display: none;
 171  margin: 0;
 172  padding: 0 2rem 0 2rem;
 173 }
 174
 175 .fllter-button {
 176  padding-right: 2rem;
 177 }
 178
 179 #report {
 180  width: 100%;
 181 }
 182
 183 #report th {
 184  font-size: 1.4rem
 185 }
 186
 187 #report tr {
 188  font-size: 1rem
 189 }
 190
 191 #report tr:nth-child(2n+1) {
 192  background-color: lightgray;
 193 }
 194
 195 #report tr:nth-child(2n) {
 196  background-color: white;
 197 }
 198
 199 #report-graph {
 200  display: none;
 201  height: calc(100% - 10rem);
 202 }
 203
 204 .numeric, .clickable-numeric {
 205  text-align: right;
 206 }
 207
 208 .total td {
 209  font-size: 1.2rem;
 210  padding: 0.4rem 0 0.4rem 2rem;
 211 }
 212
 213 .clickable, .clickable-numeric {
 214  cursor: pointer;
 215  text-decoration: underline;
 216 }