rizzo-css 0.0.47 → 0.0.48
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 +1 -1
- package/package.json +2 -1
- package/scaffold/shared/click.mp3 +0 -0
- package/scaffold/shared/sound-effects-inline.js +106 -0
- package/scaffold/vanilla/README-RIZZO.md +1 -1
- package/scaffold/vanilla/components/accordion.html +6 -0
- package/scaffold/vanilla/components/alert.html +6 -0
- package/scaffold/vanilla/components/avatar.html +6 -0
- package/scaffold/vanilla/components/badge.html +6 -0
- package/scaffold/vanilla/components/breadcrumb.html +6 -0
- package/scaffold/vanilla/components/button.html +6 -0
- package/scaffold/vanilla/components/cards.html +6 -0
- package/scaffold/vanilla/components/copy-to-clipboard.html +6 -0
- package/scaffold/vanilla/components/divider.html +6 -0
- package/scaffold/vanilla/components/docs-sidebar.html +6 -0
- package/scaffold/vanilla/components/dropdown.html +6 -0
- package/scaffold/vanilla/components/font-switcher.html +6 -0
- package/scaffold/vanilla/components/footer.html +6 -0
- package/scaffold/vanilla/components/forms.html +6 -0
- package/scaffold/vanilla/components/icons.html +6 -0
- package/scaffold/vanilla/components/index.html +6 -0
- package/scaffold/vanilla/components/modal.html +6 -0
- package/scaffold/vanilla/components/navbar.html +6 -0
- package/scaffold/vanilla/components/pagination.html +6 -0
- package/scaffold/vanilla/components/progress-bar.html +6 -0
- package/scaffold/vanilla/components/search.html +6 -0
- package/scaffold/vanilla/components/settings.html +6 -0
- package/scaffold/vanilla/components/sound-effects.html +6 -0
- package/scaffold/vanilla/components/spinner.html +6 -0
- package/scaffold/vanilla/components/table.html +6 -0
- package/scaffold/vanilla/components/tabs.html +6 -0
- package/scaffold/vanilla/components/theme-switcher.html +6 -0
- package/scaffold/vanilla/components/toast.html +6 -0
- package/scaffold/vanilla/components/tooltip.html +6 -0
- package/scaffold/vanilla/index.html +6 -0
package/README.md
CHANGED
|
@@ -63,7 +63,7 @@ import 'rizzo-css';
|
|
|
63
63
|
**Without a bundler (plain HTML):** Use a CDN. Both unpkg and jsDelivr resolve the package root to the built CSS (via the `unpkg` / `jsdelivr` fields in this package). For reliability or to pin a version, use the explicit path:
|
|
64
64
|
|
|
65
65
|
```html
|
|
66
|
-
<!-- unpkg (pin version: replace @latest with @0.0.
|
|
66
|
+
<!-- unpkg (pin version: replace @latest with @0.0.48 or any version) -->
|
|
67
67
|
<link rel="stylesheet" href="https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css" />
|
|
68
68
|
|
|
69
69
|
<!-- or jsDelivr -->
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "rizzo-css",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.48",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"prepublishOnly": "cd ../.. && pnpm run lint:css:fix && pnpm run build:css && node scripts/copy-scaffold.js && node scripts/prepare-vanilla-scaffold.js"
|
|
6
6
|
},
|
|
@@ -28,6 +28,7 @@
|
|
|
28
28
|
"scaffold/astro",
|
|
29
29
|
"scaffold/astro-core",
|
|
30
30
|
"scaffold/config",
|
|
31
|
+
"scaffold/shared",
|
|
31
32
|
"scaffold/svelte",
|
|
32
33
|
"scaffold/svelte-core",
|
|
33
34
|
"scaffold/utils",
|
|
Binary file
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
// Sound effects: play on click/tap when user has enabled (localStorage soundEffects === 'true'). Uses /assets/sfx/click.mp3, else Web Audio fallback. Same script for docs and all shipped scaffolds. Supports touch (touchend) so mobile plays like desktop.
|
|
2
|
+
(function() {
|
|
3
|
+
var SOUND_KEY = 'soundEffects';
|
|
4
|
+
var THROTTLE_MS = 120;
|
|
5
|
+
var clickableSelector = 'a[href], area[href], button, input[type="submit"], input[type="button"], input[type="checkbox"], input[type="radio"], input[type="reset"], select, summary, [role="button"], [role="link"], [role="menuitem"], [role="menuitemradio"], [role="tab"], [role="option"], [role="switch"], .btn, .tabs__tab, .dropdown__trigger, .accordion__trigger, [data-accordion-trigger], .navbar__link, .navbar__brand-link, .pagination__link, .breadcrumb__link, .search__trigger, .theme-switcher__option, .font-switcher__option, .framework-switcher__segment, .modal__close, .alert__close, .copy-btn, [data-copy-btn]';
|
|
6
|
+
var audioContext = null;
|
|
7
|
+
var soundBase = '/assets/sfx';
|
|
8
|
+
var soundUrls = [soundBase + '/click.mp3'];
|
|
9
|
+
var cachedAudio = null;
|
|
10
|
+
var soundLoadTried = false;
|
|
11
|
+
var lastPlayedAt = 0;
|
|
12
|
+
var lastTouchSoundTarget = null;
|
|
13
|
+
var lastTouchSoundTime = 0;
|
|
14
|
+
function getContext() {
|
|
15
|
+
if (!audioContext && typeof window.AudioContext !== 'undefined') {
|
|
16
|
+
audioContext = new window.AudioContext();
|
|
17
|
+
}
|
|
18
|
+
return audioContext;
|
|
19
|
+
}
|
|
20
|
+
function playFallbackTone() {
|
|
21
|
+
try {
|
|
22
|
+
var ctx = getContext();
|
|
23
|
+
if (!ctx) return;
|
|
24
|
+
ctx.resume().then(function() {
|
|
25
|
+
var now = ctx.currentTime;
|
|
26
|
+
var osc = ctx.createOscillator();
|
|
27
|
+
var gain = ctx.createGain();
|
|
28
|
+
osc.connect(gain);
|
|
29
|
+
gain.connect(ctx.destination);
|
|
30
|
+
osc.frequency.setValueAtTime(800, now);
|
|
31
|
+
osc.frequency.exponentialRampToValueAtTime(200, now + 0.04);
|
|
32
|
+
osc.type = 'sine';
|
|
33
|
+
gain.gain.setValueAtTime(0.08, now);
|
|
34
|
+
gain.gain.exponentialRampToValueAtTime(0.001, now + 0.04);
|
|
35
|
+
osc.start(now);
|
|
36
|
+
osc.stop(now + 0.04);
|
|
37
|
+
}).catch(function() {});
|
|
38
|
+
} catch (e) {}
|
|
39
|
+
}
|
|
40
|
+
function tryLoadAssetSound() {
|
|
41
|
+
if (soundLoadTried || cachedAudio) return;
|
|
42
|
+
soundLoadTried = true;
|
|
43
|
+
var idx = 0;
|
|
44
|
+
function tryNext() {
|
|
45
|
+
if (idx >= soundUrls.length) return;
|
|
46
|
+
var a = new window.Audio(soundUrls[idx]);
|
|
47
|
+
a.volume = 0.4;
|
|
48
|
+
a.addEventListener('canplaythrough', function() { cachedAudio = a; }, { once: true });
|
|
49
|
+
a.addEventListener('error', function() { idx++; tryNext(); }, { once: true });
|
|
50
|
+
a.load();
|
|
51
|
+
}
|
|
52
|
+
tryNext();
|
|
53
|
+
}
|
|
54
|
+
function playClickSound() {
|
|
55
|
+
try {
|
|
56
|
+
if (localStorage.getItem(SOUND_KEY) !== 'true') return;
|
|
57
|
+
var now = Date.now();
|
|
58
|
+
if (now - lastPlayedAt < THROTTLE_MS) return;
|
|
59
|
+
lastPlayedAt = now;
|
|
60
|
+
tryLoadAssetSound();
|
|
61
|
+
if (cachedAudio) {
|
|
62
|
+
try {
|
|
63
|
+
cachedAudio.currentTime = 0;
|
|
64
|
+
cachedAudio.volume = 0.4;
|
|
65
|
+
cachedAudio.play().catch(function() {});
|
|
66
|
+
} catch (e) {}
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
playFallbackTone();
|
|
70
|
+
} catch (e) {}
|
|
71
|
+
}
|
|
72
|
+
function getClickable(el) {
|
|
73
|
+
if (!el || !el.closest) return null;
|
|
74
|
+
var clickable = el.closest(clickableSelector);
|
|
75
|
+
if (!clickable) return null;
|
|
76
|
+
if (clickable.disabled === true || clickable.getAttribute('aria-disabled') === 'true') return null;
|
|
77
|
+
return clickable;
|
|
78
|
+
}
|
|
79
|
+
function onDocumentClick(e) {
|
|
80
|
+
if (e.button !== 0) return;
|
|
81
|
+
var clickable = getClickable(e.target);
|
|
82
|
+
if (!clickable) return;
|
|
83
|
+
if (lastTouchSoundTarget === clickable && (Date.now() - lastTouchSoundTime) < 400) return;
|
|
84
|
+
playClickSound();
|
|
85
|
+
}
|
|
86
|
+
function onDocumentTouchend(e) {
|
|
87
|
+
var clickable = getClickable(e.target);
|
|
88
|
+
if (!clickable) return;
|
|
89
|
+
lastTouchSoundTarget = clickable;
|
|
90
|
+
lastTouchSoundTime = Date.now();
|
|
91
|
+
playClickSound();
|
|
92
|
+
setTimeout(function() { lastTouchSoundTarget = null; }, 450);
|
|
93
|
+
}
|
|
94
|
+
function initSound() {
|
|
95
|
+
document.addEventListener('click', onDocumentClick, true);
|
|
96
|
+
if ('ontouchstart' in window || (navigator && navigator.maxTouchPoints > 0)) {
|
|
97
|
+
document.addEventListener('touchend', onDocumentTouchend, true);
|
|
98
|
+
}
|
|
99
|
+
if (localStorage.getItem(SOUND_KEY) === 'true') tryLoadAssetSound();
|
|
100
|
+
}
|
|
101
|
+
if (document.readyState === 'loading') {
|
|
102
|
+
document.addEventListener('DOMContentLoaded', initSound);
|
|
103
|
+
} else {
|
|
104
|
+
initSound();
|
|
105
|
+
}
|
|
106
|
+
})();
|
|
@@ -27,7 +27,7 @@ If you prefer to load CSS from a CDN instead of the local file, replace the `<li
|
|
|
27
27
|
- `<link rel="stylesheet" href="https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css" />`
|
|
28
28
|
- Or jsDelivr: `https://cdn.jsdelivr.net/npm/rizzo-css@latest/dist/rizzo.min.css`
|
|
29
29
|
|
|
30
|
-
(Replace `@latest` with a specific version, e.g. `@0.0.
|
|
30
|
+
(Replace `@latest` with a specific version, e.g. `@0.0.48`, in production.)
|
|
31
31
|
|
|
32
32
|
The CLI replaces placeholders in `index.html` (e.g. `{{DATA_THEME}}`, `{{TITLE}}`) when you run `rizzo-css init`. The theme selected during init is used on first load when you have no saved preference in the browser.
|
|
33
33
|
|