Styling model

Five more short essays, part 1 of 5.

Svelte's compiler gives every component its own scoped stylesheet: a

<style>

block in a

.svelte

file is rewritten with a generated attribute selector so its rules can't leak into another component.

reference/svelte-v2.16.1/test/css

is full of fixtures pinning down exactly how that rewriting behaves.

ARKlight has no per-component stylesheet to scope in the first place, because an

@component

compiles away rather than surviving into the output -- by the time a build finishes there's no component boundary left for a selector to leak across. Site-wide styling instead goes through

Site.style(...)

Site.style_selector(...)

, plus the built-in

.stack

.cluster

.switcher

.grid

.sidebar

utility classes from

styling and layout

This site's own

theme.py

is the concrete example: one Material You palette applied with

site.style_selector(...)

calls, not a stylesheet attached to any one page or component.

What this trades away

No per-component CSS-Modules-style isolation -- a class name collision is a real possibility the utility classes and style_selector specificity have to avoid by convention, not by a compiler-generated attribute.
No component-local <style> block at all: @component props configure markup and behavior, never styling rules of their own.
Anything keyed to viewport size still has to go through the gated css-media-queries experimental feature, the same as everywhere else in ARKlight -- see experimental APIs.

The payoff: one generated stylesheet per build, with no risk of a scoping attribute mismatch between a server-rendered and a hydrated tree -- the same absence of a hydration step covered in

rendering model

Preprocessing

No pipeline stage for a second authoring language, because the entry file is already plain Python.

Open

Sourcemaps and debugging

Nothing transformed to map back to, so --debug prints a real Python traceback instead.

Open

Custom elements

No compile target for exporting a component as a reusable element outside its own build.

Open

Build tooling

One CLI invocation instead of a bundler configuration, with sbom.txt standing in for build stats.

Open