iter(g158): 日期选择支持快捷区间预设

packages/skin/ui/ui.css

@@ -3242,6 +3242,29 @@ button.ua-step-dot:hover {
   border: none;
   cursor: pointer;
 }
+.ua-datepicker-presets {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--ua-space-1);
+  padding-bottom: var(--ua-space-1);
+  margin-bottom: var(--ua-space-1);
+  border-bottom: 1px solid var(--ua-color-border);
+}
+.ua-datepicker-preset {
+  padding: 2px 8px;
+  font-size: var(--ua-font-size-sm);
+  color: var(--ua-color-text-muted);
+  background: transparent;
+  border: 1px solid var(--ua-color-border);
+  border-radius: var(--ua-radius-sm);
+  cursor: pointer;
+  transition: color 0.15s, border-color 0.15s, background-color 0.15s;
+}
+.ua-datepicker-preset:hover {
+  color: var(--ua-color-accent);
+  border-color: var(--ua-color-accent);
+  background: color-mix(in srgb, var(--ua-color-accent) 8%, transparent);
+}
 @keyframes ua-dp-in {
   from { opacity: 0; transform: translateY(-4px); }
   to   { opacity: 1; transform: translateY(0); }
@@ -3250,6 +3273,7 @@ button.ua-step-dot:hover {
   .ua-datepicker-pop.ua-open { animation: none; }
   .ua-datepicker-trigger,
   .ua-datepicker-day,
+  .ua-datepicker-preset,
   .ua-datepicker-nav { transition: none; }
 }
 .ua-backtop {