/settings: improve set-cookie style

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;
 }
 

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;
 }
 

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>