@volverjs/style/dist/components/vv-text.css

@volverjs/style is a lightweight responsive CSS utility library to accompany @volverjs/ui-* and static webpages as well.

:where(:host,:root,.theme){--vv-text-font-family: var(--font-sans);--vv-text-font-weight: var(--font-normal);--vv-text-line-height: var(--leading-normal);--vv-text-modifier-headline-font-weight: var(--font-semibold);--vv-text-modifier-headline-line-height: var(--leading-tight);--vv-text-modifier-headline-letter-spacing: var(--tracking-tight);--vv-text-modifier-headline-margin-top: var(--spacing-24);--vv-text-modifier-headline-margin-bottom: var(--spacing-16);--vv-text-modifier-copy-margin-block: var(--spacing-16);--vv-text-modifier-link-color: var(--color-brand);--vv-text-modifier-link-state-focus-visible-outline: var(--spacing-px) solid var(--color-brand);--vv-text-modifier-link-state-focus-visible-outline-offset: var(--spacing-4);--vv-text-modifier-link-state-hover-text-decoration: underline;--vv-text-modifier-link-state-hover-text-underline-offset: var(--spacing-4);--vv-text-modifier-link-state-active-color: var(--color-brand-darken-3);--vv-text-modifier-link-state-disabled-opacity: var(--opacity-50);--vv-text-modifier-link-state-disabled-cursor: not-allowed;--vv-text-modifier-quote-font-family: var(--font-serif);--vv-text-modifier-quote-border-left: var(--spacing-4) solid var(--color-surface-3);--vv-text-modifier-quote-padding-left: var(--spacing-16);--vv-text-modifier-quote-margin-block: var(--spacing-16);--vv-text-modifier-quote-margin-inline: var(--spacing-40);--vv-text-modifier-size-1-font-size: var(--text-32);--vv-text-modifier-size-2-font-size: var(--text-24);--vv-text-modifier-size-3-font-size: var(--text-20);--vv-text-modifier-size-4-font-size: var(--text-16);--vv-text-modifier-size-5-font-size: var(--text-14);--vv-text-modifier-size-6-font-size: var(--text-12)}:where(.vv-text){font-family:var(--vv-text-font-family);font-weight:var(--vv-text-font-weight);line-height:var(--vv-text-line-height)}:where(.vv-text--headline.vv-text){--vv-text-font-weight: var(--vv-text-modifier-headline-font-weight);--vv-text-line-height: var(--vv-text-modifier-headline-line-height);letter-spacing:var(--vv-text-modifier-headline-letter-spacing);margin-top:var(--vv-text-modifier-headline-margin-top);margin-bottom:var(--vv-text-modifier-headline-margin-bottom)}:where(.vv-text--copy.vv-text){margin-block:var(--vv-text-modifier-copy-margin-block)}:where(.vv-text--link.vv-text){color:var(--vv-text-modifier-link-color)}:where(.vv-text--link.vv-text--focus-visible,.vv-text--link.vv-text.focus-visible,.vv-text--link.vv-text:not(:active):not([disabled]):not([tabindex="-1"]:not([aria-disabled=true])):focus-visible){outline:var(--vv-text-modifier-link-state-focus-visible-outline);outline-offset:var(--vv-text-modifier-link-state-focus-visible-outline-offset)}:where(.vv-text--link.vv-text--hover,.vv-text--link.vv-text.hover,.vv-text--link.vv-text:not([disabled]):hover){-webkit-text-decoration:var(--vv-text-modifier-link-state-hover-text-decoration);text-decoration:var(--vv-text-modifier-link-state-hover-text-decoration);text-underline-offset:var(--vv-text-modifier-link-state-hover-text-underline-offset)}:where(.vv-text--link.vv-text--active,.vv-text--link.vv-text.active,.vv-text--link.vv-text:not([disabled]):active){color:var(--vv-text-modifier-link-state-active-color)}:where(.vv-text--link.vv-text--disabled,.vv-text--link.vv-text.disabled,.vv-text--link.vv-text[disabled],.vv-text--link.vv-text[aria-disabled=true]){opacity:var(--vv-text-modifier-link-state-disabled-opacity);cursor:var(--vv-text-modifier-link-state-disabled-cursor)}:where(.vv-text--quote.vv-text){--vv-text-font-family: var(--vv-text-modifier-quote-font-family);border-left:var(--vv-text-modifier-quote-border-left);padding-left:var(--vv-text-modifier-quote-padding-left);margin-block:var(--vv-text-modifier-quote-margin-block);margin-inline:var(--vv-text-modifier-quote-margin-inline)}:where(.vv-text--size-1.vv-text){font-size:var(--vv-text-modifier-size-1-font-size)}:where(.vv-text--size-2.vv-text){font-size:var(--vv-text-modifier-size-2-font-size)}:where(.vv-text--size-3.vv-text){font-size:var(--vv-text-modifier-size-3-font-size)}:where(.vv-text--size-4.vv-text){font-size:var(--vv-text-modifier-size-4-font-size)}:where(.vv-text--size-5.vv-text){font-size:var(--vv-text-modifier-size-5-font-size)}:where(.vv-text--size-6.vv-text){font-size:var(--vv-text-modifier-size-6-font-size)}