From f9f4723bded3d44b83054246d4eadf2bbef69544 Mon Sep 17 00:00:00 2001
From: Steven Vandevelde <steven@tokono.ma>
Date: Mon, 6 Apr 2026 11:30:32 +0200
Subject: [PATCH] chore: stretch out guide

---
 src/guide.vto               | 8 ++++----
 src/styles/diffuse/page.css | 8 +++++---
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/guide.vto b/src/guide.vto
index 3a9bf209..f8eedbad 100644
--- a/src/guide.vto
+++ b/src/guide.vto
@@ -14,7 +14,7 @@ title: Guide | Diffuse
 <h1 hidden>Guide</h1>
 
 <div class="columns">
-  <section>
+  <section class="flex">
     <h2>Concept</h2>
 
     <p>
@@ -34,7 +34,7 @@ title: Guide | Diffuse
     </p>
   </section>
 
-  <section>
+  <section class="flex">
     <h2>Getting started</h2>
 
     <ul style="display: flex; flex-direction: column; gap: var(--space-md); margin-top: var(--space-md); padding-left: 0">
@@ -75,7 +75,7 @@ title: Guide | Diffuse
   <h2>Tutorial</h2>
 
   <div class="columns">
-    <div>
+    <div class="flex">
       <p>
         <strong>Diffuse is not your typical streaming service, you have to add sources of audio so you have stuff to play.</strong> This button below adds some demo content, so you can experiment with the software right away. Wait until processing is completed.
       </p>
@@ -105,7 +105,7 @@ title: Guide | Diffuse
       </p>
     </div>
 
-    <div>
+    <div class="flex">
       <p>
         Interfaces can also be added to your dashboard, but it's not required, you can try them out right away by clicking the link in their title. For interfaces that are more like traditional web applications, delivering more encompassing experiences, look at <a href="themes/">themes</a>.
       </p>
diff --git a/src/styles/diffuse/page.css b/src/styles/diffuse/page.css
index 3edd86a7..80905055 100644
--- a/src/styles/diffuse/page.css
+++ b/src/styles/diffuse/page.css
@@ -161,10 +161,12 @@ ul.columns {
   flex: 1;
   margin-bottom: var(--space-xs);
   min-width: var(--container-3xs);
-}
 
-.flex p {
-  max-width: 100%;
+  p,
+  ul,
+  ol {
+    max-width: 100%;
+  }
 }
 
 /**
-- 
2.51.2