res/style.css

   1 @font-face {
   2     font-family: "Cutive Mono";
   3     src: url("./CutiveMono-Regular.woff2");
   4 }
   5
   6 body {
   7     background: url(blackstars.png);
   8     background-color: #111;
   9     color: #fefefe;
  10     font-family: monospace;
  11     padding: 16px;
  12 }
  13
  14 header {
  15     width: 700px;
  16     margin: 0 auto;
  17 }
  18
  19 header h1 {
  20     font-size: 2em;
  21     margin: 0;
  22 }
  23
  24 header > div > a {
  25     color:inherit;
  26     text-decoration:none;
  27 }
  28
  29 header nav {
  30     display:flex;
  31     flex-direction:column;
  32     width: 400px;
  33 }
  34
  35 header nav ul {
  36     display:flex;
  37     flex-direction:row;
  38     padding: 0;
  39     margin: 0;
  40 }
  41
  42 header nav ul li {
  43     display:inline-block;
  44     text-align:center;
  45     height:50px;
  46     margin-right: 24px;
  47     font-size:1.25em;
  48     line-height:50px;
  49     background-color: inherit;
  50 }
  51
  52 a {
  53     color: #f771fc;
  54 }
  55
  56 header nav ul li::before {
  57     font-size: .75em;
  58     line-height: .1em;
  59     content: "#";
  60 }
  61
  62 header nav ul li a:link, header nav ul li a:visited {
  63     text-decoration:none;
  64     color:inherit;
  65 }
  66
  67 header nav ul li a:hover, header nav ul li a.selected {
  68     text-decoration:underline;
  69 }
  70
  71 article {
  72     width: 700px;
  73     margin: 0 auto;
  74     /* padding: 16px 0px 16px 0px; */
  75 }
  76
  77 article h2 {
  78     /* padding: 8px 0px 8px 0px; */
  79     font-size: 1.2em;
  80 }
  81
  82 article h2::before {
  83     font-size: 1em;
  84     content: "\2014"; /* emdash */
  85 }
  86
  87 em {
  88     font-style:italic;
  89 }
  90
  91 em > em {
  92     font-style:normal;
  93     font-weight:bold;
  94 }
  95
  96
  97 article p {
  98     line-height: 1.25em;
  99 }
 100
 101 article div {
 102     margin: 16px 0px 16px 0px;
 103 }
 104
 105 article div ul li {
 106     margin: 8px 0px 8px 0px;
 107 }
 108
 109 a, p, h1, h2, li, summary {
 110     background-color: #111111;
 111 }
 112
 113 article details summary {
 114     margin: 8px 0px 8px 0px;
 115 }