git.squeep.com Git - squeep-indie-auther/blob - static/theme.css

   1 html {
   2         height: 100vh;
   3 }
   4 body {
   5         background-color: #fff;
   6         font-family: Helvetica, Verdana, sans-serif;
   7         margin: 0 1em 0 1em;
   8         min-height: 100vh;
   9         display: flex;
  10         flex-direction: column;
  11 }
  12 /* header {} */
  13 header nav {
  14         margin-bottom: 1em;
  15 }
  16 header nav ol {
  17         list-style-type: none;
  18         margin: 0;
  19         padding: 0;
  20 }
  21 header nav ol li {
  22         display: inline;
  23         text-align: center;
  24         border-top: 2px solid #666;
  25         border-bottom: 2px solid #666;
  26         border-left: 1px solid #666;
  27         border-right: 1px solid #666;
  28         padding: .3em .5em .2em .5em;
  29 }
  30 header nav ol li:hover {
  31         background-color: #ddd;
  32 }
  33 header nav ol > li:first-child {
  34         border-left: 2px solid #666;
  35 }
  36 header nav ol > li:last-child {
  37         border-right: 2px solid #666;
  38 }
  39 header nav ol a {
  40         font-variant-caps: small-caps;
  41         text-decoration: none;
  42         font-weight: bold;
  43 }
  44 h1 {
  45         margin-top: 1em;
  46         margin-bottom: 1.25em;
  47         text-align: center;
  48 }
  49 h2 {
  50         background-color: #ddd;
  51         padding: .25em 0 .1em 0.25em;
  52 }
  53 main {
  54         flex-grow: 1;
  55 }
  56 /* section {} */
  57 .logo {
  58         vertical-align: middle;
  59         height: 2em;
  60 }
  61 /* .about {} */
  62 /* .usage {} */
  63 .copyright {
  64         font-size: small;
  65 }
  66 .error ul {
  67         font-weight: bolder;
  68         border: 2px solid red;
  69         padding: 1em;
  70         background-color: lightsalmon;
  71 }
  72 .notification ul {
  73         background-color: aliceblue;
  74         border: 1px solid slateblue;
  75         padding: 1em;
  76 }
  77 .legacy-warning {
  78         background-color: coral;
  79 }
  80 .external {
  81         background-image: url("external-link.svg");
  82         background-position: right center;
  83         background-repeat: no-repeat;
  84         padding-right: 13px;
  85 }
  86 .information img {
  87         max-width: 4em;
  88         max-height: 4em;
  89         width: 100%;
  90         height: auto;
  91         vertical-align: middle;
  92 }
  93 .uri {
  94         font-family: Courier, monospace, serif;
  95         font-size: 1em;
  96         background-color: lavender;
  97         padding: .16em;
  98 }
  99 .otp-key-qr svg {
 100         height: 30vh;
 101 }
 102 .code {
 103         font-family: Courier, monospace, serif;
 104         font-size: .75em;
 105         white-space: nowrap;
 106         overflow-x: hidden;
 107 }
 108 .client-identifier {
 109         display: inline-block;
 110         height: max-content;
 111         padding: .5em;
 112         border: 1px dotted #999;
 113         margin-bottom: .5em;
 114 }
 115 .scope {
 116         list-style-type: none;
 117 }
 118 .scope label {
 119         font-variant: small-caps;
 120         font-weight: bold;
 121 }
 122 .scope .description {
 123         font-size: smaller;
 124         font-style: italic;
 125 }
 126 .scope .disabled {
 127         color: grey;
 128         background-color: #eee;
 129 }
 130 .form-consent button {
 131         border-width: thick;
 132         font-size: x-large;
 133         padding: .5em;
 134         margin-left: .75em;
 135         margin-right: .75em;
 136 }
 137 .button-accept {
 138         background-color: lightgreen;
 139         border-color: lightgreen;
 140 }
 141 .button-decline {
 142         background-color: salmon;
 143         border-color: salmon;
 144 }
 145 .vertical {
 146         writing-mode: vertical-lr;
 147         vertical-align: bottom;
 148 }
 149 table {
 150         border: 0;
 151         width: 100%;
 152 }
 153 table thead {
 154         position: sticky;
 155         top: 0;
 156 }
 157 thead tr th {
 158         background-color: #ddd;
 159         vertical-align: bottom;
 160         text-align: start;
 161 }
 162 tbody tr th {
 163         text-align: start;
 164 }
 165 tbody tr:nth-child(even) td, tbody tr:nth-child(even) th {
 166         background-color: #eee;
 167 }
 168 /* tbody tr:nth-child(odd) td, tbody tr:nth-child(odd) th {} */
 169 footer {
 170         text-align: center;
 171         width: 100%;
 172         border-top: .33em dotted #666;
 173         margin-top: 1em;
 174 }
 175 footer ol {
 176         list-style-type: none;
 177         margin: .5em;
 178         padding: 0;
 179 }
 180 .centered {
 181         text-align: center;
 182 }