Styles #

Styles are one of the most important parts of a component. You can define the styles of a component in two ways.

import styles from "./app.css";
@JwcComponent({ name: "app-element", css: styles })
export class App extends JwcComponent {
  /* ... */
}

// no yet implemented

Class Based #

The css property of the @JwcComponent decorator is used to define the CSS of the component. The CSS is applied to the shadow DOM of the component.

@JwcComponent({ name: "app-element", css: styles })

The styles variable is a string that contains the CSS. You can use any CSS preprocessor you want. The CSS is automatically compiled to CSS.

import styles from "./app.css";

// In Vite
import styles from "./app.css?inline";

Function Based Not yet implemented #

Not yet implemented