@semanticus/semanticus-css 0.3.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -14
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
# Semanticus CSS
|
|
2
2
|
|
|
3
|
-
[](https://www.npmjs.com/package/@semanticus/semanticus-css)
|
|
4
|
+
[](LICENSE)
|
|
5
|
+
[](https://bundlephobia.com/package/@semanticus/semanticus-css)
|
|
6
6
|
|
|
7
7
|
**Semanticus** is a lightweight CSS framework that prioritizes semantic HTML and ARIA-focused accessibility, with a small set of atomic utilities.
|
|
8
8
|
|
|
@@ -23,16 +23,16 @@ Enable authors to write clean, semantic HTML that looks great by default, guide
|
|
|
23
23
|
### Option 1: CDN (quick start)
|
|
24
24
|
|
|
25
25
|
```html
|
|
26
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@
|
|
26
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@semanticus/semanticus-css@0.2.1/dist/semanticus.css">
|
|
27
27
|
|
|
28
28
|
<!-- costumize it with a palette or size variation if needed -->
|
|
29
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@
|
|
30
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@
|
|
29
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@semanticus/semanticus-css@0.2.1/dist/semanticus.palette.blue.css">
|
|
30
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@semanticus/semanticus-css@0.2.1/dist/semanticus.size.slim.css">
|
|
31
31
|
```
|
|
32
32
|
|
|
33
33
|
### Option 2: Install manually
|
|
34
34
|
|
|
35
|
-
Download the [distribution files](https://registry.npmjs.org/@
|
|
35
|
+
Download the [distribution files](https://registry.npmjs.org/@semanticus%2Fsemanticus-css/-/semanticus-css-0.2.1.tgz), move the ones you need to your **stylesheets** folder and include them in your HTML `<head>`:
|
|
36
36
|
|
|
37
37
|
```html
|
|
38
38
|
<link rel="stylesheet" href="/css/semanticus.css">
|
|
@@ -45,20 +45,20 @@ Download the [distribution files](https://registry.npmjs.org/@goncalvesjoao%2Fse
|
|
|
45
45
|
### Option 3: NPM
|
|
46
46
|
|
|
47
47
|
```bash
|
|
48
|
-
npm install semanticus-css
|
|
48
|
+
npm install @semanticus/semanticus-css
|
|
49
49
|
```
|
|
50
50
|
|
|
51
51
|
```js
|
|
52
|
-
import 'semanticus-css';
|
|
52
|
+
import '@semanticus/semanticus-css';
|
|
53
53
|
|
|
54
54
|
// Or import individual modules
|
|
55
|
-
import 'semanticus-css/semantics';
|
|
56
|
-
import 'semanticus-css/variants';
|
|
57
|
-
import 'semanticus-css/utilities';
|
|
55
|
+
import '@semanticus/semanticus-css/semantics';
|
|
56
|
+
import '@semanticus/semanticus-css/variants';
|
|
57
|
+
import '@semanticus/semanticus-css/utilities';
|
|
58
58
|
|
|
59
59
|
// Or add a palette / size on top
|
|
60
|
-
import 'semanticus-css/palettes/blue';
|
|
61
|
-
import 'semanticus-css/sizes/slim';
|
|
60
|
+
import '@semanticus/semanticus-css/palettes/blue';
|
|
61
|
+
import '@semanticus/semanticus-css/sizes/slim';
|
|
62
62
|
```
|
|
63
63
|
|
|
64
64
|
> **Note:** The `import` syntax requires a bundler that supports CSS imports (e.g., Vite, Webpack, Rollup, or Parcel).
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semanticus/semanticus-css",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"description": "lightweight CSS framework that prioritizes semantic HTML and ARIA-focused accessibility, with a small set of atomic utilities",
|
|
5
5
|
"author": "Joao Goncalves",
|
|
6
6
|
"style": "./dist/semanticus.css",
|