santycss 1.6.0 → 1.7.0
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 +57 -1
- package/dist/santy-core.css +1 -1
- package/dist/santy.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
[](https://www.npmjs.com/package/santycss)
|
|
4
4
|
[](https://www.npmjs.com/package/santycss)
|
|
5
5
|
[](https://github.com/ChintuSanty/santyCSS/blob/main/LICENSE)
|
|
6
|
-
[](https://www.npmjs.com/package/santycss)
|
|
7
7
|
|
|
8
8
|
**Plain-English utility-first CSS framework.**
|
|
9
9
|
Class names read like sentences. No build step. No configuration. Just link and use.
|
|
@@ -20,6 +20,62 @@ Class names read like sentences. No build step. No configuration. Just link and
|
|
|
20
20
|
|
|
21
21
|
---
|
|
22
22
|
|
|
23
|
+
## What's New in v1.7
|
|
24
|
+
|
|
25
|
+
### ♿ Accessibility Utilities
|
|
26
|
+
|
|
27
|
+
| Class | What it does |
|
|
28
|
+
|---|---|
|
|
29
|
+
| `.skip-to-content` | Skip-nav link — visible on focus, hidden otherwise |
|
|
30
|
+
| `.focus-trap` | Container for modal/drawer focus trapping |
|
|
31
|
+
| `.aria-live-polite` / `.aria-live-assertive` | Visually hidden ARIA live regions |
|
|
32
|
+
| `.screen-reader-only` | Visually hide but keep accessible |
|
|
33
|
+
| `.focus-ring` / `.focus-ring-white` | Consistent focus outline utilities |
|
|
34
|
+
| `.focus-visible-ring` | Focus ring only on keyboard navigation |
|
|
35
|
+
| `.motion-safe-animate` | Disables animation when OS reduces motion |
|
|
36
|
+
| `.high-contrast-border/bg/outline` | `forced-colors` media query support |
|
|
37
|
+
|
|
38
|
+
### 🌐 Internationalisation (i18n)
|
|
39
|
+
|
|
40
|
+
| Class | What it does |
|
|
41
|
+
|---|---|
|
|
42
|
+
| `.add-padding-block-{n}` / `.add-padding-inline-{n}` | Logical padding (direction-aware) |
|
|
43
|
+
| `.add-margin-block-{n}` / `.add-margin-inline-{n}` | Logical margin |
|
|
44
|
+
| `.pin-block-start-0` / `.pin-inline-start-0` | Logical positioning |
|
|
45
|
+
| `.border-block-start` / `.border-inline-start` | Logical borders |
|
|
46
|
+
| `.make-text-vertical` | `writing-mode: vertical-rl` — for CJK/Japanese |
|
|
47
|
+
| `.make-text-vertical-up` | `writing-mode: vertical-lr` |
|
|
48
|
+
| `.text-orientation-mixed` / `.text-orientation-upright` | Text orientation control |
|
|
49
|
+
| `.text-direction-ltr` / `.text-direction-rtl` | Explicit `direction` control |
|
|
50
|
+
|
|
51
|
+
### 📱 Mobile-First Components
|
|
52
|
+
|
|
53
|
+
| Class | What it does |
|
|
54
|
+
|---|---|
|
|
55
|
+
| `.bottom-sheet` + `.open` | Slide-up panel from bottom (with safe-area support) |
|
|
56
|
+
| `.bottom-sheet-handle` / `.bottom-sheet-body` / `.bottom-sheet-footer` | Bottom sheet parts |
|
|
57
|
+
| `.bottom-sheet-overlay` + `.visible` | Semi-transparent backdrop |
|
|
58
|
+
| `.swipe-carousel` + `.swipe-carousel-item` | Touch-friendly horizontal scroll carousel |
|
|
59
|
+
| `.swipe-carousel-full` / `.peek` / `.multi` | Carousel layout variants |
|
|
60
|
+
| `.swipe-carousel-dot` + `.active` | Progress dots |
|
|
61
|
+
| `.pull-to-refresh` + `.pulling` / `.refreshing` | Pull-to-refresh indicator |
|
|
62
|
+
| `.padding-safe-top/bottom/left/right/all` | `env(safe-area-inset-*)` padding |
|
|
63
|
+
|
|
64
|
+
### 🗓 New Components
|
|
65
|
+
|
|
66
|
+
| Class | What it does |
|
|
67
|
+
|---|---|
|
|
68
|
+
| `.command-palette-wrap` + `.open` | VS Code-style Ctrl+K command palette overlay |
|
|
69
|
+
| `.command-palette-input` / `.command-palette-item` | Command palette parts |
|
|
70
|
+
| `.date-picker` / `.date-picker-grid` / `.date-picker-day` | Full calendar date picker |
|
|
71
|
+
| `.date-picker-day.today` / `.selected` / `.in-range` | Day state modifiers |
|
|
72
|
+
|
|
73
|
+
### 🎨 Figma Plugin _(coming soon)_
|
|
74
|
+
|
|
75
|
+
A **SantyCSS Figma Plugin** is in development — inspect Figma designs and get the exact SantyCSS classes that match. Inspired by the Tailwind CSS Figma plugin workflow.
|
|
76
|
+
|
|
77
|
+
---
|
|
78
|
+
|
|
23
79
|
## What's New in v1.4
|
|
24
80
|
|
|
25
81
|
### 🧩 VS Code IntelliSense Extension
|
package/dist/santy-core.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* ============================================================
|
|
2
|
-
SantyCSS v1.
|
|
2
|
+
SantyCSS v1.7.0 — Plain-English Utility CSS Framework
|
|
3
3
|
https://github.com/santybad/santy_css
|
|
4
4
|
============================================================ */
|
|
5
5
|
|
package/dist/santy.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* ============================================================
|
|
2
|
-
SantyCSS v1.
|
|
2
|
+
SantyCSS v1.7.0 — Plain-English Utility CSS Framework
|
|
3
3
|
https://github.com/santybad/santy_css
|
|
4
4
|
============================================================ */
|
|
5
5
|
|