paritybit.ca

commit a9cdbb9acd015ea5f11e85382a5bfe7b90764ec4
parent 923801c2ca1c4b9d3bea0b05c0dc631641a49bb0
Author: Jake Bauer <jbauer@paritybit.ca>
Date:   Mon, 13 Apr 2020 21:05:18 -0400

Merge branch 'master' of git.sr.ht:~jbauer/paritybit.ca

Diffstat:
M
style/main.css
 | 
108
++++++++++++++++++++++++++-----------------------------------------------------

1 file changed, 35 insertions(+), 73 deletions(-)
diff --git a/style/main.css b/style/main.css
@@ -15,66 +15,55 @@
     --info-fg:              #ffffff;
     --border-dark:          #585858;
     --shadow:               #000000;
+    --font-size:               20px;
+    --small-font:             0.9em;
+    --large-font:             1.1em;
+    --line-height:            1.3em;
 }
 
 body {
     background-color: var(--bg);
     color: var(--fg);
     font-family: "DejaVu Sans", "Open Sans", "Noto Sans", "Roboto", "Droid Sans", sans-serif;
-    font-size: 18px;
-    line-height: 1.3em;
-    width: 50rem;
-    max-width: 60rem;
+    font-size: var(--font-size);
+    line-height: var(--line-height);
+    max-width: 50rem;
     margin: auto;
-}
-
-h2 {
-    line-height: 1.3em;
+    padding: 0rem 0.7rem;
 }
 
 nav {
     text-align: center;
 }
 
-nav > a {
-    padding: 0 0.5em;
-    font-size: 1.1em;
+nav a {
+    padding: 0em 0.5em;
+    font-size: var(--large-font);
     font-weight: bold;
     text-decoration: none;
 }
 
-nav > a:visited {
+a, nav a:visited {
     color: var(--unvis-link);
 }
 
-nav > a:hover {
-    text-decoration: underline;
+a:hover, li a:hover, .feed-item:hover, nav a:hover {
     color: var(--hov-link);
-}
-
-a {
-    background-color: transparent;
-    color: var(--unvis-link);
+    text-decoration: underline;
 }
 
 a:visited {
     color: var(--vis-link);
 }
 
-a:hover {
+li a, .feed-item, a:hover {
     text-decoration: none;
-    color: var(--hov-link);
 }
 
 li a, .feed-item {
-    text-decoration: none;
     font-weight: bold;
 }
 
-li a:hover, .feed-item:hover {
-    text-decoration: underline;
-}
-
 pre {
     background-color: var(--bg-alt);
     font-family: "DejaVu Sans Mono", monospace;
@@ -87,7 +76,7 @@ pre {
 code {
     background-color: var(--bg-alt);
     color: var(--fg-alt);
-    font-size: 0.9em;
+    font-size: var(--small-font);
     padding: 1px 4px;
 }
 
@@ -96,9 +85,9 @@ kbd {
     color: var(--kbd-fg);
     border-radius: 3px;
     display: inline-block;
-    font-size: 0.9em;
+    font-size: var(--small-font);
     font-weight: 700;
-    padding: 0 4px;
+    padding: 0px 4px;
 }
 
 img, video {
@@ -114,8 +103,7 @@ input {
     background-color: var(--input-bg);
     border: 2px inset var(--shadow);
     border-radius: 5px;
-    padding: 0.1em;
-    height: 1.5em;
+    padding: 0.5em;
 }
 
 button {
@@ -139,16 +127,7 @@ select {
 }
 
 .byline {
-    font-size: 0.8em;
-}
-
-.spoiler {
-  background-color: #000;
-  color: #000;
-}
-
-.spoiler:hover{
-  color: #fff;
+    font-size: var(--small-font);
 }
 
 .eff-banner {
@@ -168,9 +147,9 @@ select {
     margin-left: 0.5em;
 }
 
-.rss-icon > img {
-    width: 15px;
-    height: 15px;
+.rss-icon img {
+    width: 1rem;
+    height: 1rem;
 }
 
 .feed-wrapper {
@@ -183,15 +162,15 @@ select {
 
 .inline-notice, .inline-warning, .inline-danger {
     color: var(--info-fg);
-    font-size: 0.9em;
+    font-size: var(--small-font);
     padding: 0.5em;
     margin: auto;
-    width: 50%;
+    max-width: 80%;
     border-radius: 10px;
     box-shadow: 4px 4px 4px var(--shadow);
 }
 
-.inline-notice > p, .inline-warning > p, .inline-danger > p {
+.inline-notice p, .inline-warning p, .inline-danger p {
     margin: 0;
 }
 
@@ -211,7 +190,7 @@ select {
     background-color: var(--notice-bg);
     color: var(--info-fg);
     font-weight: bold;
-    font-size: 0.9em;
+    font-size: var(--small-font);
     text-align: center;
     padding: 1em;
     margin: auto;
@@ -221,19 +200,19 @@ select {
     text-align: center;
     clear: both;
     margin: 1em auto;
-    font-size: 1.1em;
+    font-size: var(--large-font);
 }
 
 #table-of-contents {
     float: right;
-    margin: 0 0 1em 1em;
+    margin: 0em 0em 1em 1em;
     width: 40%;
     border: 2px var(--border-dark) solid;
     background-color: var(--kbd-fg);
 }
 
 #toc-title {
-    font-size: 1.1em;
+    font-size: var(--large-font);
     font-weight: bold;
     padding-left: 1em;
 }
@@ -244,35 +223,18 @@ select {
 
 #footer > p {
     text-align: center;
-    font-size: .8em;
-    padding: 0 6em;
+    font-size: var(--small-font);
+    padding: 0em 6em;
 }
 
 @media print {
     body {
-        font-size: 14px;
+        font-size: 100%;
     }
 }
-
-@media only screen and (max-width: 820px) {
-    body {
-        width: 90%;
-    }
-
-    nav > a {
-        line-height: 1.5em;
-        font-size: 1.2em;
-    }
-
-    .inline-notice, .inline-warning, .inline-danger {
-        width: 80%;
-    }
-}
-
-@media only screen and (max-width: 480px) {
+@media only screen and (max-width: 600px) {
     body {
-        font-size: 16px;
-        width: 95%;
+        font-size: 100%;
     }
     #table-of-contents {
         width: 70%;