From 838a02b92e0b4226a620a82d4f6a461fe5638782 Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Fri, 10 May 2024 00:44:11 +0800
Subject: [PATCH] Adjust code block styles

---
 _site/assets/css/main.css | 24 +++++++++++-------------
 src/assets/css/main.css   | 24 +++++++++++-------------
 2 files changed, 22 insertions(+), 26 deletions(-)

diff --git a/_site/assets/css/main.css b/_site/assets/css/main.css
index 0cccc00f..4a58f812 100644
--- a/_site/assets/css/main.css
+++ b/_site/assets/css/main.css
@@ -228,25 +228,23 @@ figcaption {
     margin-top: 0.2em;
 }
 
-code {
+:not(pre) > code,
+pre {
+    border: 0.07em solid var(--clr-code-border);
+    background: var(--clr-code-bg);
+}
+
+:not(pre) > code {
     font-family: monospace;
-    border: 0.07rem solid var(--clr-code-border);
-    padding: 0.125rem 0.3rem;
-    margin: 0 0.125rem;
+    padding: 0.125em 0.3em;
+    margin: 0 0.125em;
     background: var(--clr-code-bg);
 }
 
 pre {
-    white-space: pre-wrap;
+    max-width: calc(100vw - 2em);
     overflow-x: auto;
-}
-
-pre code {
-    background: var(--clr-code-bg);
-    display: block;
-    padding: 0.5em 0.8rem;
-    overflow-x: auto;
-    word-break: keep-all;
+    padding: 0.8em 1.4em;
 }
 
 summary {
diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index 0cccc00f..4a58f812 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -228,25 +228,23 @@ figcaption {
     margin-top: 0.2em;
 }
 
-code {
+:not(pre) > code,
+pre {
+    border: 0.07em solid var(--clr-code-border);
+    background: var(--clr-code-bg);
+}
+
+:not(pre) > code {
     font-family: monospace;
-    border: 0.07rem solid var(--clr-code-border);
-    padding: 0.125rem 0.3rem;
-    margin: 0 0.125rem;
+    padding: 0.125em 0.3em;
+    margin: 0 0.125em;
     background: var(--clr-code-bg);
 }
 
 pre {
-    white-space: pre-wrap;
+    max-width: calc(100vw - 2em);
     overflow-x: auto;
-}
-
-pre code {
-    background: var(--clr-code-bg);
-    display: block;
-    padding: 0.5em 0.8rem;
-    overflow-x: auto;
-    word-break: keep-all;
+    padding: 0.8em 1.4em;
 }
 
 summary {