/news-site-css

Primary LanguageHTML

news-site-css

NPM version

How to use

This package allows you to use the stylesheets in various ways, either by including the complete rules (index.css, index.min.css) in a link tag, or by importing partial css / css module files in your code.

install the package

npm install news-site-css

including the styles in html with a link tag

<link href="news-site-css/dist/index.min.css" rel="stylesheet" />

importing the styles in JavaScript:

import "news-site-css/dist/global.css";

importing a css module in React:

import styles from "news-site-css/dist/footer.module.css";

export default function Footer() {
    return <footer className={styles.footer}></footer>;
}

constructable stylesheets:

import sheet from "news-site-css/dist/footer.constructable.js";

document.adoptedStyleSheets = [...document.adoptedStyleSheets, sheet];

constructable stylesheets in shadow DOM:

import sheet from "news-site-css/dist/footer.constructable.js";

const node = document.createElement('div');
const shadow = node.attachShadow({ mode: 'open' });
shadow.adoptedStyleSheets = [sheet];