feat(styles): add $swal2-header-padding variable (#2001)

* feat(styles): add $swal2-header-padding variable * feat(styles): add $swal2-toast-header-padding and $swal2-toast-content-padding
sweetalert2 · Jul 14, 2020 · 11338e6 · 11338e6
1 parent a08f07d
commit 11338e6
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/src/scss/_core.scss b/src/scss/_core.scss
@@ -191,6 +191,7 @@
   display: flex;
   flex-direction: column;
   align-items: center;
+  padding: $swal2-header-padding;
 }
 
 .swal2-title {

diff --git a/src/scss/_toasts.scss b/src/scss/_toasts.scss
@@ -10,6 +10,7 @@
 
     .swal2-header {
       flex-direction: row;
+      padding: $swal2-toast-header-padding;
     }
 
     .swal2-title {
@@ -34,6 +35,7 @@
 
     .swal2-content {
       justify-content: flex-start;
+      padding: $swal2-toast-content-padding;
       font-size: $swal2-toast-content-font-size;
     }
 

diff --git a/src/variables.scss b/src/variables.scss
@@ -27,6 +27,9 @@ $swal2-font-size: 1rem !default;
 $swal2-backdrop: rgba($swal2-black, .4) !default;
 $swal2-backdrop-transition: background-color .1s !default;
 
+// HEADER
+$swal2-header-padding: 0 1.8em !default;
+
 // ICONS
 $swal2-icon-size: 5em !default;
 $swal2-icon-animations: true !default;
@@ -51,7 +54,7 @@ $swal2-title-font-size: 1.875em !default;
 // CONTENT
 $swal2-content-justify-content: center !default;
 $swal2-content-margin: 0 !default;
-$swal2-content-pading: 0 !default;
+$swal2-content-pading: 0 1.6em !default;
 $swal2-content-color: lighten($swal2-black, 33) !default;
 $swal2-content-font-size: 1.125em !default;
 $swal2-content-font-weight: normal !default;
@@ -176,8 +179,10 @@ $swal2-toast-close-button-height: .8em !default;
 $swal2-toast-close-button-line-height: .8 !default;
 $swal2-toast-width: auto !default;
 $swal2-toast-padding: .625em !default;
+$swal2-toast-header-padding: 0 !default;
 $swal2-toast-title-margin: 0 .6em !default;
 $swal2-toast-title-font-size: 1em !default;
+$swal2-toast-content-padding: 0 !default;
 $swal2-toast-content-font-size: 1em !default;
 $swal2-toast-input-font-size: 1em !default;
 $swal2-toast-validation-font-size: 1em !default;