9 lines
No EOL
18 KiB
CSS
9 lines
No EOL
18 KiB
CSS
/*!
|
|
* # Fomantic-UI 2.8.8 - Toast
|
|
* http://github.com/fomantic/Fomantic-UI/
|
|
*
|
|
*
|
|
* Released under the MIT license
|
|
* http://opensource.org/licenses/MIT
|
|
*
|
|
*/.ui.toast-container{position:fixed;z-index:9999}.ui.toast-container.ui.attached{width:100%;left:0}.ui.toast-container.ui.attached .vertical.attached{border-radius:0}.ui.toast-container.ui.attached.ui.ui .attached.actions .button{border-radius:0}.ui.toast-container.ui.attached .toast-box{margin:0;width:100%;border-radius:0}.ui.toast-container.ui.attached .toast-box>.ui.message,.ui.toast-container.ui.attached .toast-box>.ui.toast{margin-left:0}.ui.toast-container.ui.attached .toast-box.floating,.ui.toast-container.ui.attached .toast-box.hoverfloating:hover{border:none}.ui.toast-container.ui.attached .toast-box>.vertical>.content{-webkit-box-flex:1;-ms-flex:1;flex:1}.ui.toast-container.ui.attached .toast-box>*{width:100%;border-radius:0}.ui.toast-container.ui.attached .toast-box>*>.vertical:not(.actions){-webkit-box-flex:1;-ms-flex:1;flex:1}.ui.toast-container.ui.attached .toast-box>.attached.actions{margin-right:1px}.ui.toast-container.ui.attached.top{top:0}.ui.toast-container.ui.attached.bottom{bottom:0}.ui.toast-container.top.right{top:1em;right:1em;margin-left:1em}.ui.toast-container.top.left{top:1em;left:1em;margin-right:1em}.ui.toast-container.top.center{left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);top:1em}.ui.toast-container.bottom.right{bottom:1em;right:1em;margin-left:1em}.ui.toast-container.bottom.left{bottom:1em;left:1em;margin-right:1em}.ui.toast-container.bottom.center{left:50%;-webkit-transform:translate(-50%,0);transform:translate(-50%,0);bottom:1em}.ui.toast-container .animating.toast-box,.ui.toast-container .toast-box,.ui.toast-container .visible.toast-box{display:table!important}.ui.toast-container.horizontal{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.ui.toast-container.horizontal .toast-box{margin-right:.5em}.ui.toast-container .toast-box{margin-bottom:.5em;border-radius:.33333333rem;cursor:default}.ui.toast-container .toast-box:hover{opacity:1}.ui.toast-container .toast-box:not(.unclickable):hover{cursor:pointer}.ui.toast-container .toast-box.floating,.ui.toast-container .toast-box.hoverfloating:hover{-webkit-box-shadow:0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15);box-shadow:0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15);border:1px solid rgba(34,36,38,.12)}.ui.toast-container .toast-box.compact,.ui.toast-container .toast-box>.compact{width:350px}.ui.toast-container .toast-box>.ui.message,.ui.toast-container .toast-box>.ui.toast{margin:0 -1px -.01em;position:relative}.ui.toast-container .toast-box>.attached.progress{z-index:1}.ui.toast-container .toast-box>.attached.progress.bottom{margin:-.2em -1px -.01em}.ui.toast-container .toast-box>.attached.progress.top{margin:-.01em -1px -.2em}.ui.toast-container .toast-box>.attached.progress .bar{min-width:0}.ui.toast-container .toast-box>.attached.progress.info .bar.bar.bar{background:#12a1bf}.ui.toast-container .toast-box>.attached.progress.warning .bar.bar.bar{background:#cf9b0d}.ui.toast-container .toast-box>.attached.progress.success .bar.bar.bar{background:#15792d}.ui.toast-container .toast-box>.attached.progress.error .bar.bar.bar{background:#9c1a1a}.ui.toast-container .toast-box>.attached.progress.neutral .bar.bar.bar{background:#d9d9d9}.ui.toast-container .toast-box>.ui.message>.close.icon{top:.3em;right:.3em}.ui.toast-container .toast-box>.ui.message>.actions:last-child{margin-bottom:-1em}.ui.toast-container .toast-box>.ui.message.icon{-webkit-box-align:inherit;-ms-flex-align:inherit;align-items:inherit}.ui.toast-container .toast-box>.ui.message.icon>:not(.icon):not(.actions){padding-left:5rem}.ui.toast-container .toast-box>.ui.message.icon>i.icon:not(.close){display:inline-block;position:absolute;width:4rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.ui.toast-container .toast-box>.ui.message.icon:not(.vertical).actions>i.icon:not(.close){top:calc(50% - 1.2em);-webkit-transform:none;transform:none}.ui.toast-container .toast-box>.ui.message.icon:not(.vertical).icon.icon.icon{display:block}.ui.toast-container .toast-box .ui.toast>.close.icon{cursor:pointer;margin:0;opacity:.7;-webkit-transition:opacity .1s ease;transition:opacity .1s ease}.ui.toast-container .toast-box .ui.toast>.close.icon:hover{opacity:1}.ui.toast-container .toast-box .ui.toast.vertical>.close.icon{margin-top:-.3em;margin-right:-.3em}.ui.toast-container .toast-box .ui.toast:not(.vertical)>.close.icon{position:absolute;top:.3em}.ui.toast-container .toast-box .ui.toast:not(.vertical)>.close.icon:not(.left){right:.3em}.ui.toast-container .toast-box .ui.toast:not(.vertical)>.close.icon.left{margin-left:-.3em}.ui.toast-container .toast-box .ui.card{margin:0}.ui.toast-container .toast-box .ui.card.attached:not(.vertical).bottom{border-top-left-radius:0;border-top-right-radius:0}.ui.toast-container .toast-box .ui.card.attached:not(.vertical).bottom.horizontal>.image>img{border-top-left-radius:0}.ui.toast-container .toast-box .ui.card.attached:not(.vertical).bottom.horizontal>.image:last-child>img{border-top-right-radius:0}.ui.toast-container .toast-box .ui.card.attached:not(.vertical).top{border-bottom-left-radius:0;border-bottom-right-radius:0}.ui.toast-container .toast-box .ui.card.attached:not(.vertical).top.horizontal>.image>img{border-bottom-left-radius:0}.ui.toast-container .toast-box .ui.card.attached:not(.vertical).top.horizontal>.image:last-child>img{border-bottom-right-radius:0}.ui.toast-container .toast-box .ui.card.horizontal.actions>.image>img{border-bottom-left-radius:0}.ui.toast-container .toast-box .ui.card.horizontal.actions>.image:last-child>img{border-bottom-right-radius:0}.ui.toast-container .toast-box .progressing{-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-animation-timing-function:linear;animation-timing-function:linear}.ui.toast-container .toast-box .progressing.up{-webkit-animation-name:progressUp;animation-name:progressUp}.ui.toast-container .toast-box .progressing.down{-webkit-animation-name:progressDown;animation-name:progressDown}.ui.toast-container .toast-box .progressing.wait{-webkit-animation-name:progressWait;animation-name:progressWait}.ui.toast-container .toast-box:hover .pausable.progressing{-webkit-animation-play-state:paused;animation-play-state:paused}.ui.toast-container .toast-box .ui.toast:not(.vertical){display:block}.ui.toast-container .toast-box :not(.comment):not(.card) .actions{margin:.5em -1em -1em -1em}.ui.toast-container .toast-box :not(.comment) .actions{padding:.5em .5em .75em .5em;text-align:right}.ui.toast-container .toast-box :not(.comment) .actions.attached:not(.vertical){margin-right:1px}.ui.toast-container .toast-box :not(.comment) .actions:not(.basic):not(.attached){background:rgba(255,255,255,.25);border-top:1px solid rgba(0,0,0,.2)}.ui.toast-container .toast-box :not(.comment) .actions.left{text-align:left}.ui.toast-container .toast-box .vertical.actions>.button,.ui.toast-container .toast-box>.vertical.vertical.vertical,.ui.toast-container .toast-box>.vertical>.vertical.vertical{display:-webkit-box;display:-ms-flexbox;display:flex}.ui.toast-container .toast-box :not(.comment) .vertical.actions{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.ui.toast-container .toast-box :not(.comment) .vertical.actions>.button{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ui.toast-container .toast-box :not(.comment) .vertical.actions.attached>.button{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.ui.toast-container .toast-box :not(.comment) .vertical.actions:not(.attached){border-top:0;margin-top:-.75em;margin-bottom:-.75em;margin-left:1em;-ms-flex-pack:distribute;justify-content:space-around}.ui.toast-container .toast-box :not(.comment) .vertical.actions:not(.attached):not(.basic){border-left:1px solid rgba(0,0,0,.2)}.ui.toast-container .toast-box :not(.comment) .vertical.actions:not(.attached)>.button:not(:last-child){margin-bottom:.3em}.ui.toast-container .toast-box :not(.comment) .vertical.actions:not(.attached).top{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.ui.toast-container .toast-box :not(.comment) .vertical.actions:not(.attached).bottom{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.ui.vertical.attached:not(.left).card>.image>img{border-top-right-radius:0}.ui.vertical.attached:not(.left).card.horizontal>.image:last-child>img{border-top-right-radius:0;border-bottom-right-radius:0}.ui.vertical.attached:not(.left).card,.ui.vertical.attached:not(.left).toast{border-top-right-radius:0;border-bottom-right-radius:0}.ui.vertical.attached:not(.left).actions{border-top-right-radius:.33333333rem;border-bottom-right-radius:.33333333rem}.ui.vertical.attached:not(.left).actions .button:first-child,.ui.vertical.attached:not(.left).actions .button:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.ui.vertical.attached:not(.left).message{border-top-right-radius:0;border-bottom-left-radius:.33333333rem}.ui.vertical.attached.left.card>.image>img{border-top-left-radius:0}.ui.vertical.attached.left.card.horizontal>.image>img{border-top-left-radius:0;border-bottom-left-radius:0}.ui.vertical.attached.left.card,.ui.vertical.attached.left.toast{border-top-left-radius:0;border-bottom-left-radius:0}.ui.vertical.attached.left.actions{border-top-left-radius:.33333333rem;border-bottom-left-radius:.33333333rem}.ui.vertical.attached.left.actions .button:first-child,.ui.vertical.attached.left.actions .button:last-child{border-top-right-radius:0;border-bottom-right-radius:0}.ui.vertical.attached.left.message.message.message{border-top-right-radius:.33333333rem;border-bottom-right-radius:.33333333rem}.ui.attached:not(.vertical):not(.top).actions{border-bottom-left-radius:.33333333rem;border-bottom-right-radius:.33333333rem}.ui.attached:not(.vertical):not(.top).actions .button:first-child{border-bottom-left-radius:.33333333rem}.ui.attached:not(.vertical):not(.top).actions .button:last-child{border-bottom-right-radius:.33333333rem}.ui.attached:not(.vertical).top.actions{border-top-left-radius:.33333333rem;border-top-right-radius:.33333333rem}.ui.attached:not(.vertical).top.actions .button:first-child{border-top-left-radius:.33333333rem}.ui.attached:not(.vertical).top.actions .button:last-child{border-top-right-radius:.33333333rem}.ui.toast{display:none;border-radius:.33333333rem;padding:.91666667em 1.16666667em;margin:0 -1px -.01em;color:rgba(0,0,0,.87);background-color:#fff}.ui.toast>.content>.header{font-weight:700;color:inherit;margin:0}.ui.toast.info{background-color:#31ccec;color:rgba(255,255,255,.9)}.ui.toast.warning{background-color:#f2c037;color:rgba(255,255,255,.9)}.ui.toast.success{background-color:#21ba45;color:rgba(255,255,255,.9)}.ui.toast.error{background-color:#db2828;color:rgba(255,255,255,.9)}.ui.toast.neutral{background-color:#fff;color:rgba(0,0,0,.87)}.ui.toast>i.icon:not(.close){font-size:1.5em}.ui.toast:not(.vertical):not(.centered):not(.center)>i.icon:not(.close){position:absolute}.ui.toast:not(.vertical):not(.centered):not(.center)>.ui.image{position:absolute}.ui.toast:not(.vertical)>i.icon:not(.close)+.content{padding-left:3em}.ui.toast:not(.vertical)>.close.icon+.content{padding-left:1.5em}.ui.toast:not(.vertical)>.ui.image.avatar+.content{padding-left:3em;min-height:2em}.ui.toast:not(.vertical)>.ui.image.mini+.content{padding-left:3.4em;min-height:35px}.ui.toast:not(.vertical)>.ui.image.tiny+.content{padding-left:7em;min-height:80px}.ui.toast:not(.vertical)>.ui.image.small+.content{padding-left:12em;min-height:150px}.ui.toast:not(.vertical):not(.centered):not(.center)>.centered.icon,.ui.toast:not(.vertical):not(.centered):not(.center)>.centered.image{-webkit-transform:translateY(-50%);transform:translateY(-50%);top:50%}.ui.toast:not(.vertical).actions>.centered.image{top:calc(50% - 2em)}.ui.toast:not(.vertical).actions>.centered.icon{top:calc(50% - 1.2em)}.ui.toast.vertical>.close.icon+.content{padding-left:1em}.ui.toast.vertical>.ui.image+.content,.ui.toast.vertical>i.icon:not(.close)+.content{padding-left:1em}.ui.toast.vertical>.ui.image{-ms-flex-item-align:start;align-self:flex-start;-ms-flex-negative:0;flex-shrink:0}.ui.toast.vertical>.centered.icon,.ui.toast.vertical>.centered.image{-ms-flex-item-align:center;align-self:center}.ui.toast.attached.bottom{border-top-left-radius:0;border-top-right-radius:0}.ui.toast.attached.top{border-bottom-left-radius:0;border-bottom-right-radius:0}.ui.hoverfloating.message:hover{-webkit-box-shadow:0 0 0 1px inset,0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15);box-shadow:0 0 0 1px inset,0 2px 4px 0 rgba(34,36,38,.12),0 2px 10px 0 rgba(34,36,38,.15)}.ui.center.toast-container .toast-box,.ui.right.toast-container .toast-box{margin-left:auto}.ui.center.toast-container .toast-box{margin-right:auto}.ui.ui.toast-container .toast-box .center.aligned.toast,.ui.ui.toast-container .toast-box .centered.toast{text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.ui.ui.toast-container .toast-box .center.aligned.toast>.content,.ui.ui.toast-container .toast-box .center.aligned.toast>.ui.image,.ui.ui.toast-container .toast-box .center.aligned.toast>i.icon:not(.close),.ui.ui.toast-container .toast-box .centered.toast>.content,.ui.ui.toast-container .toast-box .centered.toast>.ui.image,.ui.ui.toast-container .toast-box .centered.toast>i.icon:not(.close){-ms-flex-item-align:center;align-self:center}.ui.toast-container .toast-box .toast .center.aligned.content,.ui.toast-container .toast-box .toast .centered.content{text-align:center}.ui.toast-container .toast-box .center.aligned.actions,.ui.toast-container .toast-box .centered.actions{text-align:center}.ui.toast-container .toast-box .center.aligned.actions:not(.attached)>.button:not(.fluid),.ui.toast-container .toast-box .centered.actions:not(.attached)>.button:not(.fluid){margin-left:.25em;margin-right:.25em}.ui.primary.toast{background-color:#6435c9;color:rgba(255,255,255,.9)}.ui.inverted.primary.toast,.ui.toast-container .toast-box>.inverted.primary.attached.progress .bar{background-color:#54c8ff;color:rgba(0,0,0,.87)}.ui.secondary.toast{background-color:#1b1c1d;color:rgba(255,255,255,.9)}.ui.inverted.secondary.toast,.ui.toast-container .toast-box>.inverted.secondary.attached.progress .bar{background-color:#545454;color:rgba(0,0,0,.87)}.ui.red.toast{background-color:#db2828;color:rgba(255,255,255,.9)}.ui.inverted.red.toast,.ui.toast-container .toast-box>.inverted.red.attached.progress .bar{background-color:#ff695e;color:rgba(0,0,0,.87)}.ui.orange.toast{background-color:#f2711c;color:rgba(255,255,255,.9)}.ui.inverted.orange.toast,.ui.toast-container .toast-box>.inverted.orange.attached.progress .bar{background-color:#ff851b;color:rgba(0,0,0,.87)}.ui.yellow.toast{background-color:#fbbd08;color:rgba(255,255,255,.9)}.ui.inverted.yellow.toast,.ui.toast-container .toast-box>.inverted.yellow.attached.progress .bar{background-color:#ffe21f;color:rgba(0,0,0,.87)}.ui.olive.toast{background-color:#b5cc18;color:rgba(255,255,255,.9)}.ui.inverted.olive.toast,.ui.toast-container .toast-box>.inverted.olive.attached.progress .bar{background-color:#d9e778;color:rgba(0,0,0,.87)}.ui.green.toast{background-color:#21ba45;color:rgba(255,255,255,.9)}.ui.inverted.green.toast,.ui.toast-container .toast-box>.inverted.green.attached.progress .bar{background-color:#2ecc40;color:rgba(0,0,0,.87)}.ui.teal.toast{background-color:#00b5ad;color:rgba(255,255,255,.9)}.ui.inverted.teal.toast,.ui.toast-container .toast-box>.inverted.teal.attached.progress .bar{background-color:#6dffff;color:rgba(0,0,0,.87)}.ui.blue.toast{background-color:#2185d0;color:rgba(255,255,255,.9)}.ui.inverted.blue.toast,.ui.toast-container .toast-box>.inverted.blue.attached.progress .bar{background-color:#54c8ff;color:rgba(0,0,0,.87)}.ui.violet.toast{background-color:#6435c9;color:rgba(255,255,255,.9)}.ui.inverted.violet.toast,.ui.toast-container .toast-box>.inverted.violet.attached.progress .bar{background-color:#a291fb;color:rgba(0,0,0,.87)}.ui.purple.toast{background-color:#a333c8;color:rgba(255,255,255,.9)}.ui.inverted.purple.toast,.ui.toast-container .toast-box>.inverted.purple.attached.progress .bar{background-color:#dc73ff;color:rgba(0,0,0,.87)}.ui.pink.toast{background-color:#e03997;color:rgba(255,255,255,.9)}.ui.inverted.pink.toast,.ui.toast-container .toast-box>.inverted.pink.attached.progress .bar{background-color:#ff8edf;color:rgba(0,0,0,.87)}.ui.brown.toast{background-color:#a5673f;color:rgba(255,255,255,.9)}.ui.inverted.brown.toast,.ui.toast-container .toast-box>.inverted.brown.attached.progress .bar{background-color:#d67c1c;color:rgba(0,0,0,.87)}.ui.grey.toast{background-color:#767676;color:rgba(255,255,255,.9)}.ui.inverted.grey.toast,.ui.toast-container .toast-box>.inverted.grey.attached.progress .bar{background-color:#dcddde;color:rgba(0,0,0,.87)}.ui.black.toast{background-color:#1b1c1d;color:rgba(255,255,255,.9)}.ui.inverted.black.toast,.ui.toast-container .toast-box>.inverted.black.attached.progress .bar{background-color:#545454;color:rgba(0,0,0,.87)}.ui.inverted.toast{color:rgba(255,255,255,.9);background-color:#1b1c1d}@media only screen and (max-width:420px){.ui.toast-container .toast-box.toast-box,.ui.toast-container .toast-box>*,.ui.toast-container .toast-box>.compact,.ui.toast-container .toast-box>.vertical>*{width:auto;max-width:100%}.ui.toast-container .toast-box>:not(.vertical){min-width:280px}.ui.toast-container .toast-box>.ui.card.horizontal,.ui.toast-container .toast-box>.vertical>.ui.horizontal.card{min-width:initial}}@-webkit-keyframes progressDown{0%{width:100%}100%{width:0}}@keyframes progressDown{0%{width:100%}100%{width:0}}@-webkit-keyframes progressUp{0%{width:0}100%{width:100%}}@keyframes progressUp{0%{width:0}100%{width:100%}}@-webkit-keyframes progressWait{0%{opacity:1}100%{opacity:0}}@keyframes progressWait{0%{opacity:1}100%{opacity:0}} |