From d07907f27644b18d6d552907d31ae98f8585ef38 Mon Sep 17 00:00:00 2001
From: Nick Bowler <nbowler@draconx.ca>
Date: Fri, 10 Jul 2020 01:16:04 -0400
Subject: [PATCH] Fix media queries that disable justification.

It seems at some point the rules to disable justification on narrow
displays stopped working (or maybe they never worked) due to the main
CSS selectors having higher specificity.

SCSS has a neat trick to expand the media query with matching selectors
which solves this problem nicely.  So let's use that.
---
 content/style.scss | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/content/style.scss b/content/style.scss
index f71a6a3..82b8720 100644
--- a/content/style.scss
+++ b/content/style.scss
@@ -56,6 +56,7 @@ p>img { max-width: 40em; width: 100%; height: auto; }
 
 p, dt, dd, li {
     text-align: justify;
+    @media (max-width: 28em) { text-align: left; }
     padding: 0;
     margin: 0;
 }
@@ -89,9 +90,7 @@ kbd {
     color: $annotationcolour;
 
     a:link, a:visited { color: inherit; }
-}
-@media not screen {
-    .permalink { visibility: hidden; }
+    @media not screen { visibility: hidden; }
 }
 
 // General table styles.
@@ -195,6 +194,3 @@ ul.ordered > {
     #sitetitle * { float: none; }
     #footer { padding: 0 1em; }
 }
-@media (max-width: 28em) {
-    * { text-align: left; }
-}
-- 
2.43.0