From 0ee3de4f5b08de5f95003928b8dc27e04cc93a2b Mon Sep 17 00:00:00 2001
From: iacore <iacore@noreply.codeberg.org>
Date: Sat, 11 May 2024 14:42:49 +0000
Subject: [PATCH] /settings: improve set-cookie style

---
 views/css/style.css           | 22 +++++++++++++++++-----
 views/css/style.scss          | 19 ++++++++++++++-----
 views/pages/settings.jet.html | 30 +++++++++++++++++-------------
 3 files changed, 48 insertions(+), 23 deletions(-)

diff --git a/views/css/style.css b/views/css/style.css
index e116a20..9336b7a 100644
--- a/views/css/style.css
+++ b/views/css/style.css
@@ -1157,13 +1157,25 @@ nav .sidebar-item img {
   font-weight: normal;
 }
 
-.settings-set-cookie,
-.settings-set-cookie > * {
-  margin: unset;
-  display: inline;
+summary > :is(h1, h2, h3, h4, h5, h6) {
+  display: inline-block;
 }
 
-.settings-set-cookie > input[type=text] {
+.settings-set-cookie h3 {
+  font-size: smaller;
+  margin-block: 4px 0;
+}
+
+.settings-set-cookie form {
+  display: flex;
+  gap: 4px;
+}
+
+.settings-set-cookie form > * {
+  margin: unset !important;
+}
+
+.settings-set-cookie form > input[type=text] {
   width: 20em;
 }
 
diff --git a/views/css/style.scss b/views/css/style.scss
index 9f354d5..74870c2 100644
--- a/views/css/style.scss
+++ b/views/css/style.scss
@@ -1411,12 +1411,21 @@ $font-fallback-sans: YuGothic,
   }
 }
 
-.settings-set-cookie,
-.settings-set-cookie>* {
-  margin: unset;
-  display: inline;
+summary > :is(h1,h2,h3,h4,h5,h6) {
+  display: inline-block;
 }
-.settings-set-cookie>input[type="text"] {
+.settings-set-cookie h3 {
+  font-size: smaller;
+  margin-block: 4px 0;
+}
+.settings-set-cookie form {
+  display: flex;
+  gap: 4px;
+}
+.settings-set-cookie form>* {
+  margin:unset !important;
+}
+.settings-set-cookie form>input[type="text"] {
   width: 20em;
 }
 
diff --git a/views/pages/settings.jet.html b/views/pages/settings.jet.html
index f70b04f..1867d54 100644
--- a/views/pages/settings.jet.html
+++ b/views/pages/settings.jet.html
@@ -7,19 +7,23 @@
     Please note that some cookies here such as NovelFontType, ShowArtR18,
     ShowArtR18G, and ShowArtAI are for features still under development.
   </p>
-  <h2>Current Cookie Values</h2>
-  <p>
-    {{ range CookieList }}
-    <div>
-      <h3 class="settings-set-cookie">{{.Key}}</h3>
-      <form action="/settings/set-cookie" method="post" class="settings-set-cookie">
-        <input type="hidden" name="key" value="{{.Key}}" />
-        <input type="text" name="value" value="{{.Value}}" />
-        <input type="submit" value="Set" />
-      </form>
-    </div>
-    {{ end }}
-  </p>
+  <details>
+    <summary>
+      <h2>Current Cookie Values</h2>
+    </summary>
+    <p>
+      {{ range CookieList }}
+      <div class="settings-set-cookie">
+        <h3>{{.Key}}</h3>
+        <form action="/settings/set-cookie" method="post" >
+          <input type="hidden" name="key" value="{{.Key}}" />
+          <input type="text" name="value" value="{{.Value}}" />
+          <input type="submit" value="Set" />
+        </form>
+      </div>
+      {{ end }}
+    </p>
+  </details>
   <form action="/settings/reset-all" method="post">
     <input class="critical" type="submit" value="Reset All Cookies | Reset All Preferences" />
   </form>