Trying to make UX improvements.

inventory/static/css/components/draw.css

@@ -2,6 +2,7 @@
     width: 100%;
     height: 80vh;
     position: relative;
+    overflow: hidden;
 }
 
 .grid-widget [data-grid] {
@@ -30,6 +31,8 @@
 }
 
 .grid-widget [data-toolbar] {
+    width: min(100%, var(--grid-maxw, 100%));
+    box-sizing: border-box;
     margin: 0 auto;
 }
 
@@ -37,4 +40,32 @@
     transform: translate(-50%, -50%);
     z-index: 10000;
     pointer-events: none;
+}
+
+.grid-widget .toolbar {
+    display: flex;
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    overflow-y: hidden;
+    gap: .5rem;
+    align-items: center;
+}
+
+.grid-widget .toolbar-range {
+    width: 120px;
+    margin: 0;
+    flex: 0 0 120px;
+}
+
+.grid-widget [data-toolbar] .badge,
+.grid-widget [data-toolbar] .input-group-text {
+    white-space: nowrap;
+}
+
+.grid-widget [data-toolbar]>* {
+    align-self: center;
+}
+
+.grid-widget [data-toolbar] .vr {
+    align-self: stretch;
 }