Fix toolbar ordering on narrow screen

xiv-gear-planner · Oct 21, 2024 · 2ab68d7 · 2ab68d7
1 parent 6111266
commit 2ab68d7
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 28 deletions.
diff --git a/.idea/watcherTasks.xml b/.idea/watcherTasks.xml
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/common-ui/styles/common.less b/packages/common-ui/styles/common.less
@@ -1696,6 +1696,7 @@ div.gear-sheet-toolbar-holder {
   border-color: var(--border-color-highlight);
   border-radius: 4px;
 }
+
 .load-bar-inner {
   background-color: var(--border-color-highlight);
   border-radius: 3px;
@@ -1706,41 +1707,46 @@ div.gear-sheet-toolbar-holder {
   font-weight: bold;
   text-decoration: underline;
 }
+
 .meld-solver-area {
   white-space: pre-wrap;
 }
+
 .meld-solver-settings {
 
+  float: left;
+  display: flex;
+  flex-direction: column;
+  border-width: 1px;
+  border-color: #00ff00;
+
+  li {
+    margin: 5px;
+    list-style-type: none;
     float: left;
-    display: flex;
-    flex-direction: column;
-    border-width: 1px;
-    border-color: #00ff00;
 
-    li {
-      margin: 5px;
-      list-style-type: none;
+    .meld-solver-target-gcd-input {
+      max-width: 30px;
+      border: var(--faint-border);
       float: left;
+    }
 
-      .meld-solver-target-gcd-input {
-        max-width: 30px;
-        border: var(--faint-border);
-        float: left;
-      }
-      .meld-solver-target-gcd-input:disabled {
-        border: var(--faint-border);
-        background-color: #333339;
-        color: #909090;
-      }
-      select.meld-solver-sim-dropdown {
-        float: left;
-        max-width: fit-content;
-        width: 100%;
-        option {
-          padding: 5px;
-        }
+    .meld-solver-target-gcd-input:disabled {
+      border: var(--faint-border);
+      background-color: #333339;
+      color: #909090;
+    }
+
+    select.meld-solver-sim-dropdown {
+      float: left;
+      max-width: fit-content;
+      width: 100%;
+
+      option {
+        padding: 5px;
       }
     }
+  }
 
   button {
     margin: 5px;
@@ -1750,6 +1756,7 @@ div.gear-sheet-toolbar-holder {
     height: 100%;
   }
 }
+
 .gear-set-editor-toolbar {
   > * {
     .shadow;
@@ -1795,9 +1802,12 @@ div.gear-sheet-toolbar-holder {
   }
 }
 
+set-view-toolbar {
+  display: contents;
+}
+
 div.gear-set-editor-toolbar, set-view-toolbar {
 
-  display: contents;
   width: fit-content;
   margin: auto;