srcdev-nuxt-forms 2.1.47 → 2.2.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
CHANGED
|
@@ -40,12 +40,23 @@ defineNuxtConfig({
|
|
|
40
40
|
|
|
41
41
|
## Development Server
|
|
42
42
|
|
|
43
|
-
Start the development server on <
|
|
43
|
+
Start the development server on <https://localhost:3000>
|
|
44
44
|
|
|
45
45
|
```bash
|
|
46
46
|
npm dev
|
|
47
47
|
```
|
|
48
48
|
|
|
49
|
+
## Browser https error
|
|
50
|
+
|
|
51
|
+
If you do not get a proceed to site ssl error, then you need to reset HSTS settings in browser
|
|
52
|
+
|
|
53
|
+
- Clearing all data for the site
|
|
54
|
+
- Click on the button to the left of the address bar
|
|
55
|
+
- Site settings
|
|
56
|
+
- Delete data
|
|
57
|
+
- Go to chrome://net-internals/#hsts and enter localhost into Delete domain security policies (or whichever domain you're having trouble with)
|
|
58
|
+
- Restart your browser
|
|
59
|
+
|
|
49
60
|
## Production
|
|
50
61
|
|
|
51
62
|
Build the application for production:
|
|
@@ -4,14 +4,14 @@
|
|
|
4
4
|
--form-element-border-width: 0.2rem;
|
|
5
5
|
--form-element-outline-width: 0.1rem;
|
|
6
6
|
|
|
7
|
+
--form-text-padding-inline: 0.5em;
|
|
8
|
+
--form-button-padding-inline: 1.25em;
|
|
9
|
+
--form-button-icon-gap: 1em;
|
|
10
|
+
|
|
7
11
|
[data-size='x-small'] {
|
|
8
12
|
--form-element-font-size: var(--step-0);
|
|
9
13
|
--form-placeholder-font-size: calc(var(--step-0) * 0.65);
|
|
10
14
|
--form-element-line-height: var(--step-0);
|
|
11
|
-
--form-icon-size: var(--step-0);
|
|
12
|
-
--form-button-padding-inline: calc(var(--step-0) * 1.65);
|
|
13
|
-
--form-text-padding-inline: calc(var(--step-0) * 0.25);
|
|
14
|
-
--form-button-icon-gap: calc(var(--step-0) * 0.65);
|
|
15
15
|
--form-input-border-radius: 0.4rem;
|
|
16
16
|
--form-icon-only-button-size: calc(var(--step-1) * 2 + 1px);
|
|
17
17
|
--form-toggle-symbol-size: calc(var(--step-0) * 1.55);
|
|
@@ -24,9 +24,6 @@
|
|
|
24
24
|
--form-placeholder-font-size: calc(var(--step-1) * 0.65);
|
|
25
25
|
--form-element-line-height: var(--step-1);
|
|
26
26
|
--form-icon-size: var(--step-1);
|
|
27
|
-
--form-button-padding-inline: calc(var(--step-0) * 1.65);
|
|
28
|
-
--form-text-padding-inline: calc(var(--step-1) * 0.25);
|
|
29
|
-
--form-button-icon-gap: calc(var(--step-0) * 0.65);
|
|
30
27
|
--form-input-border-radius: 0.4rem;
|
|
31
28
|
--form-icon-only-button-size: calc(var(--step-1) * 2.25 + 1px);
|
|
32
29
|
--form-toggle-symbol-size: calc(var(--step-1) * 1.635);
|
|
@@ -39,9 +36,6 @@
|
|
|
39
36
|
--form-placeholder-font-size: calc(var(--step-2) * 0.65);
|
|
40
37
|
--form-element-line-height: var(--step-2);
|
|
41
38
|
--form-icon-size: var(--step-2);
|
|
42
|
-
--form-button-padding-inline: calc(var(--step-0) * 1.65);
|
|
43
|
-
--form-text-padding-inline: calc(var(--step-2) * 0.25);
|
|
44
|
-
--form-button-icon-gap: calc(var(--step-0) * 0.65);
|
|
45
39
|
--form-input-border-radius: 0.4rem;
|
|
46
40
|
--form-icon-only-button-size: calc(var(--step-1) * 2.5 + 1px);
|
|
47
41
|
--form-toggle-symbol-size: calc(var(--step-2) * 1.72);
|
|
@@ -54,9 +48,6 @@
|
|
|
54
48
|
--form-placeholder-font-size: calc(var(--step-3) * 0.65);
|
|
55
49
|
--form-element-line-height: var(--step-3);
|
|
56
50
|
--form-icon-size: var(--step-3);
|
|
57
|
-
--form-button-padding-inline: calc(var(--step-0) * 1.65);
|
|
58
|
-
--form-text-padding-inline: calc(var(--step-3) * 0.25);
|
|
59
|
-
--form-button-icon-gap: calc(var(--step-0) * 0.65);
|
|
60
51
|
--form-input-border-radius: 0.4rem;
|
|
61
52
|
--form-icon-only-button-size: calc(var(--step-1) * 2.75 + 1px);
|
|
62
53
|
--form-toggle-symbol-size: calc(var(--step-3) * 1.78);
|
|
@@ -69,9 +60,6 @@
|
|
|
69
60
|
--form-placeholder-font-size: calc(var(--step-4) * 0.65);
|
|
70
61
|
--form-element-line-height: var(--step-4);
|
|
71
62
|
--form-icon-size: var(--step-4);
|
|
72
|
-
--form-button-padding-inline: calc(var(--step-0) * 1.75);
|
|
73
|
-
--form-text-padding-inline: calc(var(--step-4) * 0.25);
|
|
74
|
-
--form-button-icon-gap: calc(var(--step-0) * 0.75);
|
|
75
63
|
--form-input-border-radius: 0.4rem;
|
|
76
64
|
--form-icon-only-button-size: calc(var(--step-1) * 3 + 1px);
|
|
77
65
|
--form-toggle-symbol-size: calc(var(--step-4) * 1.816);
|
|
@@ -165,7 +165,6 @@ onMounted(() => {
|
|
|
165
165
|
&:not(:has(.input-button-core)) {
|
|
166
166
|
.slot {
|
|
167
167
|
display: inline-block;
|
|
168
|
-
padding-inline: 0.8rem;
|
|
169
168
|
|
|
170
169
|
.icon {
|
|
171
170
|
color: var(--theme-form-input-text);
|
|
@@ -178,17 +177,11 @@ onMounted(() => {
|
|
|
178
177
|
}
|
|
179
178
|
}
|
|
180
179
|
|
|
181
|
-
/* &:has(.input-button-core) {
|
|
182
|
-
.input-button-core {
|
|
183
|
-
margin-inline: 0.6rem;
|
|
184
|
-
}
|
|
185
|
-
} */
|
|
186
|
-
|
|
187
180
|
&.has-left-slot {
|
|
188
181
|
.left-slot {
|
|
189
182
|
display: flex;
|
|
190
183
|
align-items: center;
|
|
191
|
-
margin-inline:
|
|
184
|
+
margin-inline-start: 1rem;
|
|
192
185
|
}
|
|
193
186
|
}
|
|
194
187
|
|
|
@@ -196,19 +189,13 @@ onMounted(() => {
|
|
|
196
189
|
.right-slot {
|
|
197
190
|
display: flex;
|
|
198
191
|
align-items: center;
|
|
199
|
-
margin-inline:
|
|
192
|
+
margin-inline-end: 1rem;
|
|
200
193
|
}
|
|
201
194
|
}
|
|
202
195
|
|
|
203
|
-
&:not(.has-left-slot) {
|
|
204
|
-
padding-inline-start: var(--form-text-padding-inline);
|
|
205
|
-
}
|
|
206
|
-
|
|
207
196
|
&:focus-within {
|
|
208
197
|
box-shadow: var(--box-shadow-on);
|
|
209
|
-
/* --_theme-form-input-outline-focus: hsl(from var(--_theme-form-input-outline-focus) h s 50%); */
|
|
210
198
|
outline: var(--form-element-outline-width) solid hsl(from var(--theme-form-input-outline-focus) h s 90%);
|
|
211
|
-
/* outline: var(--form-element-outline-width) solid white; */
|
|
212
199
|
}
|
|
213
200
|
|
|
214
201
|
.input-text-core {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="toggle-switch-core" :class="elementClasses" :data-size="size" :data-form-theme="formTheme">
|
|
3
3
|
<div @click="toggleSwitchValue" class="toggle-switch-input" :class="[{ round }]" :for="inputId">
|
|
4
|
-
<input type="checkbox" v-model="modelValue" :true-value :false-value :id="inputId" :aria-describedby="`${id}-description`" :name :required />
|
|
4
|
+
<input type="checkbox" v-model="modelValue" :true-value :false-value :aria-invalid="fieldHasError" :id="inputId" :aria-describedby="`${id}-description`" :name :required />
|
|
5
5
|
<div class="symbol-wrapper" :class="[{ round }]">
|
|
6
6
|
<div class="symbol" :class="[{ round }]">
|
|
7
7
|
<div v-if="hasIconOnSlot" class="symbol-icon icon-on">
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "srcdev-nuxt-forms",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "2.1
|
|
4
|
+
"version": "2.2.1",
|
|
5
5
|
"main": "nuxt.config.ts",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"clean": "rm -rf .nuxt && rm -rf .output && rm -rf .playground/.nuxt && rm -rf .playground/.output",
|
|
@@ -25,15 +25,15 @@
|
|
|
25
25
|
"types/"
|
|
26
26
|
],
|
|
27
27
|
"devDependencies": {
|
|
28
|
-
"@nuxt/eslint-config": "0.7.
|
|
29
|
-
"@nuxt/icon": "1.10.
|
|
28
|
+
"@nuxt/eslint-config": "0.7.5",
|
|
29
|
+
"@nuxt/icon": "1.10.3",
|
|
30
30
|
"@nuxt/test-utils": "3.15.1",
|
|
31
31
|
"@vue/test-utils": "2.4.6",
|
|
32
|
-
"eslint": "9.
|
|
32
|
+
"eslint": "9.18.0",
|
|
33
33
|
"happy-dom": "15.11.7",
|
|
34
|
-
"nuxt": "3.
|
|
35
|
-
"release-it": "
|
|
36
|
-
"typescript": "5.7.
|
|
34
|
+
"nuxt": "3.15.0",
|
|
35
|
+
"release-it": "18.1.1",
|
|
36
|
+
"typescript": "5.7.3",
|
|
37
37
|
"vitest": "2.1.8",
|
|
38
38
|
"vue": "3.5.13"
|
|
39
39
|
},
|