/*** UI Messages ***/ #messagestack { position: absolute; bottom: 0.5em; right: 0.5em; z-index: 50000; width: 320px; height: auto; max-height: 85%; overflow-y: auto; @media screen and (max-width: @screen-width-xs) { left: 0.5em; width: auto; } div { &.voice { position: absolute; top: -1000px; } i.icon { font-size: 2em !important; } a:hover { text-decoration: underline; cursor: pointer; } } } .ui.alert { margin: 0; margin-bottom: 0.2em; opacity: 0.95; float: left; width: 100%; padding: 0.75em; & > i.icon:before { &:extend(.font-icon-class); content: @fa-var-info-circle; } &.loading > i.icon:before { content: @fa-var-circle-o-notch; .animated-icon-class; } &.alert-warning > i.icon:before { content: @fa-var-warning; } &.alert-danger > i.icon:before { content: @fa-var-exclamation-circle; } } /* TODO: #message-objects colors, make buttons, icons using ? */ #message-objects div { margin: 0; margin-bottom: 0.2em; width: 100%; padding: 0.75em; &:before { &:extend(.font-icon-class); } &.notice:before { content: @fa-var-info-circle; } &.warning:before { content: @fa-var-warning; } &.error:before { content: @fa-var-exclamation-circle; } }