From 77c43b3c56d562f5a55f9b15bb8099bb506865d5 Mon Sep 17 00:00:00 2001
From: Steph Enders <steph@senders.io>
Date: Fri, 14 Jul 2023 17:14:40 -0400
Subject: Add blockquote styling to the CSS

This is also our first instance of needing a mobile specific render
---
 static/index.css | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/static/index.css b/static/index.css
index fdbaa63..79920bb 100644
--- a/static/index.css
+++ b/static/index.css
@@ -1,6 +1,7 @@
 :root {
     --bgcolor: #e4e4ff;
     --page-width: 50em;
+    --quote: #4ac2fe;
 }
 html, body {
     margin: 16px;
@@ -41,8 +42,22 @@ main article {
 main  article:last-child {
     margin-bottom: none;
 }
+
+main article figure blockquote {
+    padding: 8px;
+    border-left: 4px solid var(--quote);
+}
 .transflag {
     width: 90px;
     height: 60px;
     margin: 16px auto;
 }
+/* small screen overrides */
+@media screen and (max-width: 800px) {
+    main article figure {
+	margin: 16px 8px;
+    }
+    main article figure blockquote {
+	margin: 0;
+    }
+}
-- 
cgit v1.2.3-54-g00ecf