Minor visual tweaks to daggerheart setting dialogs (#1905)

styles/less/global/elements.less

@@ -7,12 +7,12 @@
     input[type='text'],
     input[type='number'],
     textarea,
+    file-picker,
     .input[contenteditable] {
         background: light-dark(transparent, transparent);
         border-radius: 6px;
         box-shadow: 0 4px 30px @soft-shadow;
         backdrop-filter: blur(9.5px);
-        -webkit-backdrop-filter: blur(9.5px);
         outline: 2px solid transparent;
         color: light-dark(@dark-blue, @golden);
         border: 1px solid light-dark(@dark, @beige);
@@ -98,7 +98,7 @@
         color: light-dark(@dark, @beige);
     }
 
-    button:where(:not(.plain)) {
+    button:where(:not(.plain, color-picker *, file-picker *)) {
         background: light-dark(transparent, @golden);
         border: 1px solid light-dark(@dark-blue, @dark-blue);
         color: light-dark(@dark-blue, @dark-blue);
@@ -252,6 +252,15 @@
         text-shadow: 0 0 1px currentColor, 0 0 1px currentColor, 0 0 8px light-dark(@dark-blue, @golden);
     }
 
+    file-picker, color-picker {
+        > input[type=text] {
+            background: transparent;
+            border: none;
+            outline: none;        
+            backdrop-filter: unset;
+        }
+    }
+
     fieldset {
         align-items: center;
         margin-top: 5px;
@@ -597,59 +606,6 @@
     }
 }
 
-.application.setting.dh-style {
-    h2,
-    h3,
-    h4 {
-        margin: 8px 0 4px;
-        text-align: center;
-    }
-
-    footer {
-        margin-top: 8px;
-        display: flex;
-        gap: 8px;
-
-        button {
-            flex: 1;
-        }
-    }
-
-    .form-group {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        gap: 0.25rem 0.5rem;
-        flex-wrap: wrap;
-
-        label {
-            font-size: var(--font-size-14);
-            font-weight: normal;
-        }
-
-        .form-fields {
-            display: flex;
-            gap: 4px;
-            align-items: center;
-        }
-
-        &.setting-two-values {
-            display: grid;
-            grid-template-columns: repeat(3, 1fr);
-            gap: 0.25rem 0.5rem;
-
-            .form-group {
-                justify-content: end;
-                flex-wrap: nowrap;
-            }
-
-            .hint {
-                grid-column: 1 / -1;
-            }
-        }
-    }
-}
-
 .system-daggerheart {
     .tagify {
         background: light-dark(transparent, transparent);

styles/less/ui/settings/homebrew-settings/resources.less

@@ -24,7 +24,7 @@
                     .resource-icons-container {
                         display: flex;
                         justify-content: space-between;
-                        gap: 8px;
+                        gap: 10px;
                         width: 100%;
 
                         .resource-icon-container {

styles/less/ui/settings/settings.less

@@ -1,6 +1,67 @@
 @import '../../utils/colors.less';
 
 .daggerheart.dh-style.setting {
+    --color-form-label: var(--color-text-primary);
+
+    h2,
+    h3,
+    h4 {
+        margin: 8px 0 4px;
+        text-align: center;
+    }
+
+    footer {
+        margin-top: 8px;
+        display: flex;
+        gap: 8px;
+
+        button {
+            flex: 1;
+        }
+    }
+
+    .standard-form {
+        gap: var(--spacer-8);
+        .form-group .form-fields {
+            width: unset;
+        }
+    }
+
+    .form-group {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        gap: 0.25rem 0.5rem;
+        flex-wrap: wrap;
+
+        label {
+            font-size: var(--font-size-14);
+            font-weight: normal;
+            line-height: var(--input-height);
+        }
+
+        .form-fields {
+            display: flex;
+            gap: 4px;
+            align-items: center;
+        }
+
+        &.setting-two-values {
+            display: grid;
+            grid-template-columns: repeat(3, 1fr);
+            gap: 0.25rem 0.5rem;
+
+            .form-group {
+                justify-content: end;
+                flex-wrap: nowrap;
+            }
+
+            .hint {
+                grid-column: 1 / -1;
+            }
+        }
+    }
+
     fieldset {
         display: flex;
         flex-direction: column;
@@ -19,7 +80,10 @@
         &.three-columns {
             display: grid;
             grid-template-columns: 1fr 1fr 1fr;
-            gap: 2px;
+            gap: 4px;
+            .form-group label {
+                line-height: unset;
+            }
         }
 
         &.six-columns {

templates/settings/metagaming-settings/general.hbs

@@ -1,4 +1,4 @@
-<div>
+<div class="standard-form">
     {{formGroup settingFields.schema.fields.hideObserverPermissionInChat value=settingFields._source.hideObserverPermissionInChat localize=true}}
-     {{formGroup settingFields.schema.fields.hidePartyStats value=settingFields._source.hidePartyStats localize=true}}
+    {{formGroup settingFields.schema.fields.hidePartyStats value=settingFields._source.hidePartyStats localize=true}}
-</div>
+</div>