syntaxbullet/minabot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refine settings, archive, and check-in styling

Browse Source
This commit is contained in:
syntaxbullet
2026-09-04 18:56:05 +02:00
parent 1208e93953
commit 865bdd1328
9 changed files with 184 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
styles/design-system.css
View File

@@ -1435,3 +1435,73 @@
.ds-editable-task-row { gap: 4px; }
.ds-inline-item-form { padding: 16px; }
}
/* Secondary workspace flows share the same flat surfaces and editorial hierarchy. */
.ds-action-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; min-width: 0; }
.ds-action-row > .ds-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; max-width: 100%; overflow-wrap: anywhere; }
.ds-action-row > .ds-button svg { flex: 0 0 auto; }
.ds-primary-actions { margin-top: 24px; }
.ds-utility-row { border-top: 1px solid var(--ds-rule); padding-top: 12px; margin-top: 20px; gap: 4px; }
.ds-utility-row .ds-button { color: var(--ds-secondary); @apply type-small; }
.ds-utility-row .ds-button[aria-expanded="true"] { color: var(--ds-ink); background: var(--ds-paper); }
.ds-workspace-panel { border: 1px solid var(--ds-rule); padding: 32px; margin: 32px 0 40px; min-width: 0; }
.ds-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.ds-panel-heading > div { min-width: 0; }
.ds-panel-heading h2 { margin-top: 10px; @apply type-section; overflow-wrap: anywhere; }
.ds-panel-description { margin-top: 12px !important; color: var(--ds-secondary); max-width: 52ch; }
.ds-panel-close { flex: 0 0 44px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--ds-rule); }
.ds-setting-row { display: grid; grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.6fr); gap: 48px; padding: 28px 0; border-top: 1px solid var(--ds-rule); }
.ds-setting-row:last-of-type { padding-bottom: 0; }
.ds-setting-heading h3 { @apply type-ui-heading; }
.ds-setting-heading > div { display: grid; gap: 12px; margin-top: 10px; max-width: 32ch; color: var(--ds-secondary); @apply type-small; }
.ds-setting-controls { display: grid; gap: 16px; min-width: 0; align-content: start; }
.ds-form-stack { display: grid; gap: 20px; min-width: 0; align-content: start; }
.ds-form-stack .ds-field { margin-bottom: 0; }
.ds-supporting-copy, .ds-meta-label { color: var(--ds-secondary); @apply type-small; overflow-wrap: anywhere; }
.ds-meta-label { font-variant-numeric: tabular-nums; }
.ds-clock-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ds-clock-fields input { font-variant-numeric: tabular-nums; }
.ds-preference-toggle { padding: 16px; background: var(--ds-surface); border: 1px solid var(--ds-rule); }
.ds-preference-toggle .ds-checkbox-description { margin-top: 4px; }
.ds-delivery-note { display: grid; gap: 6px; padding: 14px 16px; border-left: 2px solid var(--ds-control-border); background: var(--ds-surface); @apply type-small; }
.ds-confirmation { padding: 24px; background: var(--ds-surface); border-left: 2px solid var(--ds-ink); }
.ds-form-message { @apply type-small; color: var(--ds-secondary); overflow-wrap: anywhere; }
.ds-form-message:empty { display: none; }
.ds-form-message:not(:empty) { padding: 12px 0; }
.ds-form-message--error:not(:empty) { padding: 12px 16px; border-left: 2px solid var(--ds-ink); background: var(--ds-surface); color: var(--ds-ink); }
.ds-record { border-top: 1px solid var(--ds-rule); min-width: 0; }
.ds-record-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 0; }
.ds-record-copy { min-width: 0; }
.ds-record-copy h3 { @apply type-title; overflow-wrap: anywhere; }
.ds-record-copy p { margin-top: 6px; color: var(--ds-secondary); @apply type-small; }
.ds-record-heading > .ds-action-row { flex-shrink: 0; }
.ds-disclosure-icon { transition: transform 160ms ease; }
[aria-expanded="true"] > .ds-disclosure-icon { transform: rotate(180deg); }
.ds-record-detail { padding: 8px 0 24px; }
.ds-empty-panel { display: flex; align-items: flex-start; gap: 18px; padding: 28px; background: var(--ds-surface); }
.ds-empty-panel > svg { flex-shrink: 0; color: var(--ds-secondary); }
.ds-empty-panel .ds-supporting-copy { margin-top: 8px; max-width: 48ch; }
.ds-history-actions { justify-content: flex-end; margin-top: 12px; }
.ds-history-editor { display: grid; grid-template-columns: minmax(180px, 0.8fr) minmax(0, 1.6fr); gap: 32px; padding: 24px; margin-top: 12px; border: 1px solid var(--ds-rule); background: var(--ds-surface); }
.ds-check-in-heading { display: grid; gap: 6px; }
.ds-check-in-controls { padding-left: 28px; border-left: 1px solid var(--ds-rule); }
@media (max-width: 900px) {
.ds-setting-row { gap: 28px; grid-template-columns: minmax(160px, 0.8fr) minmax(0, 1.6fr); }
.ds-clock-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ds-clock-fields > .ds-field:first-child { grid-column: 1 / -1; }
.ds-record-heading { align-items: flex-start; flex-direction: column; gap: 16px; }
}
@media (max-width: 640px) {
.ds-workspace-panel { padding: 20px; margin: 24px 0 32px; }
.ds-panel-heading { gap: 16px; margin-bottom: 24px; }
.ds-panel-heading h2 { @apply type-title; }
.ds-panel-description { @apply type-small; }
.ds-setting-row { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 24px 0; }
.ds-setting-heading > div { max-width: none; }
.ds-confirmation, .ds-empty-panel { padding: 18px; }
.ds-history-editor { grid-template-columns: minmax(0, 1fr); padding: 20px; gap: 24px; }
.ds-check-in-controls { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--ds-rule); }
.ds-history-actions { justify-content: flex-start; }
.ds-record-heading > .ds-action-row { flex-shrink: 1; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) { .ds-disclosure-icon { transition: none; } }