ADWaveCSS

Adwaita/GTK inspired CSS for the web.

See examples here.

Web components can be found in a separate package: https://github.com/ncpa0/ADWaveUI

Usage

CSS styles are located in the dist/styles.css file. If used with esbuild or webpack and css loader or something similar it can be imported like this from a JavaScript file:

import"adwavecss/dist/styles.css";

Components

See docs for all components here.

JavaScript class name bindings

importADWavefrom"adwavecss";// Primary buttonconstbutton=document.createElement("button");button.classList.add(ADWave.Button.button);button.classList.add(ADWave.Button.primary);// SwitchconstswitchElem=document.createElement("div");constknob=document.createElement("div");switchElem.classList.add(ADWave.Switch.switch);knob.classList.add(ADWave.Switch.knob);switchElem.appendChild(knob);consttoggleSwitch=()=>{switchElem.classList.toggle(ADWave.Switch.active);};