From 1ef03b7a77e3a502e3bfb1336a17f6aa9144e301 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Thu, 30 Oct 2025 00:23:41 +0200
Subject: [PATCH] client: rework max content width handling

---
 apps/client/src/stylesheets/style.css            | 5 ++++-
 apps/client/src/widgets/collections/NoteList.css | 1 +
 apps/client/src/widgets/note_detail.ts           | 1 +
 apps/server/src/assets/views/desktop.ejs         | 4 ++--
 4 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/apps/client/src/stylesheets/style.css b/apps/client/src/stylesheets/style.css
index 1f4152792..b74da80d2 100644
--- a/apps/client/src/stylesheets/style.css
+++ b/apps/client/src/stylesheets/style.css
@@ -1809,12 +1809,15 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
 }
 
 .note-split {
+    /* Limits the maximum width of the note */
+    --max-content-width: var(--preferred-max-content-width);
+
     margin-inline-start: auto;
     margin-inline-end: auto;
 }
 
 .note-split.full-content-width {
-    max-width: 999999px;
+    --max-content-width: unset;
 }
 
 button.close:hover {
diff --git a/apps/client/src/widgets/collections/NoteList.css b/apps/client/src/widgets/collections/NoteList.css
index 08fab236c..2257e7f59 100644
--- a/apps/client/src/widgets/collections/NoteList.css
+++ b/apps/client/src/widgets/collections/NoteList.css
@@ -1,5 +1,6 @@
 .note-list-widget {
     min-height: 0;
+    max-width: var(--max-content-width); /* Inherited from .note-split */
     overflow: auto;
     contain: none !important;
 }
diff --git a/apps/client/src/widgets/note_detail.ts b/apps/client/src/widgets/note_detail.ts
index a976b97ce..6ab265c46 100644
--- a/apps/client/src/widgets/note_detail.ts
+++ b/apps/client/src/widgets/note_detail.ts
@@ -39,6 +39,7 @@ const TPL = /*html*/`
 <div class="note-detail">
     <style>
     .note-detail {
+        max-width: var(--max-content-width); /* Inherited from .note-split */
         font-family: var(--detail-font-family);
         font-size: var(--detail-font-size);
     }
diff --git a/apps/server/src/assets/views/desktop.ejs b/apps/server/src/assets/views/desktop.ejs
index a86b7e7a0..f210f8b27 100644
--- a/apps/server/src/assets/views/desktop.ejs
+++ b/apps/server/src/assets/views/desktop.ejs
@@ -29,8 +29,8 @@
 <%- include("./partials/windowGlobal.ejs", locals) %>
 
 <style>
-    .note-split {
-        max-width: <%= maxContentWidth %>px;
+    :root {
+        --preferred-max-content-width: <%= maxContentWidth %>px;
     }
 </style>