Styles

The CSS for styling a component's elements is declared with a @style block. There can only be one @style block per component:

export default function Component() {
	@render {
		<p class="extravagant">Hello!</p>
	}

	@style {
		.extravagant {
			font-size: x-large;
			color: magenta;
		}
	}
}

The styles in the style block are scoped to the elements in the component so that they don't affect elements in other components.

Playground