From 622dab44cd86f672ca3bb2a0abf3f2f2bf2c5e30 Mon Sep 17 00:00:00 2001
From: JasterV <49537445+JasterV@users.noreply.github.com>
Date: Thu, 5 Jun 2025 22:00:23 +0200
Subject: [PATCH] Fix responsiveness issues

---
 src/content/blog/DecouplingElixirGenServers.md | 2 +-
 src/styles/global.scss                         | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/content/blog/DecouplingElixirGenServers.md b/src/content/blog/DecouplingElixirGenServers.md
index 6eea963..f54957d 100644
--- a/src/content/blog/DecouplingElixirGenServers.md
+++ b/src/content/blog/DecouplingElixirGenServers.md
@@ -32,7 +32,7 @@ The application consists of:
 
 Let's look at a diagram of the whole system first:
 
-<div align="center">
+<div class="diagram" align="center">
 
 ```d2 width="500" theme=303 title="Lock door flow"
 direction: down
diff --git a/src/styles/global.scss b/src/styles/global.scss
index cd20643..c35e7a7 100644
--- a/src/styles/global.scss
+++ b/src/styles/global.scss
@@ -177,9 +177,15 @@ a:hover {
   color: var(--link-hover-color);
 }
 
-/* Fix responsiveness issues */
+/* Fix responsiveness issues with code blocks */
 .astro-code code {
   display: block;
   width: 0;
   font-size: 16px;
 }
+
+/* Fix responsiveness issues with generated diagrams */
+.diagram img {
+  max-width: 100% !important;
+  height: auto !important;
+}