srcdev-nuxt-forms 2.4.13 → 2.4.15
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="input-text-with-label" :data-form-theme="formTheme" :class="[elementClasses, { dirty: isDirty }, { active: isActive }]">
|
|
2
|
+
<div class="input-text-with-label" :data-form-theme="formTheme" :class="[inputVariant, elementClasses, { dirty: isDirty }, { active: isActive }]">
|
|
3
3
|
<label :for="id" class="input-text-label body-normal-bold">{{ label }}</label>
|
|
4
4
|
|
|
5
5
|
<div v-if="hasDescriptionSlot" :id="`${id}-description`">
|
|
@@ -173,8 +173,9 @@ watch(
|
|
|
173
173
|
--_label-text-color: var(--theme-form-input-text-label-color-normal);
|
|
174
174
|
--_label-text-margin-block: 0.8rem;
|
|
175
175
|
--_label-text-size: var(--step-1);
|
|
176
|
-
--_label-text-weight:
|
|
176
|
+
--_label-text-weight: bolder;
|
|
177
177
|
--_label-text-line-height: 1.5;
|
|
178
|
+
--_label-text-background-color: var(--_input-text-with-label-background-color);
|
|
178
179
|
|
|
179
180
|
&.underlined {
|
|
180
181
|
--_label-text-color: var(--theme-form-input-text-label-color-underlined);
|
|
@@ -185,6 +186,7 @@ watch(
|
|
|
185
186
|
&:has(.input-text-wrapper.active),
|
|
186
187
|
&:has(.input-text-wrapper.dirty) {
|
|
187
188
|
--_label-offset: 0 -2.8rem;
|
|
189
|
+
--_label-text-weight: normal;
|
|
188
190
|
/* font-size: var(--step-1); */
|
|
189
191
|
/* line-height: 1.5; */
|
|
190
192
|
/* padding: 0.2rem 1.2rem; */
|
|
@@ -202,6 +204,7 @@ watch(
|
|
|
202
204
|
&:has(.input-text-wrapper.active),
|
|
203
205
|
&:has(.input-text-wrapper.dirty) {
|
|
204
206
|
--_label-offset: 1rem -2.8rem;
|
|
207
|
+
--_label-text-weight: normal;
|
|
205
208
|
/* font-size: var(--step-1); */
|
|
206
209
|
/* line-height: 1.5; */
|
|
207
210
|
/* padding: 0.2rem 1.2rem; */
|
|
@@ -262,13 +265,15 @@ watch(
|
|
|
262
265
|
}
|
|
263
266
|
|
|
264
267
|
.input-text-label {
|
|
265
|
-
display: block;
|
|
268
|
+
display: inline-block;
|
|
266
269
|
color: var(--_label-text-color);
|
|
270
|
+
background-color: var(--_label-text-background-color);
|
|
267
271
|
margin-block: var(--_label-text-margin-block);
|
|
268
272
|
font-size: var(--_label-text-size);
|
|
269
273
|
font-weight: var(--_label-text-weight);
|
|
270
274
|
line-height: var(--_label-text-line-height);
|
|
271
275
|
translate: var(--_label-offset);
|
|
276
|
+
width: fit-content;
|
|
272
277
|
transition: font-size 0.2s ease-in-out, translate 0.2s ease-in-out;
|
|
273
278
|
}
|
|
274
279
|
}
|
package/package.json
CHANGED