go
/
svelte-kit-vice
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '2fcade063b'
${ noResults }
svelte-kit-vice/src/uix/eidos/components/date-picker/date-picker.css

158 lines
4.9 KiB
Raw Normal View History Unescape

uix: date-picker + date-range-picker components + component audit infra Two new Eidos components shipped end-to-end (wrapper + recipe + demo + Soma provider hardening) plus a checklist-driven audit pipeline that scores all 67 morfo components against doctrinal completion criteria. New components: - date-picker: full popover-anchored picker over date-field + calendar, with calendar/content/trigger parts and demo route. - date-range-picker: standalone wrapper with own calendar/grid/segment surface, demo route, and recipe CSS. - Both wrappers follow Option C disciplined (root + parts attached via explicit assignment, no Object.assign). Supporting Soma changes: - range-calendar provider tightened (211 LOC of behavior, 167 LOC of tests), README brought up to component doctrine. - date-field, date-picker, date-range-field, date-range-picker Soma providers + READMEs updated for new wrappers. - popover provider/close gain props needed by the picker wrappers. Morfo updates: - date-picker / date-range-picker / range-calendar morfos refined for the new APIs (parts, events, ARIA). Audit infrastructure (new): - src/uix/COMPONENT_COMPLETION_CHECKLIST.md — 81 doctrinal rules across morfo / eidos wrapper / recipe CSS / demo / README / cross-layer scripts. Each rule keyed to active_architecture.md, GUIA_IMPLEMENTACION and DEMO_AUTHORING_GUIDE. - scripts/component-audit.ts + `npm run component:audit` — regex parser over all 67 components, emits tmp/component-audit.md with summary scoreboard + per-component findings. Validates against canonical SEMA_FAMILIES / SEMA_VERBS / ARCHETYPE_VOCABULARY / INTENTS. - Initial baseline: 1 PASS, 64 NEEDS-WORK, 2 BROKEN (tooltip, date-range-picker). Top systemic gaps: translations.label (49), README Gaps/Comparativa/Baseline sections (87 combined), keyboard /event ratio under-declaration (15), apg URL absent (19). Misc: - src/uix/kimi-audit-eidos.md — supplementary audit notes. - .gitignore: ignore .codex-* agent scratch artifacts at repo root. - continue.md + READMEs updated through the migration. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
5 months ago
[data-date-picker] {
--_date-field-height: var(--date-field-height-md);
--_date-field-px: var(--date-field-px-md);
--_date-field-gap: var(--date-field-gap-md);
--_date-field-segment-px: var(--date-field-segment-px-md);
--_date-field-font-size: var(--date-field-font-size-md);
--_date-field-accent-border: var(--color-primary-border);
--_date-field-accent-track: var(--color-primary-track);
--_date-field-accent-text: var(--color-primary-text);
display: inline-flex;
flex-direction: column;
gap: var(--date-field-stack-gap);
inline-size: 100%;
min-inline-size: 0;
color: var(--date-field-color);
font-family: var(--date-field-font-family);
font-size: var(--_date-field-font-size);
line-height: var(--date-field-line-height);
}
[data-date-picker][data-size='sm'] {
--_date-field-height: var(--date-field-height-sm);
--_date-field-px: var(--date-field-px-sm);
--_date-field-gap: var(--date-field-gap-sm);
--_date-field-segment-px: var(--date-field-segment-px-sm);
--_date-field-font-size: var(--date-field-font-size-sm);
}
[data-date-picker][data-size='lg'] {
--_date-field-height: var(--date-field-height-lg);
--_date-field-px: var(--date-field-px-lg);
--_date-field-gap: var(--date-field-gap-lg);
--_date-field-segment-px: var(--date-field-segment-px-lg);
--_date-field-font-size: var(--date-field-font-size-lg);
}
[data-date-picker][data-color='secondary'] {
--_date-field-accent-border: var(--color-secondary-border);
--_date-field-accent-track: var(--color-secondary-track);
--_date-field-accent-text: var(--color-secondary-text);
}
[data-date-picker][data-color='neutral'] {
--_date-field-accent-border: var(--color-neutral-border);
--_date-field-accent-track: var(--color-neutral-track);
--_date-field-accent-text: var(--color-neutral-text);
}
[data-date-picker][data-color='affirm'] {
--_date-field-accent-border: var(--color-affirm-border);
--_date-field-accent-track: var(--color-affirm-track);
--_date-field-accent-text: var(--color-affirm-text);
}
[data-date-picker][data-color='fulfill'] {
--_date-field-accent-border: var(--color-fulfill-border);
--_date-field-accent-track: var(--color-fulfill-track);
--_date-field-accent-text: var(--color-fulfill-text);
}
[data-date-picker][data-color='risk'] {
--_date-field-accent-border: var(--color-risk-border);
--_date-field-accent-track: var(--color-risk-track);
--_date-field-accent-text: var(--color-risk-text);
}
[data-date-picker][data-color='threat'] {
--_date-field-accent-border: var(--color-threat-border);
--_date-field-accent-track: var(--color-threat-track);
--_date-field-accent-text: var(--color-threat-text);
}
[data-date-picker][data-color='loss'] {
--_date-field-accent-border: var(--color-loss-border);
--_date-field-accent-track: var(--color-loss-track);
--_date-field-accent-text: var(--color-loss-text);
}
[data-date-picker][data-variant='outline'] [data-date-field-input] {
background: transparent;
}
[data-date-picker][data-variant='ghost'] [data-date-field-input] {
border-color: transparent;
background: transparent;
padding-inline: 0;
}
[data-date-picker][data-invalid] [data-date-field-input] {
border-color: var(--date-field-border-invalid);
}
[data-date-picker][data-disabled] {
opacity: var(--date-field-disabled-opacity);
}
[data-date-picker-trigger] {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
inline-size: var(--_date-field-height);
block-size: var(--_date-field-height);
padding: 0;
border: var(--date-field-border-width) solid var(--date-field-border);
border-radius: var(--date-field-radius);
background: var(--date-field-bg);
color: inherit;
cursor: pointer;
transition:
background var(--date-field-transition-duration) var(--date-field-transition-ease),
border-color var(--date-field-transition-duration) var(--date-field-transition-ease),
box-shadow var(--date-field-transition-duration) var(--date-field-transition-ease),
color var(--date-field-transition-duration) var(--date-field-transition-ease);
}
[data-date-picker-trigger]:hover {
border-color: var(--_date-field-accent-border);
background: var(--_date-field-accent-track);
color: var(--_date-field-accent-text);
}
[data-date-picker-trigger]:focus-visible {
outline: none;
border-color: var(--_date-field-accent-border);
box-shadow: var(--date-field-focus-shadow);
}
[data-date-picker-trigger][data-disabled],
[data-date-picker-trigger]:disabled {
cursor: not-allowed;
opacity: var(--date-field-disabled-opacity);
}
[data-popover-content]:has([data-date-picker-calendar]) {
--_popover-content-width-override: max-content;
--_popover-content-min-width-override: max-content;
--_popover-content-max-width-override: calc(100vw - var(--space-4));
}
[data-date-picker-calendar][data-calendar] {
padding: 0;
border-color: transparent;
background: transparent;
box-shadow: none;
}
[data-date-picker-calendar][data-calendar][data-invalid] {
border-color: transparent;
}
@media (prefers-reduced-motion: reduce) {
[data-date-picker-trigger] {
transition: none;
}
}

Powered by TurnKey Linux.