style: 压缩顺运宝工具条 (#219)

admin/static/css/app.css

@@ -7,6 +7,19 @@
 
 * { box-sizing: border-box; }
 
+/* 视觉上隐藏，但继续让屏幕阅读器读取。表单控件不能只剩占位符或装饰文字。 */
+.visually-hidden {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
 body {
   margin: 0;
   font-family: "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
@@ -155,6 +168,40 @@ body.syb-page-body > .page {
   resize: vertical;
 }
 .syb-order-search-input[aria-invalid="true"] { border-color: #b42318; }
+
+/* SYB 工具条在 1366px 桌面窗口压成一行。所有规则都限定在本页面，避免影响
+   其他主列表；窄于该断点时继续使用通用 toolbar 的自然换行。 */
+.syb-date-separator { color: #667085; }
+@media (min-width: 1360px) {
+  .syb-toolbar {
+    flex-wrap: nowrap;
+    gap: 4px;
+    padding: 8px 10px;
+  }
+  .syb-toolbar .inline { gap: 4px; }
+  .syb-toolbar button,
+  .syb-toolbar .button-link {
+    padding-right: 7px;
+    padding-left: 7px;
+  }
+  .syb-toolbar input,
+  .syb-toolbar select,
+  .syb-toolbar textarea,
+  .syb-toolbar button,
+  .syb-toolbar .button-link { font-size: 13px; }
+  .syb-toolbar .sync-range-form input[type="date"] {
+    width: 116px;
+    min-width: 116px;
+  }
+  .syb-toolbar .syb-filter-form {
+    flex: 1 1 auto;
+    min-width: 0;
+  }
+  .syb-toolbar .syb-filter-form select {
+    width: 138px;
+    min-width: 138px;
+  }
+}
 /* 蝦皮工具条同时放商品和店铺两个搜索框，各占剩余工具条的约 20%。
    min-width 继续由通用输入框规则提供，窄窗口时交给工具条自然换行。 */
 .toolbar input[type="text"].shopee-search-field { flex: 0 1 20%; }