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 .code {
 100         font-family: Courier, monospace, serif;
 101         font-size: .75em;
 102         white-space: nowrap;
 103         overflow-x: hidden;
 104 }
 105 .client-identifier {
 106         display: inline-block;
 107         height: max-content;
 108         padding: .5em;
 109         border: 1px dotted #999;
 110         margin-bottom: .5em;
 111 }
 112 .scope {
 113         list-style-type: none;
 114 }
 115 .scope label {
 116         font-variant: small-caps;
 117         font-weight: bold;
 118 }
 119 .scope .description {
 120         font-size: smaller;
 121         font-style: italic;
 122 }
 123 .scope .disabled {
 124         color: grey;
 125         background-color: #eee;
 126 }
 127 .form-consent button {
 128         border-width: thick;
 129         font-size: x-large;
 130         padding: .5em;
 131         margin-left: .75em;
 132         margin-right: .75em;
 133 }
 134 .button-accept {
 135         background-color: lightgreen;
 136         border-color: lightgreen;
 137 }
 138 .button-decline {
 139         background-color: salmon;
 140         border-color: salmon;
 141 }
 142 .vertical {
 143         writing-mode: vertical-lr;
 144         vertical-align: bottom;
 145 }
 146 table {
 147         border: 0;
 148         width: 100%;
 149 }
 150 table thead {
 151         position: sticky;
 152         top: 0;
 153 }
 154 thead tr th {
 155         background-color: #ddd;
 156         vertical-align: bottom;
 157         text-align: start;
 158 }
 159 tbody tr th {
 160         text-align: start;
 161 }
 162 tbody tr:nth-child(even) td, tbody tr:nth-child(even) th {
 163         background-color: #eee;
 164 }
 165 /* tbody tr:nth-child(odd) td, tbody tr:nth-child(odd) th {} */
 166 footer {
 167         text-align: center;
 168         width: 100%;
 169         border-top: .33em dotted #666;
 170         margin-top: 1em;
 171 }
 172 footer ol {
 173         list-style-type: none;
 174         margin: .5em;
 175         padding: 0;
 176 }
 177 .centered {
 178         text-align: center;
 179 }