peregrine/web/src/assets/peregrine.css
pyr0ball 8e36863a49
Some checks failed
CI / Backend (Python) (push) Failing after 2m15s
CI / Frontend (Vue) (push) Failing after 21s
Mirror / mirror (push) Failing after 9s
feat: Interview prep Q&A, cf-orch hardware profile, a11y fixes, dark theme
Backend
- dev-api.py: Q&A suggest endpoint, Log Contact, cf-orch node detection in wizard
  hardware step, canonical search_profiles format (profiles:[...]), connections
  settings endpoints, Resume Library endpoints
- db_migrate.py: migrations 002/003/004 — ATS columns, resume review, final
  resume struct
- discover.py: _normalize_profiles() for legacy wizard YAML format compat
- resume_optimizer.py: section-by-section resume parsing + scoring
- task_runner.py: Q&A and contact-log task types
- company_research.py: accessibility brief column wiring
- generate_cover_letter.py: restore _candidate module-level binding

Frontend
- InterviewPrepView.vue: Q&A chat tab, Log Contact form, MarkdownView rendering
- InterviewCard.vue: new reusable card component for interviews kanban
- InterviewsView.vue: rejected analytics section with stage breakdown chips
- ResumeProfileView.vue: sync with new resume store shape
- SearchPrefsView.vue: cf-orch toggle, profile format migration
- SystemSettingsView.vue: connections settings wiring
- ConnectionsSettingsView.vue: new view for integration connections
- MarkdownView.vue: new component for safe markdown rendering
- ApplyWorkspace.vue: a11y — h1→h2 demotion, aria-expanded on Q&A toggle,
  confirmation dialog on Reject action (#98 #99 #100)
- peregrine.css: explicit [data-theme="dark"] token block for light-OS users (#101),
  :focus-visible outline (#97)
- wizard.css: cf-orch hardware step styles
- WizardHardwareStep.vue: cf-orch node display, profile selection with orch option
- WizardLayout.vue: hardware step wiring

Infra
- compose.yml / compose.cloud.yml: cf-orch agent sidecar, llm.cloud.yaml mount
- Dockerfile.cfcore: cf-core editable install in image build
- HANDOFF-xanderland.md: Podman/systemd setup guide for beta tester
- podman-standalone.sh: standalone Podman run script

Tests
- test_dev_api_settings.py: remove stale worktree path bootstrap (credential_store
  now in main repo); fix job_boards fixture to use non-empty list
- test_wizard_api.py: update profiles assertion to superset check (cf-orch added);
  update step6 assertion to canonical profiles[].titles format
2026-04-14 17:01:18 -07:00

137 lines
5.2 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* web/src/assets/peregrine.css
Peregrine-specific token overrides — imported AFTER theme.css.
Source of truth: circuitforge-plans/peregrine/2026-03-03-nuxt-design-system.md
Brand:
Falcon Blue (#2B6CB0) — slate-blue back plumage of the peregrine falcon
Talon Orange (#E06820) — vivid orange-yellow talons and cere
*/
/* ── Page-level ─────────────────────────────────────── */
html {
overscroll-behavior-x: none;
overflow-x: clip; /* clip (not hidden) — no BFC scroll-container side effect. Gotcha #3. */
}
body {
overflow-x: hidden;
}
/* ── Light mode (default) ──────────────────────────── */
:root {
/* ── Peregrine brand colors ── */
--app-primary: #2B6CB0; /* Falcon Blue — 4.70:1 on #eaeff8 ✅ AA */
--app-primary-hover: #245A9E;
--app-primary-light: #EBF4FF; /* subtle tint — background use only */
--app-accent: #E06820; /* Talon Orange — use dark text on top */
--app-accent-hover: #C05415;
--app-accent-light: #FFF3EB; /* subtle tint — background use only */
--app-accent-text: #1a2338; /* on-button text — dark navy, NEVER white (only 2.8:1) */
/* ── CSS variable aliases (component names → theme.css canonical names. Gotcha #5.) ── */
--color-bg: var(--color-surface);
--color-text-secondary: var(--color-text-muted);
/* ── Layout ── */
--nav-height: 4rem; /* top bar height (mobile) */
--sidebar-width: 220px; /* persistent sidebar (≥1024px) */
/* ── Pipeline status colors ── */
/* Always pair with text label or icon — never color alone (accessibility) */
--status-pending: var(--color-warning);
--status-approve: var(--color-success);
--status-reject: var(--color-error);
--status-applied: var(--color-info);
--status-synced: #5b4fa8;
--status-archived: var(--color-text-muted);
--status-survey: #6d3fa8;
--status-phone: #1a7a6e;
--status-interview: var(--color-info);
--status-offer: #b8620a;
--status-hired: var(--color-success);
/* ── Match score thresholds ── */
--score-high: var(--color-success); /* ≥ 70% */
--score-mid-high: #2b7cb8; /* 5069% — Falcon Blue variant */
--score-mid: var(--color-warning); /* 3049% */
--score-low: var(--color-error); /* < 30% */
--score-none: var(--color-text-muted);
/* ── Motion tokens ── */
--swipe-exit: 300ms;
--swipe-spring: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);
--confetti-dur: 3500ms;
--transition-spring: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);
--transition-dismiss: 350ms ease-in;
--transition-enter: 250ms ease-out;
/* ── Type scale ── */
--text-xs: 0.75rem; /* 12px — badge labels, timestamps, keyboard hints */
--text-sm: 0.875rem; /* 14px — card secondary, captions */
--text-base: 1rem; /* 16px — body, card descriptions */
--text-lg: 1.125rem; /* 18px — card title, section headers */
--text-xl: 1.25rem; /* 20px — page section headings */
--text-2xl: 1.5rem; /* 24px — page titles */
--text-3xl: 1.875rem; /* 30px — dashboard greeting */
}
/* ── Dark mode ─────────────────────────────────────── */
/* Covers both: OS-level dark preference AND explicit dark theme selection in UI */
@media (prefers-color-scheme: dark) {
:root:not([data-theme="hacker"]) {
--app-primary: #68A8D8; /* Falcon Blue (dark) — 6.54:1 on #16202e ✅ AA */
--app-primary-hover: #7BBDE6;
--app-primary-light: #0D1F35;
--app-accent: #F6872A; /* Talon Orange (dark) — 5.22:1 on #16202e ✅ AA */
--app-accent-hover: #FF9840;
--app-accent-light: #2D1505;
--app-accent-text: #1a2338;
--score-mid-high: #5ba3d9; /* lighter blue for dark bg */
--status-synced: #9b8fea;
--status-survey: #b08fea;
--status-phone: #4ec9be;
--status-offer: #f5a43a;
}
}
/* Explicit [data-theme="dark"] — fires when user picks dark via theme picker
on a light-OS machine (where prefers-color-scheme: dark won't match) */
[data-theme="dark"]:not([data-theme="hacker"]) {
--app-primary: #68A8D8;
--app-primary-hover: #7BBDE6;
--app-primary-light: #0D1F35;
--app-accent: #F6872A;
--app-accent-hover: #FF9840;
--app-accent-light: #2D1505;
--app-accent-text: #1a2338;
--score-mid-high: #5ba3d9;
--status-synced: #9b8fea;
--status-survey: #b08fea;
--status-phone: #4ec9be;
--status-offer: #f5a43a;
}
/* ── Hacker mode (Konami easter egg) ──────────────── */
[data-theme="hacker"] {
--app-primary: #00ff41;
--app-primary-hover: #00cc33;
--app-primary-light: #001a00;
--app-accent: #00ff41;
--app-accent-hover: #00cc33;
--app-accent-light: #001a00;
--app-accent-text: #0a0c0a;
}
/* ── Focus style — keyboard nav (accessibility requirement) ── */
:focus-visible {
outline: 2px solid var(--app-primary);
outline-offset: 3px;
border-radius: var(--radius-sm);
}