From 30c14ac3e3f58572b0e986fce4a765367cf5269a Mon Sep 17 00:00:00 2001
From: MrMelon54 <github@mrmelon54.com>
Date: Wed, 2 Aug 2023 23:28:40 +0100
Subject: [PATCH] Add code block styles

---
 index.page       |  8 +++++---
 public/style.css | 11 ++++++++---
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/index.page b/index.page
index 3bfc6f3..a2acc5a 100644
--- a/index.page
+++ b/index.page
@@ -8,8 +8,10 @@ meta:
   og-site_name: "1f349.net"
 content: |
   <main>
-    <code><pre class="pre-line">U+1F349: WATERMELON</pre></code>
-    <code><pre class="pre-line">Miscellaneous Symbols and Pictographs, U+1F300 - U+1F5FF</pre></code>
-    <code><pre class="pre-line">Supplementary Multilingual Plane, U+10000 - U+1FFFF</pre></code>
+    <code class="utf-desc">
+      <pre>U+1F349: WATERMELON</pre>
+      <pre>Miscellaneous Symbols and Pictographs, U+1F300 - U+1F5FF</pre>
+      <pre>Supplementary Multilingual Plane, U+10000 - U+1FFFF</pre>
+    </code>
     <p>The internal domain for all Melon-hosted services.</p>
   </main>
diff --git a/public/style.css b/public/style.css
index 5448302..8486da6 100644
--- a/public/style.css
+++ b/public/style.css
@@ -40,13 +40,18 @@ main {
   }
 }
 
-code pre {
+code.utf-desc {
   font-family: 'Fira Code', monospace;
-  font-size: 90%;
+  font-size: 14.4px;
+  background-color: #121212;
+  padding: 1em;
+  display: block;
+  border-radius: 8px;
 }
 
-code pre.pre-line {
+code.utf-desc pre {
   white-space: pre-line;
+  margin-block: 5px;
 }
 
 a {