mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-07-18 09:48:09 +00:00
Move the cascading rules (keyframes, .agent-shimmer-text, scoped reset) from globally imported agentTheme.css into agentPanel.css, loaded only by the lazy AgentPanelRoot chunk; agentTheme.css keeps the @theme blocks. Dist grep: cascading rules land in AgentPanelRoot-*.css only, not entry css.
77 lines
1.9 KiB
CSS
77 lines
1.9 KiB
CSS
@keyframes agent-collapsible-down {
|
|
from {
|
|
height: 0;
|
|
}
|
|
to {
|
|
height: var(--reka-collapsible-content-height);
|
|
}
|
|
}
|
|
|
|
@keyframes agent-collapsible-up {
|
|
from {
|
|
height: var(--reka-collapsible-content-height);
|
|
}
|
|
to {
|
|
height: 0;
|
|
}
|
|
}
|
|
|
|
@keyframes agent-shimmer {
|
|
from {
|
|
background-position: 150% center;
|
|
}
|
|
to {
|
|
background-position: -50% center;
|
|
}
|
|
}
|
|
|
|
.agent-shimmer-text {
|
|
background: linear-gradient(
|
|
90deg,
|
|
var(--color-muted-foreground) 35%,
|
|
var(--color-base-foreground) 50%,
|
|
var(--color-muted-foreground) 65%
|
|
);
|
|
background-size: 200% auto;
|
|
background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
animation: agent-shimmer 1.8s linear infinite;
|
|
}
|
|
|
|
.disable-animations .agent-shimmer-text {
|
|
animation: none;
|
|
color: var(--color-muted-foreground);
|
|
-webkit-text-fill-color: currentcolor;
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.agent-shimmer-text {
|
|
animation: none;
|
|
color: var(--color-muted-foreground);
|
|
-webkit-text-fill-color: currentcolor;
|
|
}
|
|
}
|
|
|
|
/* Tailwind Preflight is disabled host-wide (PrimeVue + litegraph coexistence), so raw form
|
|
elements in the panel inherit UA chrome: a <button> gets the buttonface fill + 2px outset
|
|
border, a <textarea>/<input> gets its own border, font and padding. Re-apply Preflight's
|
|
normalization, scoped to the panel root and its teleported reka surfaces (dialogs,
|
|
dropdowns, drawer carry .agent-scope). :where() holds the selectors at zero specificity so
|
|
each element's own bg-* / border utilities still win. */
|
|
@layer base {
|
|
:where(#agent-panel-root, .agent-scope)
|
|
:where(button, [type='button'], [type='reset'], [type='submit']) {
|
|
appearance: none;
|
|
background-color: transparent;
|
|
border: 0 solid;
|
|
}
|
|
|
|
:where(#agent-panel-root, .agent-scope) :where(textarea, input, select) {
|
|
appearance: none;
|
|
border: 0 solid;
|
|
background-color: transparent;
|
|
font: inherit;
|
|
color: inherit;
|
|
}
|
|
}
|