Keyword classes: a CSS value keyword as a bare class name, setting the one
property it belongs to (.flex is display: flex, .sticky is
position: sticky). The CSS spec is the namespace - a keyword earns a class
when no other mainstream property shares it, so it identifies its property
alone (flex, sticky, uppercase), while a shared keyword (center,
nowrap, none) stays a property:value literal. Hyphenated names are
the spec's own words (inline-flex, line-through), never concatenations.
Each is a single-purpose declaration ordered by its property's rank like a
token class, so md:flex and hover:underline work as any class does.
hidden is the one name the spec doesn't supply: it mirrors the HTML
attribute (display: none) and orders late within its bucket, after the
literals it ties with.
7 declarations
css_class_keywords.ts view source
Record<string, CssClassDefinitionDeclaration> type Record<string, CssClassDefinitionDeclaration>
import {css_class_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The keyword classes, plus hidden. Spread into css_class_definitions.
css_class_keywords.ts view source
readonly ["flex", "inline-flex", "grid", "inline-grid", "inline-block", "block", "flow-root"] import {display_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The display keywords with a class: the inside formatting contexts and the
legacy inline forms, plus block.
css_class_keywords.ts view source
readonly ["italic", "oblique"] import {font_style_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The font-style keywords with a class.
css_class_keywords.ts view source
readonly ["bold", "bolder", "lighter"] import {font_weight_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The font-weight keywords with a class.
css_class_keywords.ts view source
readonly ["relative", "absolute", "fixed", "sticky"] import {position_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The position keywords with a class, all but the initial static.
css_class_keywords.ts view source
readonly ["underline", "overline", "line-through"] import {text_decoration_line_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The text-decoration-line keywords with a class. They set the longhand, so an element's decoration color, style, and thickness carry through.
css_class_keywords.ts view source
readonly ["uppercase", "lowercase", "capitalize"] import {text_transform_keywords} from '@fuzdev/fuz_css/css_class_keywords.js'; The text-transform keywords with a class.