diff options
author | Martijn Cuppens <martijn.cuppens@gmail.com> | 2020-11-29 17:22:15 +0300 |
---|---|---|
committer | XhmikosR <xhmikosr@gmail.com> | 2020-12-04 17:15:51 +0300 |
commit | 1f2e600304fc9ac6b0bd98ce5d02ee9048d7791f (patch) | |
tree | ea49c22930eabbab33dbaa9fc004d6b990de25d9 /scss | |
parent | 321ee7a1ad8584c1bfe604b5d16950d6051d52a4 (diff) |
Add toast positioning
Diffstat (limited to 'scss')
-rw-r--r-- | scss/_toasts.scss | 26 | ||||
-rw-r--r-- | scss/_variables.scss | 1 |
2 files changed, 15 insertions, 12 deletions
diff --git a/scss/_toasts.scss b/scss/_toasts.scss index e2b98e6008..7a1cf73548 100644 --- a/scss/_toasts.scss +++ b/scss/_toasts.scss @@ -1,29 +1,31 @@ .toast { - max-width: $toast-max-width; + width: $toast-max-width; + max-width: 100%; @include font-size($toast-font-size); color: $toast-color; + pointer-events: auto; background-color: $toast-background-color; background-clip: padding-box; border: $toast-border-width solid $toast-border-color; box-shadow: $toast-box-shadow; - opacity: 0; @include border-radius($toast-border-radius); - &:not(:last-child) { - margin-bottom: $toast-padding-x; + &:not(.showing):not(.show) { + opacity: 0; } - &.showing { - opacity: 1; + &.hide { + display: none; } +} - &.show { - display: block; - opacity: 1; - } +.toast-container { + width: max-content; + max-width: 100%; + pointer-events: none; - &.hide { - display: none; + > :not(:last-child) { + margin-bottom: $toast-spacing; } } diff --git a/scss/_variables.scss b/scss/_variables.scss index b97e520d7c..d9acaca980 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -1108,6 +1108,7 @@ $toast-border-width: 1px !default; $toast-border-color: rgba(0, 0, 0, .1) !default; $toast-border-radius: $border-radius !default; $toast-box-shadow: $box-shadow !default; +$toast-spacing: $container-padding-x !default; $toast-header-color: $gray-600 !default; $toast-header-background-color: rgba($white, .85) !default; |