Stílusok
Tailwind-fordítás, inheritTheme, themeSettings, useTheme és izolációs korlátok natív nyilvános appokhoz.
A CSS-t helyileg fordítsd le a @poltura/cli/ui-styles csomagban található compileUiStyles függvénnyel. A registry soha nem futtatja a Tailwindet. A hosztolt iframe-oldalak a @poltura/app-ui/dom csomagot és a --poltura-* változókat használják e folyamat helyett.
@theme {
--color-offer-highlight: #fef3c7;
}
@utility offer-panel {
border-width: 1px;
}A compileUiStyles({ input, candidates?, minify? }) a következőket adja vissza: css, UTF-8 bytes, SRI digest, byteLength, mediaType: 'text/css'. Az üres kimenet és a 262144 bájtos stylesheet limitet meghaladó kimenet hibát eredményez. Használj teljes class name-eket a forrásban. Adj meg candidates értéket, ha a pásztázás nem lát egy adott class-t.
A CLI beállítja a stylesheet.inheritTheme értékét a workers[].inheritTheme alapján (alapértelmezetten true), és egyetlen styles/app.css fájlt ír, ha a workerek közös forrást használnak. Az inheritTheme: true beemeli a hoszt színeit, betűtípusait, lekerekítéseit, árnyékait és térközeit a stylesheetbe. A theme.css importálása önmagában nem kapcsolja be az öröklést.
A stylesheet.themeSettings opcionális: legfeljebb 16 egyedi kulcsot tartalmazhat. Egy kulcs legfeljebb 64 karakteres lehet, és kisbetűs snake_case szegmensekből állhat, amelyeket opcionálisan pontok kötnek össze. Az értékek típusa string | number | boolean; a string értékek legfeljebb 2000 karakteresek. A teljes megjelenést leíró JSON legfeljebb 8192 bájt lehet.
A useTheme() egy opcionális UiAppearance objektumot ad vissza: version (jelenleg 1), mode (light | dark), szemantikus tokens, opcionális theme: { handle, version? }, opcionális deklarált settings. A hiányzó kulcsok kimaradnak. Az adminfelületi hosztoknak nem kell átadniuk a webáruház témabeállításait.
A primitive-eken megadott className legfeljebb 2048 karakter lehet, control character-ek nélkül. A reszponzív változatok a látható mount viewportot veszik alapul. A dark: a hoszt módját követi. Az app CSS-e nem használhat url(...) hivatkozást betűtípushoz, sem távoli @import szabályt. A rendszer letiltja a lefordított CSS-ben lévő távoli resource-okat és scripteket. A CSS, az öröklés vagy a deklarált témabeállítások módosításához új, felülvizsgált release szükséges.
A theme.css fájlból származó aliasok bekapcsolt öröklés esetén: bg-background, text-foreground, bg-surface, bg-primary, text-on-primary, border-border, font-body, font-display, rounded-theme, shadow-theme-card, gap-theme-4. A szabványos Tailwind-skálák megmaradnak. A breakpointok a Tailwind saját breakpointjai, nem a kereskedő breakpointjai.