@wizco/fenixds-core 1.0.6 → 1.0.7

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.
Files changed (4) hide show
  1. package/package.json +1 -1
  2. package/styles/core.css +7 -4
  3. package/styles/scss/button.scss +1 -0
  4. package/styles/scss/forms.scss +5 -3
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@wizco/fenixds-core",
3
3
  "description": "Fenix design system é um produto da Wiz com ativos de design e código de front-end para ajudar as equipes na criação dos seus produtos.",
4
- "version": "1.0.6",
4
+ "version": "1.0.7",
5
5
  "private": false,
6
6
  "sideEffects": false,
7
7
  "author": "Raul Melo Fernandez",
package/styles/core.css CHANGED
@@ -284,7 +284,7 @@
284
284
  --wco-input-color-label: var(--wco-color-neutral-700, #50555a);
285
285
  --wco-input-color-outline: var(--wco-color-neutral-500, #8d9399);
286
286
  --wco-input-color-icon: var(--wco-color-primary-600, #bf5600);
287
- --wco-input-color-text: var(--wco-color-primary-900, #080809);
287
+ --wco-input-color-text: var(--wco-color-neutral-900, #080809);
288
288
  --wco-input-color-placeholder: var(--wco-color-neutral-600, #6d747a);
289
289
  --wco-input-color-bg: var(--wco-color-neutral-50, #fcfcfc);
290
290
  --wco-input-radius: var(--wco-radius-sm, 4px);
@@ -317,6 +317,7 @@
317
317
  font-size: var(--wco-input-size, 16px);
318
318
  box-shadow: var(--wco-input-shadow);
319
319
  padding: var(--wco-input-padding, 16px);
320
+ font-family: var(--wco-font-family);
320
321
  font-style: normal;
321
322
  font-weight: 400;
322
323
  line-height: 1.375;
@@ -328,7 +329,8 @@
328
329
  .form-field .form-field__input::placeholder,
329
330
  .form-field .form-field__textarea::placeholder,
330
331
  .form-field .form-field__select::placeholder {
331
- color: var(--wco-input-color-placeholder); }
332
+ color: var(--wco-input-color-placeholder);
333
+ font-family: var(--wco-font-family); }
332
334
  .form-field .form-field__input:invalid:not(:placeholder-shown), .form-field .form-field__input.form-field--error:not(:placeholder-shown),
333
335
  .form-field .form-field__textarea:invalid:not(:placeholder-shown),
334
336
  .form-field .form-field__textarea.form-field--error:not(:placeholder-shown),
@@ -366,7 +368,7 @@
366
368
  pointer-events: none; }
367
369
  .form-field:has(input:focus, textarea:focus, select:focus) {
368
370
  --wco-input-color-label: var(--wco-color-primary-700);
369
- --wco-input-color-outline: var(--wco-color-primary-700);
371
+ --wco-input-color-outline: var(--wco-color-primary-600);
370
372
  --wco-input-color-icon: var(--wco-color-primary-600);
371
373
  --wco-input-color-text: var(--wco-color-neutral-900);
372
374
  --wco-input-color-placeholder: var(--wco-color-neutral-600);
@@ -404,7 +406,7 @@
404
406
  .form-field select[value=""]:focus + label,
405
407
  .form-field textarea:focus + label,
406
408
  .form-field input:focus + label {
407
- color: var(--input-default-color);
409
+ color: var(--wco-input-color-label);
408
410
  top: 0;
409
411
  transform: translateY(-50%) translateX(-10px) scale(0.9) !important; }
410
412
  .form-field select:not([value=""]) ~ label,
@@ -578,6 +580,7 @@ a.btn {
578
580
  width: fit-content;
579
581
  letter-spacing: 0.4px;
580
582
  transition: all 300ms ease-in-out, outline 0ms linear;
583
+ font-weight: 600;
581
584
  cursor: pointer;
582
585
  text-decoration: none;
583
586
  font-family: var(--wco-font-family); }
package/styles/scss/button.scss CHANGED
@@ -14,6 +14,7 @@ a.btn {
14
14
  width: fit-content;
15
15
  letter-spacing: 0.4px;
16
16
  transition: all 300ms ease-in-out, outline 0ms linear;
17
+ font-weight: 600;
17
18
  cursor: pointer;
18
19
  text-decoration: none;
19
20
  font-family: var(--wco-font-family);
package/styles/scss/forms.scss CHANGED
@@ -2,7 +2,7 @@
2
2
  --wco-input-color-label: var(--wco-color-neutral-700, #50555a);
3
3
  --wco-input-color-outline: var(--wco-color-neutral-500, #8d9399);
4
4
  --wco-input-color-icon: var(--wco-color-primary-600, #bf5600);
5
- --wco-input-color-text: var(--wco-color-primary-900, #080809);
5
+ --wco-input-color-text: var(--wco-color-neutral-900, #080809);
6
6
  --wco-input-color-placeholder: var(--wco-color-neutral-600, #6d747a);
7
7
  --wco-input-color-bg: var(--wco-color-neutral-50, #fcfcfc);
8
8
  --wco-input-radius: var(--wco-radius-sm, 4px);
@@ -41,6 +41,7 @@
41
41
  font-size: var(--wco-input-size, 16px);
42
42
  box-shadow: var(--wco-input-shadow);
43
43
  padding: var(--wco-input-padding, 16px);
44
+ font-family: var(--wco-font-family);
44
45
  font-style: normal;
45
46
  font-weight: 400;
46
47
  line-height: 1.375;
@@ -51,6 +52,7 @@
51
52
  background-color: var(--wco-input-color-bg);
52
53
  &::placeholder {
53
54
  color: var(--wco-input-color-placeholder);
55
+ font-family: var(--wco-font-family);
54
56
  }
55
57
  // native effects
56
58
  &:invalid:not(:placeholder-shown), &.form-field--error:not(:placeholder-shown) {
@@ -93,7 +95,7 @@
93
95
  /// Focus
94
96
  &:has(input:focus, textarea:focus, select:focus) {
95
97
  --wco-input-color-label: var(--wco-color-primary-700);
96
- --wco-input-color-outline: var(--wco-color-primary-700);
98
+ --wco-input-color-outline: var(--wco-color-primary-600);
97
99
  --wco-input-color-icon: var(--wco-color-primary-600);
98
100
  --wco-input-color-text: var(--wco-color-neutral-900);
99
101
  --wco-input-color-placeholder: var(--wco-color-neutral-600);
@@ -149,7 +151,7 @@
149
151
  select[value=""]:focus+label,
150
152
  textarea:focus+label,
151
153
  input:focus+label {
152
- color: var(--input-default-color);
154
+ color: var(--wco-input-color-label);
153
155
  top: 0;
154
156
  transform: translateY(-50%) translateX(-10px) scale(0.9) !important;
155
157
  }