@celar-ui/svelte 0.3.3 → 0.3.4
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/dist/utils.d.ts +1 -0
- package/dist/utils.js +19 -0
- package/package.json +2 -2
- package/src/styles/colors.scss +12 -12
package/dist/utils.d.ts
CHANGED
package/dist/utils.js
CHANGED
|
@@ -2,5 +2,24 @@ export function applyPreferredColorScheme(scheme) {
|
|
|
2
2
|
if (scheme === 'auto') {
|
|
3
3
|
scheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
4
4
|
}
|
|
5
|
+
const enableAnimation = disableAnimation();
|
|
5
6
|
document.documentElement.setAttribute('data-theme', scheme);
|
|
7
|
+
// color-scheme tells browser how to render built-in elements like forms, scrollbars, etc.
|
|
8
|
+
// if color-scheme is null, this will remove the property
|
|
9
|
+
document.documentElement.style.setProperty('color-scheme', scheme);
|
|
10
|
+
enableAnimation();
|
|
11
|
+
}
|
|
12
|
+
// https://github.com/beynar/svelte-themes/blob/18427800b19a7f866f26770dc5bf2c42227e14e3/src/lib/helpers.ts#L14-L32
|
|
13
|
+
export function disableAnimation() {
|
|
14
|
+
const css = document.createElement('style');
|
|
15
|
+
css.appendChild(document.createTextNode(`*{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}`));
|
|
16
|
+
document.head.appendChild(css);
|
|
17
|
+
return () => {
|
|
18
|
+
// Force restyle
|
|
19
|
+
(() => window.getComputedStyle(document.body))();
|
|
20
|
+
// Wait for next tick before removing
|
|
21
|
+
setTimeout(() => {
|
|
22
|
+
document.head.removeChild(css);
|
|
23
|
+
}, 1);
|
|
24
|
+
};
|
|
6
25
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@celar-ui/svelte",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.4",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "cuikho210",
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
|
|
19
19
|
"format": "prettier --write .",
|
|
20
20
|
"lint": "prettier --check . && eslint .",
|
|
21
|
-
"npm-publish": "bun run build && npm publish --access=public"
|
|
21
|
+
"npm-publish": "bun run build && export $(grep -v '^#' ../../.env | xargs) && npm publish --access=public"
|
|
22
22
|
},
|
|
23
23
|
"files": [
|
|
24
24
|
"dist",
|
package/src/styles/colors.scss
CHANGED
|
@@ -9,11 +9,11 @@ $colors-theme: (
|
|
|
9
9
|
color-primary--light: #ffe5dc,
|
|
10
10
|
color-primary--lighter: #fff6f3,
|
|
11
11
|
|
|
12
|
-
color-alt--text: #
|
|
13
|
-
color-alt--darker: #
|
|
14
|
-
color-alt--dark: #
|
|
15
|
-
color-alt: #
|
|
16
|
-
color-alt--light: #
|
|
12
|
+
color-alt--text: #570036,
|
|
13
|
+
color-alt--darker: #960f45,
|
|
14
|
+
color-alt--dark: #ff7fbd,
|
|
15
|
+
color-alt: #ffb3d0,
|
|
16
|
+
color-alt--light: #ffdce8,
|
|
17
17
|
color-alt--lighter: #fff3f7,
|
|
18
18
|
|
|
19
19
|
color-text: #000000,
|
|
@@ -23,7 +23,7 @@ $colors-theme: (
|
|
|
23
23
|
color-text-danger: #98000b,
|
|
24
24
|
|
|
25
25
|
color-bg: #ffffff,
|
|
26
|
-
color-bg-info: #
|
|
26
|
+
color-bg-info: #e2ffff,
|
|
27
27
|
color-bg-success: #e8fef5,
|
|
28
28
|
color-bg-warning: #fff8ec,
|
|
29
29
|
color-bg-danger: #fff4ef
|
|
@@ -39,14 +39,14 @@ $colors-theme-dark: (
|
|
|
39
39
|
color-primary--lighter: #570000,
|
|
40
40
|
|
|
41
41
|
color-alt--text: #fff3f7,
|
|
42
|
-
color-alt--darker: #
|
|
43
|
-
color-alt--dark: #
|
|
44
|
-
color-alt: #
|
|
45
|
-
color-alt--light: #
|
|
46
|
-
color-alt--lighter: #
|
|
42
|
+
color-alt--darker: #ffdce8,
|
|
43
|
+
color-alt--dark: #ffb3d0,
|
|
44
|
+
color-alt: #ff7fbd,
|
|
45
|
+
color-alt--light: #960f45,
|
|
46
|
+
color-alt--lighter: #570036,
|
|
47
47
|
|
|
48
48
|
color-text: #efefef,
|
|
49
|
-
color-text-info: #
|
|
49
|
+
color-text-info: #008eff,
|
|
50
50
|
color-text-success: #7ab8a3,
|
|
51
51
|
color-text-warning: #bfa060,
|
|
52
52
|
color-text-danger: #b36a6a,
|