meri-design/dist/theme/Message.css

基于vue框架的ui库

/*!
 * @meri-design v2.2.19-beta10
 * (c) 2019-2022 YuShu-Web
 * Released under the MIT License.
 * 2025-01-14 15:25:40
 */.p-message-box{align-items:center;display:flex;flex-flow:column wrap;justify-content:center;left:0;pointer-events:none;position:fixed;text-align:center;top:36px;width:100%;z-index:9000}.fadeDownUpUi-enter-active{animation:fadeInDownUi .3s ease-out}.fadeDownUpUi-leave-active{animation:fadeOutUpUi .3s ease-in}@-moz-keyframes fadeInDownUi{0%{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:translateZ(0)}}@-webkit-keyframes fadeInDownUi{0%{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:translateZ(0)}}@-o-keyframes fadeInDownUi{0%{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:translateZ(0)}}@keyframes fadeInDownUi{0%{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:translateZ(0)}}@-moz-keyframes fadeOutUpUi{0%{opacity:1}to{opacity:0;transform:translate3d(0,-100%,0)}}@-webkit-keyframes fadeOutUpUi{0%{opacity:1}to{opacity:0;transform:translate3d(0,-100%,0)}}@-o-keyframes fadeOutUpUi{0%{opacity:1}to{opacity:0;transform:translate3d(0,-100%,0)}}@keyframes fadeOutUpUi{0%{opacity:1}to{opacity:0;transform:translate3d(0,-100%,0)}}.p-message{align-items:flex-start;border-radius:4px;box-shadow:0 2px 10px rgba(31,35,41,.1);display:flex;justify-content:space-around;max-width:600px;min-height:40px;min-width:240px;padding:8px 8px 8px 12px}.p-message+.p-message{margin-top:24px}.p-message .p-message-hint{font-size:0;line-height:24px}.p-message .p-message-hint svg{height:16px;vertical-align:middle;width:16px}.p-message .p-message-text{word-wrap:break-word;color:#fff;font-size:14px;line-height:24px;padding-left:8px;padding-right:8px;text-align:left;width:100%}.p-message .p-message-close{font-size:0;height:24px;line-height:24px;pointer-events:auto}.p-message .p-message-close svg{cursor:pointer;opacity:.5;transition:opacity .3s;vertical-align:middle;width:12px}.p-message .p-message-close svg:hover{opacity:1}.p-message-info{background-color:#246fe5}.p-message-success{background-color:#3fbe72}.p-message-warning{background-color:#ffcc47}.p-message-error{background-color:#f55047}