chore(release): v1.9.7 — compact mobile filter bars

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "app-ts",
-  "version": "1.9.5",
+  "version": "1.9.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "app-ts",
-      "version": "1.9.5",
+      "version": "1.9.7",
       "license": "ISC",
       "dependencies": {
         "@dnd-kit/core": "^6.3.1",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "app-ts",
-  "version": "1.9.5",
+  "version": "1.9.7",
   "description": "",
   "main": "dist/server.js",
   "scripts": {

src/admin/components.css

@@ -610,6 +610,25 @@
     0 0 0 1px var(--border-color);
 }
 
+@media (max-width: 640px) {
+  .admin-tabs {
+    display: flex;
+    max-width: 100%;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    scrollbar-width: none;
+  }
+
+  .admin-tabs::-webkit-scrollbar {
+    display: none;
+  }
+
+  .admin-tab {
+    flex: 0 0 auto;
+    min-height: 44px;
+  }
+}
+
 /* ============================================================================
    Empty State
    ============================================================================ */
@@ -1075,37 +1094,44 @@
 }
 
 @media (max-width: 768px) {
+  /* Compact 2-up filter grid instead of a tall full-width column:
+     the search box spans the row; the filter selects / date pickers sit
+     two-per-row; the reset button spans the row. Touch sizing (44px height +
+     16px font from forms.css) is unchanged — this just halves the vertical
+     footprint of multi-filter bars on phones. */
   .admin-search-bar {
-    flex-direction: column;
     align-items: stretch;
   }
 
-  .admin-search-bar .admin-form-input,
+  /* Search box spans the full row (handles both the .admin-search wrapper
-  .admin-search-bar .admin-form-select {
+     and a bare text input used directly as the search field). */
-    max-width: 100%;
+  .admin-search-bar > .admin-search,
-  }
+  .admin-search-bar > .admin-form-input:not([type="date"]) {
-
+    flex: 1 1 100%;
-  .admin-search-bar .react-datepicker-wrapper {
+    max-width: none;
-    max-width: 100%;
   }
 
   .admin-search {
-    max-width: 100%;
+    min-width: 0;
+    max-width: none;
+  }
+
+  /* Filters (status/supplier selects, native date inputs, datepicker
+     wrappers): two per row. */
+  .admin-search-bar > .admin-form-select,
+  .admin-search-bar > .admin-form-input[type="date"],
+  .admin-search-bar > .react-datepicker-wrapper {
+    flex: 1 1 calc(50% - 0.25rem);
+    min-width: 0;
+    max-width: none;
+  }
+
+  /* Action buttons (e.g. "Zrušit filtry") span the full row. */
+  .admin-search-bar > .admin-btn {
     flex: 1 1 100%;
   }
 }
 
-@media (max-width: 480px) {
-  .admin-search-bar .admin-form-input,
-  .admin-search-bar .admin-form-select {
-    min-width: 100%;
-  }
-
-  .admin-search-bar .react-datepicker-wrapper {
-    min-width: 100%;
-  }
-}
-
 /* ============================================================================
    Item Picker (Warehouse)
    ============================================================================ */
@@ -1185,3 +1211,14 @@
   color: var(--text-secondary);
   white-space: nowrap;
 }
+
+@media (max-width: 640px) {
+  .admin-item-picker-list {
+    max-width: calc(100vw - 24px);
+    overflow-y: auto;
+  }
+
+  .admin-item-picker-item {
+    min-height: 44px;
+  }
+}

src/admin/forms.css

@@ -488,3 +488,23 @@
   color: var(--text-tertiary);
   font-size: 0.8125rem;
 }
+
+@media (max-width: 640px) {
+  .admin-customer-dropdown {
+    max-width: calc(100vw - 24px);
+    overflow-y: auto;
+  }
+
+  .admin-customer-dropdown-item {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    min-height: 44px;
+  }
+
+  .admin-customer-selected .admin-btn-icon {
+    min-width: 44px;
+    min-height: 44px;
+    margin-right: -10px;
+  }
+}