fix style problems in bottom sheets and enhance damage and action dialogs (#325)

styles/less/dialog/actions/action-list.less

@@ -0,0 +1,19 @@
+@import '../../utils/fonts.less';
+
+.application.daggerheart.dh-style {
+    .actions-list {
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+
+        .action-item {
+            display: flex;
+            align-items: center;
+            gap: 5px;
+
+            .label {
+                font-family: @font-body;
+            }
+        }
+    }
+}

styles/less/dialog/damage-selection/sheet.less

@@ -0,0 +1,20 @@
+@import '../../utils/colors.less';
+
+.daggerheart.dialog.dh-style.views.damage-selection {
+    .damage-section-container {
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+
+        input[type='text'],
+        input[type='number'] {
+            color: light-dark(@dark, @beige);
+            outline: 2px solid transparent;
+            transition: all 0.3s ease;
+
+            &:hover {
+                outline: 2px solid light-dark(@dark, @beige);
+            }
+        }
+    }
+}

styles/less/dialog/dice-roll/roll-selection.less

@@ -114,15 +114,5 @@
                 }
             }
         }
-
-        .formula-label {
-            font-family: @font-body;
-            font-style: normal;
-            font-weight: 500;
-            font-size: 14px;
-            line-height: 17px;
-
-            color: light-dark(@dark, @beige);
-        }
     }
 }

styles/less/dialog/index.less

@@ -4,6 +4,10 @@
 @import './level-up/summary-container.less';
 @import './level-up/tiers-container.less';
 
+@import './actions/action-list.less';
+
+@import './damage-selection/sheet.less';
+
 @import './downtime/downtime-container.less';
 
 @import './beastform/beastform-container.less';

styles/less/global/dialog.less

@@ -1,5 +1,6 @@
 @import '../utils/colors.less';
 @import '../utils/fonts.less';
+@import '../utils/mixin.less';
 
 .appTheme({
     &.dialog {
@@ -40,4 +41,19 @@
             }
         }
     }
+
+    .submit-btn {
+        width: 100%;
+        height: 38px;
+    }
+
+    .formula-label {
+        font-family: @font-body;
+        font-style: normal;
+        font-weight: 500;
+        font-size: 14px;
+        line-height: 17px;
+
+        color: light-dark(@dark, @beige);
+    }
 }

styles/less/global/elements.less

@@ -35,15 +35,16 @@
         }
     }
 
-    input[type='checkbox'] {
+    input[type='checkbox'],
+    input[type='radio'] {
         &:checked::after {
-            color: light-dark(@dark, @golden);
+            color: light-dark(@dark-40, @golden);
         }
         &:checked::before {
-            color: light-dark(transparent, @dark-blue);
+            color: light-dark(@dark-40, @golden-40);
         }
         &::before {
-            color: light-dark(@dark, @beige);
+            color: light-dark(@dark-40, @golden-40);
         }
     }
 

styles/less/global/sheet.less

@@ -4,8 +4,8 @@
 
 // Theme handling
 .appTheme({
-    background: @semi-transparent-dark-blue;
-    backdrop-filter: blur(9px);
+    background: @dark-blue-60;
+    backdrop-filter: blur(10px);
 }, {
     background: url('../assets/parchments/dh-parchment-light.png') no-repeat center;
 });
@@ -44,6 +44,8 @@
         top: -36px;
         min-height: -webkit-fill-available;
         transition: opacity 0.3s ease;
+        padding-bottom: 20px;
+        margin-bottom: -36px;
 
         .tab {
             padding: 0 10px;

styles/less/sheets-settings/adversary-settings/experiences.less

@@ -5,6 +5,7 @@
     .tab.experiences {
         .add-experience-btn {
             width: 100%;
+            height: 38px;
             margin-bottom: 12px;
         }
 

styles/less/sheets-settings/adversary-settings/features.less

@@ -10,6 +10,7 @@
 
         .add-feature-btn {
             width: 100%;
+            height: 38px;
             margin-bottom: 12px;
         }
 

styles/less/sheets-settings/environment-settings/adversaries.less

@@ -10,6 +10,7 @@
 
         .add-action-btn {
             width: 100%;
+            height: 38px;
             margin-bottom: 12px;
         }
 

styles/less/sheets-settings/environment-settings/features.less

@@ -10,6 +10,7 @@
 
         .add-feature-btn {
             width: 100%;
+            height: 38px;
             margin-bottom: 12px;
         }
 

styles/less/utils/colors.less

@@ -25,10 +25,12 @@
 @dark-blue-10: #18162e10;
 @dark-blue-40: #18162e40;
 @dark-blue-50: #18162e50;
+@dark-blue-60: #18162e60;
 @semi-transparent-dark-blue: rgba(24, 22, 46, 0.33);
 
 @dark: #222;
 @dark-15: #22222215;
+@dark-40: #22222240;
 
 @deep-black: #0e0d15;