feat: 主题

Author: Taois

dashboard/src/components/Layout.vue

@@ -158,7 +158,7 @@
             type="button"
             @click="toggleMobileMore"
           >
-            <span class="mobile-nav-more-icon">•••</span>
+            <svg class="mobile-nav-icon"><use href="#icon-shezhi"></use></svg>
             <span>我的</span>
           </button>
         </nav>
@@ -556,15 +556,15 @@ export default defineComponent({
   width: 100%;
   height: 100%;
   display: grid;
-  grid-template-columns: 40px minmax(0, 1fr) minmax(76px, auto) 40px;
+  grid-template-columns: 40px minmax(0, 1fr) minmax(84px, auto) 40px;
   align-items: center;
   gap: 6px;
   padding: env(safe-area-inset-top) 10px 0;
   background: var(--dp-bg-shell);
 }
 
 .mobile-top-bar.home-theme-visible {
-  grid-template-columns: 40px minmax(0, 1fr) 36px minmax(76px, auto) 40px;
+  grid-template-columns: 40px minmax(0, 1fr) 36px minmax(84px, auto) 40px;
 }
 
 .mobile-brand,
@@ -583,17 +583,19 @@ export default defineComponent({
 }
 
 .mobile-search-pill {
-  min-width: 76px;
+  width: 84px;
+  min-width: 84px;
   height: 36px;
   border: 1px solid var(--dp-border-subtle);
   border-radius: 999px;
   background: var(--dp-bg-surface-muted);
   color: var(--dp-text-secondary);
-  display: inline-flex;
+  display: grid;
+  grid-template-columns: 18px 1fr 18px;
   align-items: center;
-  justify-content: center;
-  gap: 5px;
-  padding: 0 12px;
+  justify-items: center;
+  gap: 0;
+  padding: 0 10px;
   font-size: 13px;
   font-weight: 800;
   font-family: inherit;
@@ -647,6 +649,11 @@ export default defineComponent({
   white-space: nowrap;
 }
 
+.mobile-search-pill span {
+  grid-column: 2;
+  text-align: center;
+}
+
 .mobile-action-icon {
   width: 18px;
   height: 18px;

dashboard/src/views/Parser.vue

@@ -150,6 +150,13 @@
             @end="handleDragEnd"
             item-key="id"
             class="drag-container"
+            handle=".parser-drag-handle"
+            :delay="180"
+            :delay-on-touch-only="true"
+            :touch-start-threshold="8"
+            :fallback-tolerance="8"
+            ghost-class="parser-drag-ghost"
+            chosen-class="parser-drag-chosen"
           >
             <template #item="{ element: parser }">
               <div class="parser-item" :class="{ disabled: !parser.enabled }">
@@ -927,6 +934,15 @@ onMounted(async () => {
   border-bottom: 1px solid var(--dp-border-subtle);
   transition: background 0.2s ease;
   background: var(--dp-bg-surface);
+  touch-action: pan-y;
+}
+
+.parser-drag-ghost {
+  opacity: 0.7;
+}
+
+.parser-drag-chosen {
+  background: var(--dp-bg-surface-muted);
 }
 
 .parser-item:last-child {
@@ -950,6 +966,9 @@ onMounted(async () => {
   margin-right: 12px;
   cursor: grab;
   color: var(--dp-text-tertiary);
+  touch-action: none;
+  user-select: none;
+  -webkit-user-select: none;
 }
 
 .parser-drag-handle:active {