From 367904f62cb2b863103f3079c5e200dc4cd332f4 Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Thu, 9 May 2024 20:27:58 +0800
Subject: [PATCH] Style blockquote with attribution

---
 _site/assets/css/main.css | 18 +++++++++++++++---
 src/assets/css/main.css   | 18 +++++++++++++++---
 2 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/_site/assets/css/main.css b/_site/assets/css/main.css
index 27591380..4e04d202 100644
--- a/_site/assets/css/main.css
+++ b/_site/assets/css/main.css
@@ -191,14 +191,17 @@ a:focus img {
     outline: 0.2em solid var(--clr-body-txt);
 }
 
-blockquote {
+:not(.c-blockquote) > blockquote,
+.c-blockquote {
 	padding: 1em 1.4em 1.4em;
 	border-inline-start: 0.1em solid var(--clr-main-heading);
     background-color: var(--clr-quote-bg);
     margin-bottom: 1em;
 }
 
-blockquote > * + :not([class]) {
+blockquote > * + :not([class]),
+.c-blockquote,
+.c-blockquote__attribution {
     margin-top: var(--sz-paragraph-margin);
 }
 
@@ -390,6 +393,16 @@ main {
     margin-top: 1.7em;
 }
 
+/* BLOCKQUOTES With CITATIONS */
+.c-blockquote__attribution {
+    text-align: left;
+}
+
+.c-blockquote__attribution::before {
+    content: "—";
+    margin-right: 0.3em;
+}
+
 /* SPECIAL ELEMENTS */
 .text-box {
     background: var(--clr-quote-bg);
@@ -417,7 +430,6 @@ main {
     gap: 0.5em;
 }
 
-
 /* Tablet screen size */
 @media only screen and (min-width: 37.5rem) {
     .mod-entry__downloads {
diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index 27591380..4e04d202 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -191,14 +191,17 @@ a:focus img {
     outline: 0.2em solid var(--clr-body-txt);
 }
 
-blockquote {
+:not(.c-blockquote) > blockquote,
+.c-blockquote {
 	padding: 1em 1.4em 1.4em;
 	border-inline-start: 0.1em solid var(--clr-main-heading);
     background-color: var(--clr-quote-bg);
     margin-bottom: 1em;
 }
 
-blockquote > * + :not([class]) {
+blockquote > * + :not([class]),
+.c-blockquote,
+.c-blockquote__attribution {
     margin-top: var(--sz-paragraph-margin);
 }
 
@@ -390,6 +393,16 @@ main {
     margin-top: 1.7em;
 }
 
+/* BLOCKQUOTES With CITATIONS */
+.c-blockquote__attribution {
+    text-align: left;
+}
+
+.c-blockquote__attribution::before {
+    content: "—";
+    margin-right: 0.3em;
+}
+
 /* SPECIAL ELEMENTS */
 .text-box {
     background: var(--clr-quote-bg);
@@ -417,7 +430,6 @@ main {
     gap: 0.5em;
 }
 
-
 /* Tablet screen size */
 @media only screen and (min-width: 37.5rem) {
     .mod-entry__downloads {