pyro/dist/basic.css

Pyro custom elements

.pyro{--pyro-font-family: system-ui, "Segoe UI", Roboto, Oxygen, Ubuntu, "Helvetica Neue", sans-serif;--pyro-font-size: 1em;--pyro-font-size-s: .75em;--pyro-font-size-l: 1.5em;--pyro-text-color: #050505;--pyro-text-color-lighter: #454545;--pyro-line-height: normal;--pyro-spacing: .5em;--pyro-spacing-s: calc(var(--pyro-spacing) * .5);--pyro-spacing-m: var(--pyro-spacing);--pyro-spacing-l: calc(var(--pyro-spacing) * 2);--pyro-border-width: 1px;--pyro-border-style: solid;--pyro-border-color: #4444;--pyro-border: var(--pyro-border-width) var(--pyro-border-style) var(--pyro-border-color);--pyro-border-radius: .25em;--pyro-accent-color: #e23e3e;--pyro-surface-color: #fbfbfb;--pyro-text-color-on-surface: inherit;--pyro-foreground-color: #eee;--pyro-text-color-on-foreground: inherit;--pyro-hover-color: #eee;--pyro-disabled-color: #ccc6;--pyro-primary-color: #e23e3e;--pyro-text-color-on-primary: inherit;--pyro-secondary-color: #212121;--pyro-text-color-on-secondary: #ccc;--pyro-tertiary-color: #006239;--pyro-text-color-on-tertiary: inherit;--pyro-info-color: #1c95d7;--pyro-success-color: #408944;--pyro-warning-color: #ef7d1d;--pyro-error-color: #d94343;--pyro-info-color-lighter: hsl(from var(--pyro-info-color) h s 90);--pyro-success-color-lighter: hsl(from var(--pyro-success-color) h s 90);--pyro-warning-color-lighter: hsl(from var(--pyro-warning-color) h s 90);--pyro-error-color-lighter: hsl(from var(--pyro-error-color) h s 90);--pyro-fields-min-width: 130px}.pyro-experiments{--pyro-transparency: .7;--pyro-margin: 1em;--pyro-text-heading: ;--pyro-button-border-primary-color: #0f0;--pyro-lighten-factor: .5;--pyro-shadow: 0 1px 2px rgba(15, 17, 17, .15);--pyro-hover-filter: brightness(110%)}@media (prefers-color-scheme: dark){.pyro{--pyro-text-color: #ddd;--pyro-surface-color: #222;--pyro-accent-color: #d22e2e;--pyro-info-color-lighter: hsl(from var(--pyro-info-color) h s 17);--pyro-success-color-lighter: hsl(from var(--pyro-success-color) h s 17);--pyro-warning-color-lighter: hsl(from var(--pyro-warning-color) h s 17);--pyro-error-color-lighter: hsl(from var(--pyro-error-color) h s 17)}}*:not(:defined){opacity:0}*:defined{opacity:1}