ilibras-widget 1.5.2 → 1.5.3

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/CHANGELOG.md CHANGED
@@ -4,6 +4,35 @@ Todas as mudanças notáveis neste projeto serão documentadas neste arquivo.
4
4
 
5
5
  ---
6
6
 
7
+ ## [1.5.3] - 2026-09-18
8
+
9
+ ### 🩹 Conserta o widget que sumiu da tela na 1.5.1
10
+
11
+ A 1.5.1 escopou o estilo ao container para o tema do site não pintar o widget —
12
+ e escopou demais.
13
+
14
+ As classes de posição (`.ilibras-widget-bottom-right` e irmãs) ficam no
15
+ **próprio** container, não num descendente dele. Viraram
16
+ `#ilibras-widget-container .ilibras-widget-bottom-right`, com espaço, que não
17
+ casa com nada: o container perdeu `bottom` e `right`, ficou `fixed` sem âncora
18
+ e foi parar onde o fluxo o largou — milhares de pixels abaixo da tela. O widget
19
+ sumiu de um site em produção.
20
+
21
+ Agora o escopo dessas quatro é composto — `#ilibras-widget-container.classe` —
22
+ e o das demais segue descendente.
23
+
24
+ A mesma passagem trazia outros dois furos, dos quais só este deu as caras:
25
+
26
+ - listas de seletores quebradas em várias linhas tinham só a última linha
27
+ escopada, e as demais ficavam expostas ao tema;
28
+ - blocos `@media` inteiros passaram sem escopo, porque a regra logo depois da
29
+ chave do `@media` não era reconhecida.
30
+
31
+ Os três estão cobertos por teste agora: 124 seletores escopados, 16 deles
32
+ compostos, nenhum solto.
33
+
34
+ ---
35
+
7
36
  ## [1.5.2] - 2026-09-18
8
37
 
9
38
  ### 🗂️ Uma aba, não duas
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iLibras Widget v1.5.2
2
+ * iLibras Widget v1.5.3
3
3
  * https://github.com/Dimendes-Solucoes/Ilibras_widget
4
4
  * Licença MIT
5
5
  *
@@ -53,22 +53,22 @@ var CSS = `/**
53
53
  }
54
54
 
55
55
  /* Posicionamento */
56
- #ilibras-widget-container .ilibras-widget-bottom-right {
56
+ #ilibras-widget-container.ilibras-widget-bottom-right {
57
57
  bottom: 30px;
58
58
  right: 30px;
59
59
  }
60
60
 
61
- #ilibras-widget-container .ilibras-widget-bottom-left {
61
+ #ilibras-widget-container.ilibras-widget-bottom-left {
62
62
  bottom: 30px;
63
63
  left: 30px;
64
64
  }
65
65
 
66
- #ilibras-widget-container .ilibras-widget-top-right {
66
+ #ilibras-widget-container.ilibras-widget-top-right {
67
67
  top: 30px;
68
68
  right: 30px;
69
69
  }
70
70
 
71
- #ilibras-widget-container .ilibras-widget-top-left {
71
+ #ilibras-widget-container.ilibras-widget-top-left {
72
72
  top: 30px;
73
73
  left: 30px;
74
74
  }
@@ -101,7 +101,7 @@ var CSS = `/**
101
101
  height: 64px;
102
102
  }
103
103
 
104
- .ilibras-widget-button:hover,
104
+ #ilibras-widget-container .ilibras-widget-button:hover,
105
105
  #ilibras-widget-container .ilibras-widget-button:active {
106
106
  transform: none;
107
107
  box-shadow: none;
@@ -131,7 +131,8 @@ var CSS = `/**
131
131
  }
132
132
 
133
133
  @keyframes ilibras-pulse {
134
- 0%, 100% {
134
+ 0%,
135
+ 100% {
135
136
  transform: scale(1);
136
137
  }
137
138
  50% {
@@ -164,23 +165,23 @@ var CSS = `/**
164
165
  }
165
166
 
166
167
  /* Posicionamento do modal baseado na posição do botão */
167
- .ilibras-widget-bottom-right .ilibras-widget-modal,
168
- #ilibras-widget-container .ilibras-widget-bottom-left .ilibras-widget-modal {
168
+ #ilibras-widget-container.ilibras-widget-bottom-right .ilibras-widget-modal,
169
+ #ilibras-widget-container.ilibras-widget-bottom-left .ilibras-widget-modal {
169
170
  bottom: 105px;
170
171
  }
171
172
 
172
- .ilibras-widget-top-right .ilibras-widget-modal,
173
- #ilibras-widget-container .ilibras-widget-top-left .ilibras-widget-modal {
173
+ #ilibras-widget-container.ilibras-widget-top-right .ilibras-widget-modal,
174
+ #ilibras-widget-container.ilibras-widget-top-left .ilibras-widget-modal {
174
175
  top: 105px;
175
176
  }
176
177
 
177
- .ilibras-widget-bottom-right .ilibras-widget-modal,
178
- #ilibras-widget-container .ilibras-widget-top-right .ilibras-widget-modal {
178
+ #ilibras-widget-container.ilibras-widget-bottom-right .ilibras-widget-modal,
179
+ #ilibras-widget-container.ilibras-widget-top-right .ilibras-widget-modal {
179
180
  right: 0;
180
181
  }
181
182
 
182
- .ilibras-widget-bottom-left .ilibras-widget-modal,
183
- #ilibras-widget-container .ilibras-widget-top-left .ilibras-widget-modal {
183
+ #ilibras-widget-container.ilibras-widget-bottom-left .ilibras-widget-modal,
184
+ #ilibras-widget-container.ilibras-widget-top-left .ilibras-widget-modal {
184
185
  left: 0;
185
186
  }
186
187
 
@@ -274,7 +275,7 @@ var CSS = `/**
274
275
  padding-left: 4px;
275
276
  }
276
277
 
277
- .ilibras-widget-form-group input[type="text"],
278
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"],
278
279
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"] {
279
280
  background: #ffffff;
280
281
  border: 1px solid rgba(20,30,45,0.06);
@@ -283,7 +284,7 @@ var CSS = `/**
283
284
  border-radius: 8px;
284
285
  }
285
286
 
286
- .ilibras-widget-form-group input[type="text"]:focus,
287
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]:focus,
287
288
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]:focus {
288
289
  background: white;
289
290
  border-color: #357ABD;
@@ -291,7 +292,7 @@ var CSS = `/**
291
292
  outline: none;
292
293
  }
293
294
 
294
- .ilibras-widget-form-group input[type="text"]::placeholder,
295
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]::placeholder,
295
296
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]::placeholder {
296
297
  color: #6c757d;
297
298
  }
@@ -391,15 +392,15 @@ var CSS = `/**
391
392
  max-width: 100%;
392
393
  }
393
394
 
394
- .ilibras-widget-bottom-right,
395
- #ilibras-widget-container .ilibras-widget-bottom-left {
395
+ #ilibras-widget-container.ilibras-widget-bottom-right,
396
+ #ilibras-widget-container.ilibras-widget-bottom-left {
396
397
  bottom: 20px;
397
398
  left: 20px !important;
398
399
  right: 20px !important;
399
400
  }
400
401
 
401
- .ilibras-widget-top-right,
402
- #ilibras-widget-container .ilibras-widget-top-left {
402
+ #ilibras-widget-container.ilibras-widget-top-right,
403
+ #ilibras-widget-container.ilibras-widget-top-left {
403
404
  top: 20px;
404
405
  left: 20px !important;
405
406
  right: 20px !important;
@@ -433,8 +434,8 @@ var CSS = `/**
433
434
  }
434
435
  }
435
436
 
436
- .ilibras-widget-button:focus-visible,
437
- .ilibras-widget-close:focus-visible,
437
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
438
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
438
439
  #ilibras-widget-container .ilibras-widget-submit:focus-visible {
439
440
  outline: 3px solid rgba(53,122,189,0.18);
440
441
  outline-offset: 3px;
@@ -459,8 +460,8 @@ var CSS = `/**
459
460
  /* Estados de erro: ver o bloco de acessibilidade no fim do arquivo. */
460
461
 
461
462
  /* Accessibilidade */
462
- .ilibras-widget-button:focus-visible,
463
- .ilibras-widget-close:focus-visible,
463
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
464
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
464
465
  #ilibras-widget-container .ilibras-widget-submit:focus-visible {
465
466
  outline: 3px solid #4A90E2;
466
467
  outline-offset: 2px;
@@ -485,14 +486,14 @@ var CSS = `/**
485
486
  color: #b0b0b0;
486
487
  }
487
488
 
488
- .ilibras-widget-form-group input[type="text"],
489
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"],
489
490
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"] {
490
491
  background: #363636;
491
492
  border-color: #4a4a4a;
492
493
  color: #e0e0e0;
493
494
  }
494
495
 
495
- .ilibras-widget-form-group input[type="text"]::placeholder,
496
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]::placeholder,
496
497
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]::placeholder {
497
498
  color: #6c6c6c;
498
499
  }
@@ -641,11 +642,11 @@ var CSS = `/**
641
642
 
642
643
  /* Foco visível em tudo que recebe foco, inclusive campos — o :focus original
643
644
  trocava a sombra, que some em alto contraste. */
644
- .ilibras-widget-button:focus-visible,
645
- .ilibras-widget-close:focus-visible,
646
- .ilibras-widget-submit:focus-visible,
647
- .ilibras-widget-form-group input:focus-visible,
648
- .ilibras-widget-checkbox-label input:focus-visible,
645
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
646
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
647
+ #ilibras-widget-container .ilibras-widget-submit:focus-visible,
648
+ #ilibras-widget-container .ilibras-widget-form-group input:focus-visible,
649
+ #ilibras-widget-container .ilibras-widget-checkbox-label input:focus-visible,
649
650
  #ilibras-widget-container .ilibras-widget-fallback a:focus-visible {
650
651
  outline: 3px solid #1f4f7a;
651
652
  outline-offset: 2px;
@@ -654,16 +655,16 @@ var CSS = `/**
654
655
  /* Windows em alto contraste remove cor de fundo e borda sutil: sem isto o
655
656
  campo e o botão ficam sem contorno. */
656
657
  @media (forced-colors: active) {
657
- .ilibras-widget-modal,
658
- .ilibras-widget-form-group input,
659
- .ilibras-widget-submit,
658
+ #ilibras-widget-container .ilibras-widget-modal,
659
+ #ilibras-widget-container .ilibras-widget-form-group input,
660
+ #ilibras-widget-container .ilibras-widget-submit,
660
661
  #ilibras-widget-container .ilibras-widget-aviso {
661
662
  border: 1px solid CanvasText;
662
663
  }
663
664
 
664
- .ilibras-widget-button:focus-visible,
665
- .ilibras-widget-close:focus-visible,
666
- .ilibras-widget-submit:focus-visible,
665
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
666
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
667
+ #ilibras-widget-container .ilibras-widget-submit:focus-visible,
667
668
  #ilibras-widget-container .ilibras-widget-form-group input:focus-visible {
668
669
  outline: 3px solid Highlight;
669
670
  }
@@ -673,23 +674,23 @@ var CSS = `/**
673
674
  das pessoas com sensibilidade vestibular, isso causa mal-estar. */
674
675
  @media (prefers-reduced-motion: reduce) {
675
676
  #ilibras-widget-container,
676
- .ilibras-widget-modal,
677
- .ilibras-widget-submit,
678
- .ilibras-widget-close,
677
+ #ilibras-widget-container .ilibras-widget-modal,
678
+ #ilibras-widget-container .ilibras-widget-submit,
679
+ #ilibras-widget-container .ilibras-widget-close,
679
680
  #ilibras-widget-container .ilibras-widget-badge {
680
681
  animation: none !important;
681
682
  transition: none !important;
682
683
  }
683
684
 
684
- .ilibras-widget-submit:hover,
685
+ #ilibras-widget-container .ilibras-widget-submit:hover,
685
686
  #ilibras-widget-container .ilibras-widget-close:hover {
686
687
  transform: none;
687
688
  }
688
689
  }
689
690
 
690
691
  @media (prefers-color-scheme: dark) {
691
- .ilibras-widget-legenda,
692
- .ilibras-widget-dica,
692
+ #ilibras-widget-container .ilibras-widget-legenda,
693
+ #ilibras-widget-container .ilibras-widget-dica,
693
694
  #ilibras-widget-container .ilibras-widget-status {
694
695
  color: #c9c9c9;
695
696
  }
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iLibras Widget v1.5.2
2
+ * iLibras Widget v1.5.3
3
3
  * https://github.com/Dimendes-Solucoes/Ilibras_widget
4
4
  * Licença MIT
5
5
  *
@@ -27,22 +27,22 @@
27
27
  }
28
28
 
29
29
  /* Posicionamento */
30
- #ilibras-widget-container .ilibras-widget-bottom-right {
30
+ #ilibras-widget-container.ilibras-widget-bottom-right {
31
31
  bottom: 30px;
32
32
  right: 30px;
33
33
  }
34
34
 
35
- #ilibras-widget-container .ilibras-widget-bottom-left {
35
+ #ilibras-widget-container.ilibras-widget-bottom-left {
36
36
  bottom: 30px;
37
37
  left: 30px;
38
38
  }
39
39
 
40
- #ilibras-widget-container .ilibras-widget-top-right {
40
+ #ilibras-widget-container.ilibras-widget-top-right {
41
41
  top: 30px;
42
42
  right: 30px;
43
43
  }
44
44
 
45
- #ilibras-widget-container .ilibras-widget-top-left {
45
+ #ilibras-widget-container.ilibras-widget-top-left {
46
46
  top: 30px;
47
47
  left: 30px;
48
48
  }
@@ -75,7 +75,7 @@
75
75
  height: 64px;
76
76
  }
77
77
 
78
- .ilibras-widget-button:hover,
78
+ #ilibras-widget-container .ilibras-widget-button:hover,
79
79
  #ilibras-widget-container .ilibras-widget-button:active {
80
80
  transform: none;
81
81
  box-shadow: none;
@@ -105,7 +105,8 @@
105
105
  }
106
106
 
107
107
  @keyframes ilibras-pulse {
108
- 0%, 100% {
108
+ 0%,
109
+ 100% {
109
110
  transform: scale(1);
110
111
  }
111
112
  50% {
@@ -138,23 +139,23 @@
138
139
  }
139
140
 
140
141
  /* Posicionamento do modal baseado na posição do botão */
141
- .ilibras-widget-bottom-right .ilibras-widget-modal,
142
- #ilibras-widget-container .ilibras-widget-bottom-left .ilibras-widget-modal {
142
+ #ilibras-widget-container.ilibras-widget-bottom-right .ilibras-widget-modal,
143
+ #ilibras-widget-container.ilibras-widget-bottom-left .ilibras-widget-modal {
143
144
  bottom: 105px;
144
145
  }
145
146
 
146
- .ilibras-widget-top-right .ilibras-widget-modal,
147
- #ilibras-widget-container .ilibras-widget-top-left .ilibras-widget-modal {
147
+ #ilibras-widget-container.ilibras-widget-top-right .ilibras-widget-modal,
148
+ #ilibras-widget-container.ilibras-widget-top-left .ilibras-widget-modal {
148
149
  top: 105px;
149
150
  }
150
151
 
151
- .ilibras-widget-bottom-right .ilibras-widget-modal,
152
- #ilibras-widget-container .ilibras-widget-top-right .ilibras-widget-modal {
152
+ #ilibras-widget-container.ilibras-widget-bottom-right .ilibras-widget-modal,
153
+ #ilibras-widget-container.ilibras-widget-top-right .ilibras-widget-modal {
153
154
  right: 0;
154
155
  }
155
156
 
156
- .ilibras-widget-bottom-left .ilibras-widget-modal,
157
- #ilibras-widget-container .ilibras-widget-top-left .ilibras-widget-modal {
157
+ #ilibras-widget-container.ilibras-widget-bottom-left .ilibras-widget-modal,
158
+ #ilibras-widget-container.ilibras-widget-top-left .ilibras-widget-modal {
158
159
  left: 0;
159
160
  }
160
161
 
@@ -248,7 +249,7 @@
248
249
  padding-left: 4px;
249
250
  }
250
251
 
251
- .ilibras-widget-form-group input[type="text"],
252
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"],
252
253
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"] {
253
254
  background: #ffffff;
254
255
  border: 1px solid rgba(20,30,45,0.06);
@@ -257,7 +258,7 @@
257
258
  border-radius: 8px;
258
259
  }
259
260
 
260
- .ilibras-widget-form-group input[type="text"]:focus,
261
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]:focus,
261
262
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]:focus {
262
263
  background: white;
263
264
  border-color: #357ABD;
@@ -265,7 +266,7 @@
265
266
  outline: none;
266
267
  }
267
268
 
268
- .ilibras-widget-form-group input[type="text"]::placeholder,
269
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]::placeholder,
269
270
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]::placeholder {
270
271
  color: #6c757d;
271
272
  }
@@ -365,15 +366,15 @@
365
366
  max-width: 100%;
366
367
  }
367
368
 
368
- .ilibras-widget-bottom-right,
369
- #ilibras-widget-container .ilibras-widget-bottom-left {
369
+ #ilibras-widget-container.ilibras-widget-bottom-right,
370
+ #ilibras-widget-container.ilibras-widget-bottom-left {
370
371
  bottom: 20px;
371
372
  left: 20px !important;
372
373
  right: 20px !important;
373
374
  }
374
375
 
375
- .ilibras-widget-top-right,
376
- #ilibras-widget-container .ilibras-widget-top-left {
376
+ #ilibras-widget-container.ilibras-widget-top-right,
377
+ #ilibras-widget-container.ilibras-widget-top-left {
377
378
  top: 20px;
378
379
  left: 20px !important;
379
380
  right: 20px !important;
@@ -407,8 +408,8 @@
407
408
  }
408
409
  }
409
410
 
410
- .ilibras-widget-button:focus-visible,
411
- .ilibras-widget-close:focus-visible,
411
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
412
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
412
413
  #ilibras-widget-container .ilibras-widget-submit:focus-visible {
413
414
  outline: 3px solid rgba(53,122,189,0.18);
414
415
  outline-offset: 3px;
@@ -433,8 +434,8 @@
433
434
  /* Estados de erro: ver o bloco de acessibilidade no fim do arquivo. */
434
435
 
435
436
  /* Accessibilidade */
436
- .ilibras-widget-button:focus-visible,
437
- .ilibras-widget-close:focus-visible,
437
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
438
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
438
439
  #ilibras-widget-container .ilibras-widget-submit:focus-visible {
439
440
  outline: 3px solid #4A90E2;
440
441
  outline-offset: 2px;
@@ -459,14 +460,14 @@
459
460
  color: #b0b0b0;
460
461
  }
461
462
 
462
- .ilibras-widget-form-group input[type="text"],
463
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"],
463
464
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"] {
464
465
  background: #363636;
465
466
  border-color: #4a4a4a;
466
467
  color: #e0e0e0;
467
468
  }
468
469
 
469
- .ilibras-widget-form-group input[type="text"]::placeholder,
470
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]::placeholder,
470
471
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]::placeholder {
471
472
  color: #6c6c6c;
472
473
  }
@@ -615,11 +616,11 @@
615
616
 
616
617
  /* Foco visível em tudo que recebe foco, inclusive campos — o :focus original
617
618
  trocava a sombra, que some em alto contraste. */
618
- .ilibras-widget-button:focus-visible,
619
- .ilibras-widget-close:focus-visible,
620
- .ilibras-widget-submit:focus-visible,
621
- .ilibras-widget-form-group input:focus-visible,
622
- .ilibras-widget-checkbox-label input:focus-visible,
619
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
620
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
621
+ #ilibras-widget-container .ilibras-widget-submit:focus-visible,
622
+ #ilibras-widget-container .ilibras-widget-form-group input:focus-visible,
623
+ #ilibras-widget-container .ilibras-widget-checkbox-label input:focus-visible,
623
624
  #ilibras-widget-container .ilibras-widget-fallback a:focus-visible {
624
625
  outline: 3px solid #1f4f7a;
625
626
  outline-offset: 2px;
@@ -628,16 +629,16 @@
628
629
  /* Windows em alto contraste remove cor de fundo e borda sutil: sem isto o
629
630
  campo e o botão ficam sem contorno. */
630
631
  @media (forced-colors: active) {
631
- .ilibras-widget-modal,
632
- .ilibras-widget-form-group input,
633
- .ilibras-widget-submit,
632
+ #ilibras-widget-container .ilibras-widget-modal,
633
+ #ilibras-widget-container .ilibras-widget-form-group input,
634
+ #ilibras-widget-container .ilibras-widget-submit,
634
635
  #ilibras-widget-container .ilibras-widget-aviso {
635
636
  border: 1px solid CanvasText;
636
637
  }
637
638
 
638
- .ilibras-widget-button:focus-visible,
639
- .ilibras-widget-close:focus-visible,
640
- .ilibras-widget-submit:focus-visible,
639
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
640
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
641
+ #ilibras-widget-container .ilibras-widget-submit:focus-visible,
641
642
  #ilibras-widget-container .ilibras-widget-form-group input:focus-visible {
642
643
  outline: 3px solid Highlight;
643
644
  }
@@ -647,23 +648,23 @@
647
648
  das pessoas com sensibilidade vestibular, isso causa mal-estar. */
648
649
  @media (prefers-reduced-motion: reduce) {
649
650
  #ilibras-widget-container,
650
- .ilibras-widget-modal,
651
- .ilibras-widget-submit,
652
- .ilibras-widget-close,
651
+ #ilibras-widget-container .ilibras-widget-modal,
652
+ #ilibras-widget-container .ilibras-widget-submit,
653
+ #ilibras-widget-container .ilibras-widget-close,
653
654
  #ilibras-widget-container .ilibras-widget-badge {
654
655
  animation: none !important;
655
656
  transition: none !important;
656
657
  }
657
658
 
658
- .ilibras-widget-submit:hover,
659
+ #ilibras-widget-container .ilibras-widget-submit:hover,
659
660
  #ilibras-widget-container .ilibras-widget-close:hover {
660
661
  transform: none;
661
662
  }
662
663
  }
663
664
 
664
665
  @media (prefers-color-scheme: dark) {
665
- .ilibras-widget-legenda,
666
- .ilibras-widget-dica,
666
+ #ilibras-widget-container .ilibras-widget-legenda,
667
+ #ilibras-widget-container .ilibras-widget-dica,
667
668
  #ilibras-widget-container .ilibras-widget-status {
668
669
  color: #c9c9c9;
669
670
  }
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * iLibras Widget v1.5.2
2
+ * iLibras Widget v1.5.3
3
3
  * https://github.com/Dimendes-Solucoes/Ilibras_widget
4
4
  * Licença MIT
5
5
  *
@@ -27,22 +27,22 @@ var CSS = `/**
27
27
  }
28
28
 
29
29
  /* Posicionamento */
30
- #ilibras-widget-container .ilibras-widget-bottom-right {
30
+ #ilibras-widget-container.ilibras-widget-bottom-right {
31
31
  bottom: 30px;
32
32
  right: 30px;
33
33
  }
34
34
 
35
- #ilibras-widget-container .ilibras-widget-bottom-left {
35
+ #ilibras-widget-container.ilibras-widget-bottom-left {
36
36
  bottom: 30px;
37
37
  left: 30px;
38
38
  }
39
39
 
40
- #ilibras-widget-container .ilibras-widget-top-right {
40
+ #ilibras-widget-container.ilibras-widget-top-right {
41
41
  top: 30px;
42
42
  right: 30px;
43
43
  }
44
44
 
45
- #ilibras-widget-container .ilibras-widget-top-left {
45
+ #ilibras-widget-container.ilibras-widget-top-left {
46
46
  top: 30px;
47
47
  left: 30px;
48
48
  }
@@ -75,7 +75,7 @@ var CSS = `/**
75
75
  height: 64px;
76
76
  }
77
77
 
78
- .ilibras-widget-button:hover,
78
+ #ilibras-widget-container .ilibras-widget-button:hover,
79
79
  #ilibras-widget-container .ilibras-widget-button:active {
80
80
  transform: none;
81
81
  box-shadow: none;
@@ -105,7 +105,8 @@ var CSS = `/**
105
105
  }
106
106
 
107
107
  @keyframes ilibras-pulse {
108
- 0%, 100% {
108
+ 0%,
109
+ 100% {
109
110
  transform: scale(1);
110
111
  }
111
112
  50% {
@@ -138,23 +139,23 @@ var CSS = `/**
138
139
  }
139
140
 
140
141
  /* Posicionamento do modal baseado na posição do botão */
141
- .ilibras-widget-bottom-right .ilibras-widget-modal,
142
- #ilibras-widget-container .ilibras-widget-bottom-left .ilibras-widget-modal {
142
+ #ilibras-widget-container.ilibras-widget-bottom-right .ilibras-widget-modal,
143
+ #ilibras-widget-container.ilibras-widget-bottom-left .ilibras-widget-modal {
143
144
  bottom: 105px;
144
145
  }
145
146
 
146
- .ilibras-widget-top-right .ilibras-widget-modal,
147
- #ilibras-widget-container .ilibras-widget-top-left .ilibras-widget-modal {
147
+ #ilibras-widget-container.ilibras-widget-top-right .ilibras-widget-modal,
148
+ #ilibras-widget-container.ilibras-widget-top-left .ilibras-widget-modal {
148
149
  top: 105px;
149
150
  }
150
151
 
151
- .ilibras-widget-bottom-right .ilibras-widget-modal,
152
- #ilibras-widget-container .ilibras-widget-top-right .ilibras-widget-modal {
152
+ #ilibras-widget-container.ilibras-widget-bottom-right .ilibras-widget-modal,
153
+ #ilibras-widget-container.ilibras-widget-top-right .ilibras-widget-modal {
153
154
  right: 0;
154
155
  }
155
156
 
156
- .ilibras-widget-bottom-left .ilibras-widget-modal,
157
- #ilibras-widget-container .ilibras-widget-top-left .ilibras-widget-modal {
157
+ #ilibras-widget-container.ilibras-widget-bottom-left .ilibras-widget-modal,
158
+ #ilibras-widget-container.ilibras-widget-top-left .ilibras-widget-modal {
158
159
  left: 0;
159
160
  }
160
161
 
@@ -248,7 +249,7 @@ var CSS = `/**
248
249
  padding-left: 4px;
249
250
  }
250
251
 
251
- .ilibras-widget-form-group input[type="text"],
252
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"],
252
253
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"] {
253
254
  background: #ffffff;
254
255
  border: 1px solid rgba(20,30,45,0.06);
@@ -257,7 +258,7 @@ var CSS = `/**
257
258
  border-radius: 8px;
258
259
  }
259
260
 
260
- .ilibras-widget-form-group input[type="text"]:focus,
261
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]:focus,
261
262
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]:focus {
262
263
  background: white;
263
264
  border-color: #357ABD;
@@ -265,7 +266,7 @@ var CSS = `/**
265
266
  outline: none;
266
267
  }
267
268
 
268
- .ilibras-widget-form-group input[type="text"]::placeholder,
269
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]::placeholder,
269
270
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]::placeholder {
270
271
  color: #6c757d;
271
272
  }
@@ -365,15 +366,15 @@ var CSS = `/**
365
366
  max-width: 100%;
366
367
  }
367
368
 
368
- .ilibras-widget-bottom-right,
369
- #ilibras-widget-container .ilibras-widget-bottom-left {
369
+ #ilibras-widget-container.ilibras-widget-bottom-right,
370
+ #ilibras-widget-container.ilibras-widget-bottom-left {
370
371
  bottom: 20px;
371
372
  left: 20px !important;
372
373
  right: 20px !important;
373
374
  }
374
375
 
375
- .ilibras-widget-top-right,
376
- #ilibras-widget-container .ilibras-widget-top-left {
376
+ #ilibras-widget-container.ilibras-widget-top-right,
377
+ #ilibras-widget-container.ilibras-widget-top-left {
377
378
  top: 20px;
378
379
  left: 20px !important;
379
380
  right: 20px !important;
@@ -407,8 +408,8 @@ var CSS = `/**
407
408
  }
408
409
  }
409
410
 
410
- .ilibras-widget-button:focus-visible,
411
- .ilibras-widget-close:focus-visible,
411
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
412
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
412
413
  #ilibras-widget-container .ilibras-widget-submit:focus-visible {
413
414
  outline: 3px solid rgba(53,122,189,0.18);
414
415
  outline-offset: 3px;
@@ -433,8 +434,8 @@ var CSS = `/**
433
434
  /* Estados de erro: ver o bloco de acessibilidade no fim do arquivo. */
434
435
 
435
436
  /* Accessibilidade */
436
- .ilibras-widget-button:focus-visible,
437
- .ilibras-widget-close:focus-visible,
437
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
438
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
438
439
  #ilibras-widget-container .ilibras-widget-submit:focus-visible {
439
440
  outline: 3px solid #4A90E2;
440
441
  outline-offset: 2px;
@@ -459,14 +460,14 @@ var CSS = `/**
459
460
  color: #b0b0b0;
460
461
  }
461
462
 
462
- .ilibras-widget-form-group input[type="text"],
463
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"],
463
464
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"] {
464
465
  background: #363636;
465
466
  border-color: #4a4a4a;
466
467
  color: #e0e0e0;
467
468
  }
468
469
 
469
- .ilibras-widget-form-group input[type="text"]::placeholder,
470
+ #ilibras-widget-container .ilibras-widget-form-group input[type="text"]::placeholder,
470
471
  #ilibras-widget-container .ilibras-widget-form-group input[type="tel"]::placeholder {
471
472
  color: #6c6c6c;
472
473
  }
@@ -615,11 +616,11 @@ var CSS = `/**
615
616
 
616
617
  /* Foco visível em tudo que recebe foco, inclusive campos — o :focus original
617
618
  trocava a sombra, que some em alto contraste. */
618
- .ilibras-widget-button:focus-visible,
619
- .ilibras-widget-close:focus-visible,
620
- .ilibras-widget-submit:focus-visible,
621
- .ilibras-widget-form-group input:focus-visible,
622
- .ilibras-widget-checkbox-label input:focus-visible,
619
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
620
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
621
+ #ilibras-widget-container .ilibras-widget-submit:focus-visible,
622
+ #ilibras-widget-container .ilibras-widget-form-group input:focus-visible,
623
+ #ilibras-widget-container .ilibras-widget-checkbox-label input:focus-visible,
623
624
  #ilibras-widget-container .ilibras-widget-fallback a:focus-visible {
624
625
  outline: 3px solid #1f4f7a;
625
626
  outline-offset: 2px;
@@ -628,16 +629,16 @@ var CSS = `/**
628
629
  /* Windows em alto contraste remove cor de fundo e borda sutil: sem isto o
629
630
  campo e o botão ficam sem contorno. */
630
631
  @media (forced-colors: active) {
631
- .ilibras-widget-modal,
632
- .ilibras-widget-form-group input,
633
- .ilibras-widget-submit,
632
+ #ilibras-widget-container .ilibras-widget-modal,
633
+ #ilibras-widget-container .ilibras-widget-form-group input,
634
+ #ilibras-widget-container .ilibras-widget-submit,
634
635
  #ilibras-widget-container .ilibras-widget-aviso {
635
636
  border: 1px solid CanvasText;
636
637
  }
637
638
 
638
- .ilibras-widget-button:focus-visible,
639
- .ilibras-widget-close:focus-visible,
640
- .ilibras-widget-submit:focus-visible,
639
+ #ilibras-widget-container .ilibras-widget-button:focus-visible,
640
+ #ilibras-widget-container .ilibras-widget-close:focus-visible,
641
+ #ilibras-widget-container .ilibras-widget-submit:focus-visible,
641
642
  #ilibras-widget-container .ilibras-widget-form-group input:focus-visible {
642
643
  outline: 3px solid Highlight;
643
644
  }
@@ -647,23 +648,23 @@ var CSS = `/**
647
648
  das pessoas com sensibilidade vestibular, isso causa mal-estar. */
648
649
  @media (prefers-reduced-motion: reduce) {
649
650
  #ilibras-widget-container,
650
- .ilibras-widget-modal,
651
- .ilibras-widget-submit,
652
- .ilibras-widget-close,
651
+ #ilibras-widget-container .ilibras-widget-modal,
652
+ #ilibras-widget-container .ilibras-widget-submit,
653
+ #ilibras-widget-container .ilibras-widget-close,
653
654
  #ilibras-widget-container .ilibras-widget-badge {
654
655
  animation: none !important;
655
656
  transition: none !important;
656
657
  }
657
658
 
658
- .ilibras-widget-submit:hover,
659
+ #ilibras-widget-container .ilibras-widget-submit:hover,
659
660
  #ilibras-widget-container .ilibras-widget-close:hover {
660
661
  transform: none;
661
662
  }
662
663
  }
663
664
 
664
665
  @media (prefers-color-scheme: dark) {
665
- .ilibras-widget-legenda,
666
- .ilibras-widget-dica,
666
+ #ilibras-widget-container .ilibras-widget-legenda,
667
+ #ilibras-widget-container .ilibras-widget-dica,
667
668
  #ilibras-widget-container .ilibras-widget-status {
668
669
  color: #c9c9c9;
669
670
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ilibras-widget",
3
- "version": "1.5.2",
3
+ "version": "1.5.3",
4
4
  "description": "Widget de acessibilidade em Libras: formulário embarcável que leva a pessoa surda ao atendimento com intérprete, ao vivo ou agendado",
5
5
  "type": "module",
6
6
  "main": "./dist/ilibras-widget.cjs",