From 10cf83488561ce9fdca61a40dd098c4a6b3e42e8 Mon Sep 17 00:00:00 2001
From: Kuba Suder <jakub.suder@gmail.com>
Date: Sun, 5 Jul 2026 22:16:29 +0200
Subject: [PATCH] tweaked code/pre styles

---
 src/components/CodeBlock.svelte         | 12 +++++++-----
 src/components/PlainTextWithCode.svelte |  9 ++++++---
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/components/CodeBlock.svelte b/src/components/CodeBlock.svelte
index 4ab3a55..6a383df 100644
--- a/src/components/CodeBlock.svelte
+++ b/src/components/CodeBlock.svelte
@@ -35,21 +35,22 @@
 <style>
   pre {
     overflow-x: auto;
-    max-width: 100%;
-    margin: 10px 0;
+    max-width: 60em;
     padding: 8px 10px;
     border-radius: 6px;
-    background-color: rgba(0, 0, 0, 0.07);
+    background-color: rgba(0, 0, 0, 0.06);
+    border: 1px solid rgba(0, 0, 0, 0.06);
   }
 
   code {
     display: block;
-    font-family: ui-monospace, "SFMono-Regular", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
-    font-size: 0.92em;
+    font-family: ui-monospace, "Consolas", "Liberation Mono", "Menlo", monospace;
+    font-size: 0.88em;
     background-color: transparent;
     border-radius: 0;
     padding: 0;
     white-space: pre;
+    line-height: 150%;
   }
 
   code :global(.hljs-keyword),
@@ -90,6 +91,7 @@
   @media (prefers-color-scheme: dark) {
     pre {
       background-color: rgba(255, 255, 255, 0.1);
+      border-color: rgba(255, 255, 255, 0.1);
     }
 
     code :global(.hljs-keyword),
diff --git a/src/components/PlainTextWithCode.svelte b/src/components/PlainTextWithCode.svelte
index c00139a..d85b880 100644
--- a/src/components/PlainTextWithCode.svelte
+++ b/src/components/PlainTextWithCode.svelte
@@ -24,16 +24,19 @@
 
 <style>
   code {
-    font-family: ui-monospace, "SFMono-Regular", "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
-    font-size: 0.92em;
-    background-color: rgba(0, 0, 0, 0.07);
+    font-family: ui-monospace, "Consolas", "Liberation Mono", "Menlo", monospace;
+    font-size: 0.88em;
+    background-color: rgba(0, 0, 0, 0.06);
+    border: 1px solid rgba(0, 0, 0, 0.06);
     border-radius: 4px;
     padding: 1px 3px;
+    margin-inline: 2px;
   }
 
   @media (prefers-color-scheme: dark) {
     code {
       background-color: rgba(255, 255, 255, 0.12);
+      border-color: rgba(255, 255, 255, 0.1);
     }
   }
 </style>
-- 
2.51.2