From 78c704beba8fde78c8f26b0d3f17f00516368f0b Mon Sep 17 00:00:00 2001
From: bergware <bergware@users.noreply.github.com>
Date: Sun, 5 Nov 2023 11:02:32 +0100
Subject: [PATCH] Display settings: new setting "width"

width = boxed (default, content width is constrained)
width = unlimited (content width is unlimited for higher resolutions)

This should stop the complaints about dashboard not displaying three columns on wide screens.
---
 emhttp/plugins/dynamix/DisplaySettings.page          | 9 +++++++++
 emhttp/plugins/dynamix/default.cfg                   | 1 +
 emhttp/plugins/dynamix/include/DefaultPageLayout.php | 9 +++++++++
 emhttp/plugins/dynamix/styles/default-azure.css      | 3 ---
 emhttp/plugins/dynamix/styles/default-black.css      | 3 ---
 emhttp/plugins/dynamix/styles/default-gray.css       | 3 ---
 emhttp/plugins/dynamix/styles/default-white.css      | 3 ---
 7 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/emhttp/plugins/dynamix/DisplaySettings.page b/emhttp/plugins/dynamix/DisplaySettings.page
index 84391e17f..75059aeb1 100644
--- a/emhttp/plugins/dynamix/DisplaySettings.page
+++ b/emhttp/plugins/dynamix/DisplaySettings.page
@@ -126,6 +126,15 @@ $(function() {
 <input type="hidden" name="#file" value="dynamix/dynamix.cfg">
 <input type="hidden" name="#section" value="display">
 <input type="hidden" name="rtl" value="<?=$display['rtl']?>">
+
+_(Display width)_:
+: <select name="width">
+  <?=mk_option($display['width'], "",_('Boxed'))?>
+  <?=mk_option($display['width'], "1",_('Unlimited'))?>
+  </select>
+
+:display_width_help:
+
 _(Language)_:
 : <select name="locale" class="fixed" onchange="updateDirection(this.value)">
 <?echo mk_option($display['locale'], "","English");
diff --git a/emhttp/plugins/dynamix/default.cfg b/emhttp/plugins/dynamix/default.cfg
index 3f377d32c..1b0834ae8 100644
--- a/emhttp/plugins/dynamix/default.cfg
+++ b/emhttp/plugins/dynamix/default.cfg
@@ -2,6 +2,7 @@
 down="1"
 stop="1"
 [display]
+width=""
 font=""
 tty="15"
 date="%c"
diff --git a/emhttp/plugins/dynamix/include/DefaultPageLayout.php b/emhttp/plugins/dynamix/include/DefaultPageLayout.php
index e85eeabf3..4d9fbd4f0 100644
--- a/emhttp/plugins/dynamix/include/DefaultPageLayout.php
+++ b/emhttp/plugins/dynamix/include/DefaultPageLayout.php
@@ -49,6 +49,15 @@ function annotate($text) {echo "\n<!--\n",str_repeat("#",strlen($text)),"\n$text
 <link type="text/css" rel="stylesheet" href="<?autov("/webGui/styles/defaultpagelayout.css")?>">
 
 <style>
+<?if (empty($display['width'])):?>
+@media (max-width:1280px){#template{min-width:1260px;max-width:1260px;margin:0}}
+@media (min-width:1281px){#template{min-width:1260px;margin:0 10px}}
+@media (min-width:1921px){#template{min-width:1260px;max-width:1920px;margin:0 auto}}
+<?else:?>
+@media (max-width:1280px){#template{margin:0}}
+@media (min-width:1281px){#template{margin:0 10px}}
+@media (min-width:1921px){#template{margin:0 <?=$themes1?'20px':'auto'?>}
+<?endif;?>
 <?if ($display['font']):?>
 html{font-size:<?=$display['font']?>%}
 <?endif;?>
diff --git a/emhttp/plugins/dynamix/styles/default-azure.css b/emhttp/plugins/dynamix/styles/default-azure.css
index af30d0b41..ef617eec0 100644
--- a/emhttp/plugins/dynamix/styles/default-azure.css
+++ b/emhttp/plugins/dynamix/styles/default-azure.css
@@ -1,8 +1,5 @@
 html{font-family:clear-sans;font-size:62.5%;height:100%}
 body{font-size:1.3rem;color:#606e7f;background-color:#e4e2e4;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
-@media (max-width:1280px){#template{min-width:1260px;max-width:1260px;margin:0}}
-@media (min-width:1281px){#template{min-width:1260px;margin:0}}
-@media (min-width:1920px){#template{min-width:1260px;max-width:1920px;margin:0 auto}}
 img{border:none;text-decoration:none;vertical-align:middle}
 p{text-align:left}
 p.centered{text-align:left}
diff --git a/emhttp/plugins/dynamix/styles/default-black.css b/emhttp/plugins/dynamix/styles/default-black.css
index 8e84de9d7..34fa87119 100644
--- a/emhttp/plugins/dynamix/styles/default-black.css
+++ b/emhttp/plugins/dynamix/styles/default-black.css
@@ -1,8 +1,5 @@
 html{font-family:clear-sans;font-size:62.5%;height:100%}
 body{font-size:1.3rem;color:#f2f2f2;background-color:#1c1b1b;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
-@media (max-width:1280px){#template{min-width:1260px;max-width:1260px;margin:0}}
-@media (min-width:1281px){#template{min-width:1260px;margin:0 10px}}
-@media (min-width:1920px){#template{min-width:1260px;max-width:1920px;margin:0 auto}}
 img{border:none;text-decoration:none;vertical-align:middle}
 p{text-align:justify}
 p.centered{text-align:left}
diff --git a/emhttp/plugins/dynamix/styles/default-gray.css b/emhttp/plugins/dynamix/styles/default-gray.css
index b73835521..fbb81d713 100644
--- a/emhttp/plugins/dynamix/styles/default-gray.css
+++ b/emhttp/plugins/dynamix/styles/default-gray.css
@@ -1,8 +1,5 @@
 html{font-family:clear-sans;font-size:62.5%;height:100%}
 body{font-size:1.3rem;color:#606e7f;background-color:#1b1d1b;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
-@media (max-width:1280px){#template{min-width:1260px;max-width:1260px;margin:0}}
-@media (min-width:1281px){#template{min-width:1260px;margin:0}}
-@media (min-width:1920px){#template{min-width:1260px;max-width:1920px;margin:0 auto}}
 img{border:none;text-decoration:none;vertical-align:middle}
 p{text-align:left}
 p.centered{text-align:left}
diff --git a/emhttp/plugins/dynamix/styles/default-white.css b/emhttp/plugins/dynamix/styles/default-white.css
index 42f1536db..e71b6b4e6 100644
--- a/emhttp/plugins/dynamix/styles/default-white.css
+++ b/emhttp/plugins/dynamix/styles/default-white.css
@@ -1,8 +1,5 @@
 html{font-family:clear-sans;font-size:62.5%;height:100%}
 body{font-size:1.3rem;color:#1c1b1b;background-color:#f2f2f2;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
-@media (max-width:1280px){#template{min-width:1260px;max-width:1260px;margin:0}}
-@media (min-width:1281px){#template{min-width:1260px;margin:0 10px}}
-@media (min-width:1920px){#template{min-width:1260px;max-width:1920px;margin:0 auto}}
 img{border:none;text-decoration:none;vertical-align:middle}
 p{text-align:justify}
 p.centered{text-align:left}