// // Toast Message // -------------------------------------------------- .toast-message-style(@color-bg, @color-border, @color-text) { .shadow-16dp(); background: @color-bg; border: 1px solid @color-border; border-top: none; padding: @alert-padding; color: @color-text; font-size: @font-size-large; .fa { margin-right: @font-size-base / 2; } } .toast-message { position: fixed; top: -100%; width: 100%; z-index: @zindex-modal + 10; text-align: center; font-size: @font-size-large; transition: top 300ms ease; &.visible { top: 0px; transition: top 200ms ease; } .message-success { .toast-message-style(@alert-success-bg, @alert-success-border, @alert-success-text); } .message-info { .toast-message-style(@alert-info-bg, @alert-info-border, @alert-info-text); } .message-warning { .toast-message-style(@alert-warning-bg, @alert-warning-border, @alert-warning-text); } .message-danger { .toast-message-style(@alert-danger-bg, @alert-danger-border, @alert-danger-text); } /* Small devices (tablets, 768px and up) */ @media (min-width: @screen-sm-min) { padding: 0px @padding-large-horizontal; pointer-events: none; p { border-left: none; border-right: none; border-radius: 0px 0px @alert-border-radius @alert-border-radius; display: inline-block; padding: @padding-large-vertical @padding-large-horizontal; font-size: @font-size-base; } } }