@@ -190,7 +366,7 @@
@@ -392,12 +649,11 @@ onMounted(async () => {
.home__actions {
display: grid;
- grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+ grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: var(--space-3);
}
.home__actions--secondary { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
-.home__actions--danger { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.sync-banner {
display: flex;
@@ -451,9 +707,7 @@ onMounted(async () => {
.action-btn--secondary { background: var(--color-surface-alt); color: var(--color-text); border: 1px solid var(--color-border); }
.action-btn--secondary:hover { background: var(--color-border-light); }
-
-.action-btn--danger { background: transparent; color: var(--color-error); border: 1px solid var(--color-error); }
-.action-btn--danger:hover { background: rgba(192, 57, 43, 0.08); }
+.action-btn--secondary:disabled { opacity: 0.4; cursor: not-allowed; }
.enrichment-row {
display: flex;
@@ -528,13 +782,15 @@ onMounted(async () => {
.add-jobs__textarea:focus { outline: 2px solid var(--app-primary); outline-offset: 1px; }
-.advanced {
+/* ── Danger Zone ──────────────────────────────────────── */
+
+.danger-zone {
background: var(--color-surface-raised);
border: 1px solid var(--color-border-light);
border-radius: var(--radius-md);
}
-.advanced__summary {
+.danger-zone__summary {
padding: var(--space-3) var(--space-4);
cursor: pointer;
font-size: var(--text-sm);
@@ -544,21 +800,172 @@ onMounted(async () => {
user-select: none;
}
-.advanced__summary::-webkit-details-marker { display: none; }
-.advanced__summary::before { content: '▶ '; font-size: 0.7em; }
-details[open] > .advanced__summary::before { content: '▼ '; }
+.danger-zone__summary::-webkit-details-marker { display: none; }
+.danger-zone__summary::before { content: '▶ '; font-size: 0.7em; }
+details[open] > .danger-zone__summary::before { content: '▼ '; }
-.advanced__body { padding: 0 var(--space-4) var(--space-4); display: flex; flex-direction: column; gap: var(--space-4); }
+.danger-zone__body {
+ padding: 0 var(--space-4) var(--space-4);
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-5);
+}
-.advanced__warning {
+.dz-block { display: flex; flex-direction: column; gap: var(--space-3); }
+
+.dz-block__title {
font-size: var(--text-sm);
- color: var(--color-warning);
- background: rgba(212, 137, 26, 0.08);
+ font-weight: 600;
+ color: var(--color-text);
+}
+
+.dz-block__desc {
+ font-size: var(--text-sm);
+ color: var(--color-text-muted);
+}
+
+.dz-scope {
+ border: none;
+ padding: 0;
+ margin: 0;
+ display: flex;
+ gap: var(--space-5);
+ flex-wrap: wrap;
+}
+
+.dz-scope__legend {
+ font-size: var(--text-xs);
+ color: var(--color-text-muted);
+ margin-bottom: var(--space-2);
+ float: left;
+ width: 100%;
+}
+
+.dz-scope__option {
+ display: flex;
+ align-items: center;
+ gap: var(--space-2);
+ font-size: var(--text-sm);
+ cursor: pointer;
+}
+
+.dz-actions {
+ display: flex;
+ gap: var(--space-3);
+ flex-wrap: wrap;
+}
+
+.dz-confirm {
padding: var(--space-3) var(--space-4);
border-radius: var(--radius-md);
- border-left: 3px solid var(--color-warning);
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-3);
}
+.dz-confirm__msg {
+ font-size: var(--text-sm);
+ padding: var(--space-3) var(--space-4);
+ border-radius: var(--radius-md);
+ border-left: 3px solid;
+}
+
+.dz-confirm__msg--info {
+ background: rgba(52, 152, 219, 0.1);
+ border-color: var(--app-primary);
+ color: var(--color-text);
+}
+
+.dz-confirm__msg--warn {
+ background: rgba(192, 57, 43, 0.08);
+ border-color: var(--color-error);
+ color: var(--color-text);
+}
+
+.dz-confirm__actions {
+ display: flex;
+ gap: var(--space-3);
+}
+
+.dz-divider {
+ border: none;
+ border-top: 1px solid var(--color-border-light);
+ margin: 0;
+}
+
+.dz-task {
+ display: flex;
+ align-items: center;
+ gap: var(--space-2);
+ padding: var(--space-2) var(--space-3);
+ background: var(--color-surface-alt);
+ border-radius: var(--radius-md);
+ font-size: var(--text-xs);
+}
+
+.dz-task__icon { flex-shrink: 0; }
+.dz-task__type { font-family: var(--font-mono); color: var(--color-text-muted); min-width: 120px; }
+.dz-task__label { flex: 1; color: var(--color-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dz-task__status { color: var(--color-text-muted); font-style: italic; }
+.dz-task__cancel { margin-left: var(--space-2); }
+
+.dz-kill { align-self: flex-start; }
+
+.dz-more {
+ background: transparent;
+ border: none;
+}
+
+.dz-more__summary {
+ cursor: pointer;
+ font-size: var(--text-sm);
+ font-weight: 600;
+ color: var(--color-text-muted);
+ list-style: none;
+ user-select: none;
+ padding: var(--space-1) 0;
+}
+
+.dz-more__summary::-webkit-details-marker { display: none; }
+.dz-more__summary::before { content: '▶ '; font-size: 0.7em; }
+details[open] > .dz-more__summary::before { content: '▼ '; }
+
+.dz-more__body {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+ gap: var(--space-5);
+ margin-top: var(--space-4);
+}
+
+.dz-more__item { display: flex; flex-direction: column; gap: var(--space-2); }
+
+/* ── Setup banners ────────────────────────────────────── */
+
+.banners {
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-2);
+}
+
+.banner {
+ display: flex;
+ align-items: center;
+ gap: var(--space-3);
+ padding: var(--space-3) var(--space-4);
+ background: var(--color-surface-raised);
+ border: 1px solid var(--color-border-light);
+ border-radius: var(--radius-md);
+ font-size: var(--text-sm);
+}
+
+.banner__icon { flex-shrink: 0; }
+.banner__text { flex: 1; color: var(--color-text); }
+.banner__link { color: var(--app-primary); text-decoration: none; white-space: nowrap; font-weight: 500; }
+.banner__link:hover { text-decoration: underline; }
+.banner__dismiss { margin-left: var(--space-1); }
+
+/* ── Toast ────────────────────────────────────────────── */
+
.stoop-toast {
position: fixed;
bottom: var(--space-6);
@@ -588,6 +995,7 @@ details[open] > .advanced__summary::before { content: '▼ '; }
.home { padding: var(--space-4); gap: var(--space-6); }
.home__greeting { font-size: var(--text-2xl); }
.home__metrics { grid-template-columns: repeat(3, 1fr); }
+ .dz-more__body { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {