Skip to content

Commit

Permalink
fix(bootstrap-4): remove padding and border-bottom from .swal2-header
Browse files Browse the repository at this point in the history 
fixes #52
  • Loading branch information
@limonte
limonte committed Mar 7, 2020
1 parent 170ffb5 commit 1afddc0
Showing 1 changed file with 123 additions and 124 deletions.
247 changes: 123 additions & 124 deletions bootstrap-4/bootstrap-4.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -189,6 +189,8 @@ $swal2-input-font-size: 1rem;
$swal2-input-padding: $bootstrap-input-padding-y $bootstrap-input-padding-x;

// CLOSE BUTTON
$swal2-close-button-width: 2em;
$swal2-close-button-height: 2em;
$swal2-close-button-line-height: 1;
$swal2-close-button-color: rgba($swal2-black, .5);
$swal2-close-button-font-size: 1.5rem;
Expand Down Expand Up @@ -223,7 +225,6 @@ $swal2-toast-buttons-font-size: $bootstrap-toast-font-size;
}

.swal2-popup {
padding: 0;
border: $bootstrap-input-border-width solid rgba(0, 0, 0, .2);

&.swal2-toast {
Expand Down Expand Up @@ -256,11 +257,6 @@ $swal2-toast-buttons-font-size: $bootstrap-toast-font-size;
}
}

.swal2-header {
padding: 1rem;
border-bottom: $bootstrap-input-border-width solid $bootstrap-input-border-color;
}

.swal2-title {
margin: 0;
font-size: 1.25rem;
Expand All @@ -271,7 +267,6 @@ $swal2-toast-buttons-font-size: $bootstrap-toast-font-size;
}

.swal2-actions {
padding: 0 0 1rem;
border-radius: $bootstrap-input-border-radius;
}

Expand Down Expand Up @@ -544,146 +539,150 @@ $swal2-toast-buttons-font-size: $bootstrap-toast-font-size;
}
}

.swal2-range input {
width: 100%;
height: calc(#{$bootstrap-custom-range-thumb-height} + #{$bootstrap-custom-range-thumb-focus-box-shadow-width * 3});
padding: 0;
background-color: transparent;
appearance: none;

&:focus {
outline: none;

&::-webkit-slider-thumb {
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
}

&::-moz-range-thumb {
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
}
.swal2-range {
align-items: center;

&::-ms-thumb {
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
}
}

&::-moz-focus-outer {
border: 0;
}

&::-webkit-slider-thumb {
width: $bootstrap-custom-range-thumb-width;
height: $bootstrap-custom-range-thumb-height;
margin-top: ($bootstrap-custom-range-track-height - $bootstrap-custom-range-thumb-height) / 2;
transition: $bootstrap-custom-forms-transition;
border: $bootstrap-custom-range-thumb-border;
border-radius: $bootstrap-custom-range-thumb-border-radius;
background: $bootstrap-custom-range-thumb-bg;
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
input {
width: 100%;
height: calc(#{$bootstrap-custom-range-thumb-height} + #{$bootstrap-custom-range-thumb-focus-box-shadow-width * 3});
padding: 0;
background-color: transparent;
appearance: none;

&:active {
background: $bootstrap-custom-range-thumb-active-bg;
}
}
&:focus {
outline: none;

&::-webkit-slider-runnable-track {
width: $bootstrap-custom-range-track-width;
height: $bootstrap-custom-range-track-height;
border-radius: $bootstrap-custom-range-track-border-radius;
border-color: transparent;
background-color: $bootstrap-custom-range-track-bg;
box-shadow: $bootstrap-custom-range-track-box-shadow;
color: transparent;
cursor: $bootstrap-custom-range-track-cursor;
}
&::-webkit-slider-thumb {
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
}

&::-moz-range-thumb {
width: $bootstrap-custom-range-thumb-width;
height: $bootstrap-custom-range-thumb-height;
margin-top: 1rem;
transition: $bootstrap-custom-forms-transition;
border: $bootstrap-custom-range-thumb-border;
border-radius: $bootstrap-custom-range-thumb-border-radius;
background: $bootstrap-custom-range-thumb-bg;
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
appearance: none;
&::-moz-range-thumb {
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
}

&:active {
background: $bootstrap-custom-range-thumb-active-bg;
&::-ms-thumb {
box-shadow: $bootstrap-custom-range-thumb-focus-box-shadow;
}
}
}

&::-moz-range-track {
width: $bootstrap-custom-range-track-width;
height: $bootstrap-custom-range-track-height;
border-radius: $bootstrap-custom-range-track-border-radius;
border-color: transparent;
background-color: $bootstrap-custom-range-track-bg;
box-shadow: $bootstrap-custom-range-track-box-shadow;
color: transparent;
cursor: $bootstrap-custom-range-track-cursor;
}

&::-ms-thumb {
width: $bootstrap-custom-range-thumb-width;
height: $bootstrap-custom-range-thumb-height;
margin-top: 0;
margin-right: $bootstrap-custom-range-thumb-focus-box-shadow-width;
margin-left: $bootstrap-custom-range-thumb-focus-box-shadow-width;
transition: $bootstrap-custom-forms-transition;
border: $bootstrap-custom-range-thumb-border;
border-radius: $bootstrap-custom-range-thumb-border-radius;
background: $bootstrap-custom-range-thumb-bg;
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
appearance: none;

&:active {
background: $bootstrap-custom-range-thumb-active-bg;
&::-moz-focus-outer {
border: 0;
}
}

&::-ms-track {
width: $bootstrap-custom-range-track-width;
height: $bootstrap-custom-range-track-height;
border-width: $bootstrap-custom-range-thumb-height / 2;
border-color: transparent;
background-color: transparent;
box-shadow: $bootstrap-custom-range-track-box-shadow;
color: transparent;
cursor: $bootstrap-custom-range-track-cursor;
}

&::-ms-fill-lower {
border-radius: $bootstrap-custom-range-track-border-radius;
background-color: $bootstrap-custom-range-track-bg;
}

&::-ms-fill-upper {
margin-right: 15px;
border-radius: $bootstrap-custom-range-track-border-radius;
background-color: $bootstrap-custom-range-track-bg;
}

&:disabled {
&::-webkit-slider-thumb {
background-color: $bootstrap-custom-range-thumb-disabled-bg;
width: $bootstrap-custom-range-thumb-width;
height: $bootstrap-custom-range-thumb-height;
margin-top: ($bootstrap-custom-range-track-height - $bootstrap-custom-range-thumb-height) / 2;
transition: $bootstrap-custom-forms-transition;
border: $bootstrap-custom-range-thumb-border;
border-radius: $bootstrap-custom-range-thumb-border-radius;
background: $bootstrap-custom-range-thumb-bg;
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
appearance: none;

&:active {
background: $bootstrap-custom-range-thumb-active-bg;
}
}

&::-webkit-slider-runnable-track {
cursor: default;
width: $bootstrap-custom-range-track-width;
height: $bootstrap-custom-range-track-height;
border-radius: $bootstrap-custom-range-track-border-radius;
border-color: transparent;
background-color: $bootstrap-custom-range-track-bg;
box-shadow: $bootstrap-custom-range-track-box-shadow;
color: transparent;
cursor: $bootstrap-custom-range-track-cursor;
}

&::-moz-range-thumb {
background-color: $bootstrap-custom-range-thumb-disabled-bg;
width: $bootstrap-custom-range-thumb-width;
height: $bootstrap-custom-range-thumb-height;
margin-top: 1rem;
transition: $bootstrap-custom-forms-transition;
border: $bootstrap-custom-range-thumb-border;
border-radius: $bootstrap-custom-range-thumb-border-radius;
background: $bootstrap-custom-range-thumb-bg;
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
appearance: none;

&:active {
background: $bootstrap-custom-range-thumb-active-bg;
}
}

&::-moz-range-track {
cursor: default;
width: $bootstrap-custom-range-track-width;
height: $bootstrap-custom-range-track-height;
border-radius: $bootstrap-custom-range-track-border-radius;
border-color: transparent;
background-color: $bootstrap-custom-range-track-bg;
box-shadow: $bootstrap-custom-range-track-box-shadow;
color: transparent;
cursor: $bootstrap-custom-range-track-cursor;
}

&::-ms-thumb {
background-color: $bootstrap-custom-range-thumb-disabled-bg;
width: $bootstrap-custom-range-thumb-width;
height: $bootstrap-custom-range-thumb-height;
margin-top: 0;
margin-right: $bootstrap-custom-range-thumb-focus-box-shadow-width;
margin-left: $bootstrap-custom-range-thumb-focus-box-shadow-width;
transition: $bootstrap-custom-forms-transition;
border: $bootstrap-custom-range-thumb-border;
border-radius: $bootstrap-custom-range-thumb-border-radius;
background: $bootstrap-custom-range-thumb-bg;
box-shadow: $bootstrap-custom-range-thumb-box-shadow;
appearance: none;

&:active {
background: $bootstrap-custom-range-thumb-active-bg;
}
}

&::-ms-track {
width: $bootstrap-custom-range-track-width;
height: $bootstrap-custom-range-track-height;
border-width: $bootstrap-custom-range-thumb-height / 2;
border-color: transparent;
background-color: transparent;
box-shadow: $bootstrap-custom-range-track-box-shadow;
color: transparent;
cursor: $bootstrap-custom-range-track-cursor;
}

&::-ms-fill-lower {
border-radius: $bootstrap-custom-range-track-border-radius;
background-color: $bootstrap-custom-range-track-bg;
}

&::-ms-fill-upper {
margin-right: 15px;
border-radius: $bootstrap-custom-range-track-border-radius;
background-color: $bootstrap-custom-range-track-bg;
}

&:disabled {
&::-webkit-slider-thumb {
background-color: $bootstrap-custom-range-thumb-disabled-bg;
}

&::-webkit-slider-runnable-track {
cursor: default;
}

&::-moz-range-thumb {
background-color: $bootstrap-custom-range-thumb-disabled-bg;
}

&::-moz-range-track {
cursor: default;
}

&::-ms-thumb {
background-color: $bootstrap-custom-range-thumb-disabled-bg;
}
}
}
}
Expand Down

0 comments on commit 1afddc0

Please sign in to comment.