extra/websites/concatenative/page.css

   1 html {
   2     box-sizing: border-box;
   3 }
   4
   5 *, *:before, *:after {
   6     box-sizing: inherit;
   7 }
   8
   9 html, body {
  10     margin: 0;
  11     padding: 0;
  12 }
  13
  14 body, button {
  15     font-size: 12pt;
  16     font-family: sans-serif;
  17 }
  18
  19 textarea {
  20     font-size: 12pt;
  21 }
  22
  23 table {
  24     border-spacing: 0;
  25     border-collapse: collapse;
  26 }
  27
  28 pre {
  29     overflow: auto;
  30     font-size: smaller;
  31     line-height: 125%;
  32 }
  33
  34 .link-button {
  35     padding: 0;
  36     background: none;
  37     border: none;
  38 }
  39
  40 a, .link { color: #2A5DB0; }
  41 a:link, a:visited, a:active, .link { text-decoration: none; }
  42 a:hover, .link:hover { text-decoration: underline; }
  43
  44 .error { color: #a00; }
  45
  46 .errors li { color: #a00; }
  47
  48 .field-label {
  49     text-align: right;
  50 }
  51
  52 .inline {
  53     display: inline;
  54 }
  55
  56 nav {
  57     border-bottom: 1px solid #d5d5d5;
  58     background-color: #f5f5f5;
  59     padding: 10px;
  60     padding-left: calc(max(50% - 500px, 0px) + 15px);
  61     padding-right: calc(max(50% - 500px, 0px) + 15px);
  62 }
  63
  64 nav a, nav .link {
  65     margin-right: 10px;
  66 }
  67
  68 nav img {
  69     vertical-align: middle;
  70 }
  71
  72 .page {
  73     max-width: 1000px;
  74     position: relative;
  75     left: calc(max(-500px,-50%) + 50%);
  76     padding: 15px;
  77 }
  78
  79 .big-field-label {
  80     vertical-align: top;
  81 }
  82
  83 /* Dark mode */
  84 @media (prefers-color-scheme: dark) {
  85     body {
  86         background-color: #202124;
  87         color: #bdc1c6;
  88     }
  89
  90     title, h1, h2, h3, h4, h5, h6 {
  91         color: white;
  92     }
  93
  94     a, .link {
  95         color: #8ab4f8;
  96     }
  97
  98     nav {
  99         background-color: #373e48;
 100         border-bottom: 1px solid #666;
 101     }
 102 }