@onpe/ui 1.2.61 → 1.2.62

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 (5) hide show
  1. package/dist/components.css +21 -4
  2. package/dist/components.esm.css +21 -4
  3. package/dist/index.css +21 -4
  4. package/dist/index.esm.css +21 -4
  5. package/package.json +1 -1
package/dist/components.css CHANGED
@@ -526,8 +526,8 @@ body.onpe-modal-open {
526
526
 
527
527
  /* ModalConfirm Component Styles */
528
528
  .onpe-modal-confirm-container {
529
- max-width: 680px !important;
530
- width: 680px !important;
529
+ width: 100%;
530
+ max-width: 780px !important; /* Tamaño específico para móvil */
531
531
  padding-top:30px !important; /* pt-5 */
532
532
  padding-bottom: 30px !important; /* pb-8 */
533
533
  padding-left: 30px !important; /* pl-5 */
@@ -595,10 +595,27 @@ body.onpe-modal-open {
595
595
  max-width: 200px;
596
596
  }
597
597
 
598
+ /* Estilos específicos para móvil */
599
+ @media (max-width: 640px) {
600
+ .onpe-modal-confirm-container {
601
+ padding-left: 20px !important; /* Menos padding en móvil */
602
+ padding-right: 20px !important;
603
+ }
604
+
605
+ .onpe-modal-confirm-title {
606
+ font-size: 1rem; /* text-base para móvil */
607
+ }
608
+
609
+ .onpe-modal-confirm-message {
610
+ font-size: 0.875rem; /* text-sm para móvil */
611
+ padding: 0 8px; /* Pequeño padding horizontal */
612
+ }
613
+ }
614
+
598
615
  /* Responsive Design */
599
616
  @media (min-width: 768px) {
600
617
  .onpe-modal-confirm-container {
601
- width: 680px !important;
618
+ /* Tablet: Tamaño específico de 680px */
602
619
  max-width: 680px !important;
603
620
  padding-left: 32px !important; /* pl-5 */
604
621
  padding-right: 32px !important; /* pr-5 */
@@ -607,7 +624,7 @@ body.onpe-modal-open {
607
624
 
608
625
  @media (min-width: 1024px) {
609
626
  .onpe-modal-confirm-container {
610
- width: 680px !important;
627
+ /* Desktop grande: Tamaño específico de 680px */
611
628
  max-width: 680px !important;
612
629
  }
613
630
 
package/dist/components.esm.css CHANGED
@@ -526,8 +526,8 @@ body.onpe-modal-open {
526
526
 
527
527
  /* ModalConfirm Component Styles */
528
528
  .onpe-modal-confirm-container {
529
- max-width: 680px !important;
530
- width: 680px !important;
529
+ width: 100%;
530
+ max-width: 780px !important; /* Tamaño específico para móvil */
531
531
  padding-top:30px !important; /* pt-5 */
532
532
  padding-bottom: 30px !important; /* pb-8 */
533
533
  padding-left: 30px !important; /* pl-5 */
@@ -595,10 +595,27 @@ body.onpe-modal-open {
595
595
  max-width: 200px;
596
596
  }
597
597
 
598
+ /* Estilos específicos para móvil */
599
+ @media (max-width: 640px) {
600
+ .onpe-modal-confirm-container {
601
+ padding-left: 20px !important; /* Menos padding en móvil */
602
+ padding-right: 20px !important;
603
+ }
604
+
605
+ .onpe-modal-confirm-title {
606
+ font-size: 1rem; /* text-base para móvil */
607
+ }
608
+
609
+ .onpe-modal-confirm-message {
610
+ font-size: 0.875rem; /* text-sm para móvil */
611
+ padding: 0 8px; /* Pequeño padding horizontal */
612
+ }
613
+ }
614
+
598
615
  /* Responsive Design */
599
616
  @media (min-width: 768px) {
600
617
  .onpe-modal-confirm-container {
601
- width: 680px !important;
618
+ /* Tablet: Tamaño específico de 680px */
602
619
  max-width: 680px !important;
603
620
  padding-left: 32px !important; /* pl-5 */
604
621
  padding-right: 32px !important; /* pr-5 */
@@ -607,7 +624,7 @@ body.onpe-modal-open {
607
624
 
608
625
  @media (min-width: 1024px) {
609
626
  .onpe-modal-confirm-container {
610
- width: 680px !important;
627
+ /* Desktop grande: Tamaño específico de 680px */
611
628
  max-width: 680px !important;
612
629
  }
613
630
 
package/dist/index.css CHANGED
@@ -526,8 +526,8 @@ body.onpe-modal-open {
526
526
 
527
527
  /* ModalConfirm Component Styles */
528
528
  .onpe-modal-confirm-container {
529
- max-width: 680px !important;
530
- width: 680px !important;
529
+ width: 100%;
530
+ max-width: 780px !important; /* Tamaño específico para móvil */
531
531
  padding-top:30px !important; /* pt-5 */
532
532
  padding-bottom: 30px !important; /* pb-8 */
533
533
  padding-left: 30px !important; /* pl-5 */
@@ -595,10 +595,27 @@ body.onpe-modal-open {
595
595
  max-width: 200px;
596
596
  }
597
597
 
598
+ /* Estilos específicos para móvil */
599
+ @media (max-width: 640px) {
600
+ .onpe-modal-confirm-container {
601
+ padding-left: 20px !important; /* Menos padding en móvil */
602
+ padding-right: 20px !important;
603
+ }
604
+
605
+ .onpe-modal-confirm-title {
606
+ font-size: 1rem; /* text-base para móvil */
607
+ }
608
+
609
+ .onpe-modal-confirm-message {
610
+ font-size: 0.875rem; /* text-sm para móvil */
611
+ padding: 0 8px; /* Pequeño padding horizontal */
612
+ }
613
+ }
614
+
598
615
  /* Responsive Design */
599
616
  @media (min-width: 768px) {
600
617
  .onpe-modal-confirm-container {
601
- width: 680px !important;
618
+ /* Tablet: Tamaño específico de 680px */
602
619
  max-width: 680px !important;
603
620
  padding-left: 32px !important; /* pl-5 */
604
621
  padding-right: 32px !important; /* pr-5 */
@@ -607,7 +624,7 @@ body.onpe-modal-open {
607
624
 
608
625
  @media (min-width: 1024px) {
609
626
  .onpe-modal-confirm-container {
610
- width: 680px !important;
627
+ /* Desktop grande: Tamaño específico de 680px */
611
628
  max-width: 680px !important;
612
629
  }
613
630
 
package/dist/index.esm.css CHANGED
@@ -526,8 +526,8 @@ body.onpe-modal-open {
526
526
 
527
527
  /* ModalConfirm Component Styles */
528
528
  .onpe-modal-confirm-container {
529
- max-width: 680px !important;
530
- width: 680px !important;
529
+ width: 100%;
530
+ max-width: 780px !important; /* Tamaño específico para móvil */
531
531
  padding-top:30px !important; /* pt-5 */
532
532
  padding-bottom: 30px !important; /* pb-8 */
533
533
  padding-left: 30px !important; /* pl-5 */
@@ -595,10 +595,27 @@ body.onpe-modal-open {
595
595
  max-width: 200px;
596
596
  }
597
597
 
598
+ /* Estilos específicos para móvil */
599
+ @media (max-width: 640px) {
600
+ .onpe-modal-confirm-container {
601
+ padding-left: 20px !important; /* Menos padding en móvil */
602
+ padding-right: 20px !important;
603
+ }
604
+
605
+ .onpe-modal-confirm-title {
606
+ font-size: 1rem; /* text-base para móvil */
607
+ }
608
+
609
+ .onpe-modal-confirm-message {
610
+ font-size: 0.875rem; /* text-sm para móvil */
611
+ padding: 0 8px; /* Pequeño padding horizontal */
612
+ }
613
+ }
614
+
598
615
  /* Responsive Design */
599
616
  @media (min-width: 768px) {
600
617
  .onpe-modal-confirm-container {
601
- width: 680px !important;
618
+ /* Tablet: Tamaño específico de 680px */
602
619
  max-width: 680px !important;
603
620
  padding-left: 32px !important; /* pl-5 */
604
621
  padding-right: 32px !important; /* pr-5 */
@@ -607,7 +624,7 @@ body.onpe-modal-open {
607
624
 
608
625
  @media (min-width: 1024px) {
609
626
  .onpe-modal-confirm-container {
610
- width: 680px !important;
627
+ /* Desktop grande: Tamaño específico de 680px */
611
628
  max-width: 680px !important;
612
629
  }
613
630
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onpe/ui",
3
- "version": "1.2.61",
3
+ "version": "1.2.62",
4
4
  "type": "module",
5
5
  "description": "Librería de componentes UI para ONPE - Componentes e Iconos",
6
6
  "main": "dist/index.js",