With DinamiCSS you can manage CSS style sheets dynamically
DinamiCSS is available as an npm package.
// with npm
npm i @dynamicss/dynamicss- Insert style sheets from javascript files.
- Edit stylesheets at run-time.
- Remove style sheet.
- Check whether a style sheet has already been inserted into the DOM
- Create a DynamicSheet object rpresentation
Here is a quick example to get you started, it's all you need:
Interactive and live demo:
| Name | Description | Attributes |
|---|---|---|
DynamicSheet |
Object that represents a css style sheet | id: string; |
content?: string; |
||
sheetRules?: DynamicSheetRule[]; |
||
DynamicSheetRule |
Object that represents a set of css rules for a classname | className: string; |
rules: DynamicStyle | DynamicPseudoNested | DynamicHyphens; |
| Function | Description |
|---|---|
function insertStyleSheet(dynamicSheet: DynamicSheet): string |
Inserts the stylesheet into the DOM |
function editStyleSheet(id: string, sheetRules: DynamicSheetRule[]): string |
Edits an existing stylesheet in the DOM |
function removeStyleSheet(id: string): string |
Removes an existing stylesheet in the DOM |
function existStyleSheet(id: string): boolean |
Returns true if a match is found with the given id |
function makeStyleSheet(styleSheet: DynamicSheet): DynamicSheet |
Returns the same DynamicSheet object (probably useless, but helps in JS) |
This project is licensed under the terms of the MIT license.
