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: #111111;
   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 }
  22
  23 header > div > a {
  24     color:inherit;
  25     text-decoration:none;
  26 }
  27
  28 header nav {
  29     display:flex;
  30     flex-direction:column;
  31     width: 400px;
  32 }
  33
  34 header nav ul {
  35     display:flex;
  36     flex-direction:row;
  37 }
  38
  39 header nav ul li {
  40     display:inline-block;
  41     text-align:center;
  42     height:50px;
  43     padding-right: 24px;
  44     font-size:1.25em;
  45     line-height:50px;
  46 }
  47
  48 a {
  49     color: #f771fc;
  50 }
  51
  52 header nav ul li::before {
  53     font-size: .75em;
  54     line-height: .1em;
  55     content: "#";
  56 }
  57
  58 header nav ul li a:link, header nav ul li a:visited {
  59     text-decoration:none;
  60     color:inherit;
  61 }
  62
  63 header nav ul li a:hover, header nav ul li a.selected {
  64     text-decoration:underline;
  65 }
  66
  67 article {
  68     width: 700px;
  69     margin: 0 auto;
  70     /* padding: 16px 0px 16px 0px; */
  71 }
  72
  73 article h2 {
  74     /* padding: 8px 0px 8px 0px; */
  75     font-size: 1.2em;
  76 }
  77
  78 article h2::before {
  79     font-size: 1em;
  80     content: "\2014"; /* emdash */
  81 }
  82
  83 em {
  84     font-style:italic;
  85 }
  86
  87 em > em {
  88     font-style:normal;
  89     font-weight:bold;
  90 }
  91
  92
  93 article p {
  94     line-height: 1.25em;
  95 }
  96
  97 article div {
  98     padding: 16px 0px 16px 0px;
  99 }
 100
 101 a, p, h1, h2 {
 102     background-color: #111111;
 103 }