landsoul
v0.3.0
Published
drop in css library landsoul
Downloads
127
Readme
landsoul
A classless CSS library (IE11 is not supported).
i.e. Style applied to HTML tags directly.
Preview: https://yieldray.github.io/landsoul/
Usage
To enable dark mode, use body[data-theme="dark"]
<link rel="stylesheet" href="https://unpkg.com/landsoul" />
<!-- add this to enable dark mode manually -->
<body data-theme="dark"></body>Or if you target to Chrome>=123, you can use color-scheme
:root {
color-scheme: dark;
}Use with CSS @layer, this allows landsoul styles to be easily overridden.
/* remember that the @import at-rule must precede all other types of rules, except @charset and @layer rules. */
@layer landsoul, my-layer;
@import url(//unpkg.com/landsoul) layer(landsoul);
/* your style here... */This stylesheet DO NOT include css reset, and keep minimum influence to the built-in html elements,
so you may add some extra css to make things work.
/* For example: */
body {
box-sizing: border-box;
max-width: 38rem;
margin: 0 auto;
padding: 1rem;
}
img {
display: inline-block;
max-width: 100%;
}dev
Use Node.js LTS version.
$ npm install
$ npm run devbuild
$ npm run build