Skip to content

shgysk8zer0/jss

Repository files navigation

@shgysk8zer0/jss

Simple JavaScript StyleSheets & Palettes

CodeQL Node CI Lint Code Base

GitHub license GitHub last commit GitHub release GitHub Sponsors

npm node-current npm bundle size gzipped npm

GitHub followers GitHub forks GitHub stars Twitter Follow

Donate using Liberapay



Best when used with @shgysk8zer0/jswaggersheets.

Example

import { createSheet } from '@shgysk8zer0/jswaggersheets/swagger.js';
import * as bootstrap from '@shgysk8zer0/jss/palette/bootstrap.js';
import { systemFonts } from '@shgysk8zer0/jss/system-fonts.js';
import { gnomeStyles } from '@shgysk8zer0/jss/gnome.js';
import { utility } from '@shgysk8zer0/jss/utility.js';
import { base } from '@shgysk8zer0/jss/base.js';

Promise.all([
	createSheet(base),
	createSheet(systemFonts),
	createSheet(gnomeStyles),
	createSheet(utility),
]).then(sheets => document.adoptedStyleSheets = sheets);

/* Maps to `--bs-red-200` */
document.querySelector('.nav').style.setProperty('background-color', bootstrap.red[1]);