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.