mirror of
https://github.com/NousResearch/hermes-agent.git
synced 2026-04-25 00:51:20 +00:00
115 lines
4.3 KiB
CSS
115 lines
4.3 KiB
CSS
@import 'tailwindcss';
|
|
@import '@nous-research/ui/styles/globals.css';
|
|
|
|
/* Scan the published design-system bundle so its utility classes survive
|
|
Tailwind's JIT purge. */
|
|
@source '../node_modules/@nous-research/ui/dist';
|
|
|
|
/* ------------------------------------------------------------------ */
|
|
/* Hermes Agent — Nous DS with the LENS_0 (Hermes teal) lens applied */
|
|
/* statically. Mirrors nousnet-web/(hermes-agent)/layout.tsx so the */
|
|
/* canonical Hermes palette is the default — teal canvas + cream */
|
|
/* accent — without relying on leva/gsap at runtime. */
|
|
/* ------------------------------------------------------------------ */
|
|
|
|
:root {
|
|
/* LENS_0 — from design-language/src/ui/components/overlays/index.tsx.
|
|
These are the defaults for the `default` (Hermes Teal) dashboard theme;
|
|
ThemeProvider rewrites them as inline styles when a user switches themes. */
|
|
--foreground: color-mix(in srgb, #ffffff 0%, transparent);
|
|
--foreground-base: #ffffff;
|
|
--foreground-alpha: 0;
|
|
--midground: color-mix(in srgb, #ffe6cb 100%, transparent);
|
|
--midground-base: #ffe6cb;
|
|
--midground-alpha: 1;
|
|
--background: color-mix(in srgb, #041c1c 100%, transparent);
|
|
--background-base: #041c1c;
|
|
--background-alpha: 1;
|
|
|
|
/* Consumed by <Backdrop />; also theme-switchable. */
|
|
--warm-glow: rgba(255, 189, 56, 0.35);
|
|
--noise-opacity-mul: 1;
|
|
}
|
|
|
|
/* Nousnet's hermes-agent layout bumps `small` and `code` to readable
|
|
dashboard sizes. Keep in sync. */
|
|
small { font-size: 1.0625rem; }
|
|
code { font-size: 0.875rem; }
|
|
|
|
/* Shadcn-compat tokens.
|
|
The dashboard's page code predates the Nous DS and uses shadcn-style
|
|
utility classes (bg-card, text-muted-foreground, border-border, etc.)
|
|
extensively. Rather than rewrite every call site, we expose those
|
|
tokens on top of the Nous palette so classes continue to resolve. */
|
|
@theme inline {
|
|
/* Remap foreground to midground so `text-foreground` / `bg-foreground`
|
|
stay visible — in LENS_0, `--foreground` itself has alpha 0. */
|
|
--color-foreground: var(--midground);
|
|
|
|
--color-card: color-mix(in srgb, var(--midground-base) 4%, var(--background-base));
|
|
--color-card-foreground: var(--midground);
|
|
--color-primary: var(--midground);
|
|
--color-primary-foreground: var(--background-base);
|
|
--color-secondary: color-mix(in srgb, var(--midground-base) 6%, var(--background-base));
|
|
--color-secondary-foreground: var(--midground);
|
|
--color-muted: color-mix(in srgb, var(--midground-base) 8%, var(--background-base));
|
|
--color-muted-foreground: color-mix(in srgb, var(--midground-base) 55%, transparent);
|
|
--color-accent: color-mix(in srgb, var(--midground-base) 10%, var(--background-base));
|
|
--color-accent-foreground: var(--midground);
|
|
--color-destructive: #fb2c36;
|
|
--color-destructive-foreground: #ffffff;
|
|
--color-success: #4ade80;
|
|
--color-warning: #ffbd38;
|
|
--color-border: color-mix(in srgb, var(--midground-base) 15%, transparent);
|
|
--color-input: color-mix(in srgb, var(--midground-base) 15%, transparent);
|
|
--color-ring: var(--midground);
|
|
--color-popover: color-mix(in srgb, var(--midground-base) 4%, var(--background-base));
|
|
--color-popover-foreground: var(--midground);
|
|
}
|
|
|
|
|
|
/* Toast animations used by `components/Toast.tsx`. */
|
|
@keyframes toast-in {
|
|
from { opacity: 0; transform: translateX(16px); }
|
|
to { opacity: 1; transform: translateX(0); }
|
|
}
|
|
@keyframes toast-out {
|
|
from { opacity: 1; transform: translateX(0); }
|
|
to { opacity: 0; transform: translateX(16px); }
|
|
}
|
|
|
|
/* Hide scrollbar utility — used by the header's overflow-x nav row. */
|
|
.scrollbar-none {
|
|
-ms-overflow-style: none;
|
|
scrollbar-width: none;
|
|
}
|
|
.scrollbar-none::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
/* Plus-lighter blend used by logos/titles for a subtle glow. */
|
|
.blend-lighter {
|
|
mix-blend-mode: plus-lighter;
|
|
}
|
|
|
|
/* System UI-monospace stack — distinct from `font-courier` (Courier
|
|
Prime), used for dense data readouts where the display font would
|
|
break the grid. */
|
|
.font-mono-ui {
|
|
font-family: ui-monospace, 'SF Mono', 'Cascadia Mono', Menlo, monospace;
|
|
}
|
|
|
|
/* Subtle grain overlay for badges. */
|
|
.grain {
|
|
position: relative;
|
|
}
|
|
.grain::after {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
opacity: 0.12;
|
|
pointer-events: none;
|
|
background: repeating-conic-gradient(currentColor 0% 25%, #0000 0% 50%) 0 0 /
|
|
2px 2px;
|
|
}
|
|
|