git.r.bdr.sh - rbdr/r.bdr.sh/blob - css/style.css

   1 body {
   2   font-family: "Times New Roman", serif;
   3   text-rendering: optimizeLegibility;
   4   font-variant: historical-ligatures;
   5   font-feature-settings: "hlig" 1, "dlig" 1, "onum" 1, "zero" 1, "swsh" 1, "kern" 1, "medi" 1;
   6   line-height: 1.6;
   7   letter-spacing: 0.02em;
   8 }
   9
  10 @media only screen and (min-width: 500px) {
  11   body {
  12     overflow-x: auto;
  13   }
  14
  15   .columned {
  16     height: calc(100vh - 200px);
  17     width: max-content;
  18   }
  19
  20   .columned .h2:not(:only-child) {
  21     float: left;
  22     margin: 0 40px;
  23     height: calc(100vh - 200px);
  24   }
  25
  26   .columned .h2:not(:only-child) h2 {
  27     width: 14.6em;
  28   }
  29
  30   .columned .h2:not(:only-child) .h3, .columned .h2:not(:only-child) p {
  31     width: 22em;
  32   }
  33
  34   .columned .h2:not(:only-child) pre { width: 25em }
  35 }
  36
  37 .columned .h2:first-of-type pre {
  38   line-height: 1;
  39 }
  40
  41 blockquote, p { max-width: 45em }
  42 pre { max-width: 55em }
  43 blockquote {
  44   border-left: 4px solid #ccc;
  45   padding-left: 10px;
  46 }
  47
  48 h1, h2, h3 { font-weight: normal }
  49 br { display: none }
  50 pre {
  51   font-family: courier, monospace;
  52   font-size: 14px;
  53   background-color: #eee;
  54   overflow-x: auto;
  55 }
  56
  57 canvas {
  58   width: 64px;
  59   height: 64px;
  60   display: inline-block;
  61   background-color: #000;
  62   border: 1px solid #000;
  63 }
  64
  65 @media (prefers-color-scheme: dark) {
  66   body {
  67     color: #fff;
  68     background: #000;
  69   }
  70
  71   canvas {
  72     background-color: #fff;
  73     border: 1px solid #fff;
  74   }
  75
  76   a {
  77     color: #5dc1fd;
  78     display: inline-block;
  79     min-height: 48px;
  80   }
  81
  82   a:visited {
  83     color: #ed6eff;
  84   }
  85
  86   pre {
  87     background-color: #222;
  88   }
  89 }