From 5b69b2e4d3dcf9dc4c64e0bb06dc60519d0d40fa Mon Sep 17 00:00:00 2001
From: Kristofers Solo <kristians.cagulis@proton.me>
Date: Fri, 20 Jan 2023 01:08:29 +0200
Subject: [PATCH] Added mobile support for `markdown.css`

---
 static/main/css/layout.css                 |  6 +++++-
 static/main/css/markdown.css               | 23 +++++++++++++++++++++-
 templates/projects/karbs/instructions.html |  8 +++++---
 3 files changed, 32 insertions(+), 5 deletions(-)

diff --git a/static/main/css/layout.css b/static/main/css/layout.css
index 0881af0..0d358b5 100644
--- a/static/main/css/layout.css
+++ b/static/main/css/layout.css
@@ -57,7 +57,7 @@ em {
 
 .primary-navigation a {
     color: var(--color-fg-default);
-    font-size: 2rem;
+    font-size: 1.5rem;
     text-decoration: none;
 }
 .primary-navigation a:hover {
@@ -83,6 +83,10 @@ em {
         transform: translateX(100%);
         transition: transform 350ms ease-out;
     }
+    .primary-navigation a {
+        padding: 1rem;
+        text-align: right;
+    }
 
     .primary-navigation[data-visible="true"] {
         transform: translateX(0%);
diff --git a/static/main/css/markdown.css b/static/main/css/markdown.css
index 52d48f6..cc2ee02 100644
--- a/static/main/css/markdown.css
+++ b/static/main/css/markdown.css
@@ -7,7 +7,7 @@
     max-width: 50rem;
     color: var(--text-color);
     padding: 2rem;
-    margin: 8rem auto 8rem auto;
+    margin: 8em auto 8em auto;
     line-height: 1.5;
     word-wrap: break-word;
 }
@@ -246,6 +246,16 @@
     border: 0;
 }
 
+.markdown-body blockquote:first-child {
+    margin-top: 0;
+}
+
+.markdown-body blockquote {
+    padding: 0 1em;
+    color: var(--color-fg-muted);
+    border-left: 0.25em solid var(--color-border-default);
+}
+
 .markdown-body [data-footnote-ref]::before {
     content: "[";
 }
@@ -273,3 +283,14 @@
 .markdown-body .footnotes li {
     position: relative;
 }
+
+@media (max-width: 35em) {
+    .markdown-body {
+        margin: 2em 0 2em 0;
+        border-left: none;
+        border-right: none;
+        border-radius: 0;
+        background-color: var(--color-scale-gray-8);
+        color: var(--color-scale-gray-0);
+    }
+}
diff --git a/templates/projects/karbs/instructions.html b/templates/projects/karbs/instructions.html
index 950029e..b302756 100644
--- a/templates/projects/karbs/instructions.html
+++ b/templates/projects/karbs/instructions.html
@@ -37,9 +37,11 @@ sh karbs</pre>
     target="_blank">right here</a>!
         </p>
         <p>Here is some idea of the programs installed:</p>
-        <aside>
-            If you don't know any of these programs and this is all Greek to you, don't worry because it's all done automatically for you and you will learn as you use the system.
-        </aside>
+        <blockquote>
+            <p>
+                If you don't know any of these programs and this is all Greek to you, don't worry because it's all done automatically for you and you will learn as you use the system.
+            </p>
+        </blockquote>
         <ul>
             <li>
                 <a href="https://awesomewm.org/" target="_blank">awesome</a> - a highly configurable, next generation framework window manager for X