/*! * Toastr v1.0 * Copyright 2018 The Wisp X Authors * Link https://gitee.com/wispx * Licensed under the MIT license */ .toastr-container, .toastr-container *, .toastr-container *:before, .toastr-container *:after { box-sizing: border-box; } .toastr-container { position: fixed; z-index: 1121; word-break: break-all; word-wrap: break-word; } .toastr-container .center { left: 50%; transform: translateX(-50%); } .toastr-container.top-left { top: 15px; left: 15px; } .toastr-container.top-center { top: 15px; left: 50%; transform: translateX(-50%); } .toastr-container.top-right { top: 15px; right: 15px; } .toastr-container.right-bottom { right: 15px; bottom: 15px; } .toastr-container.bottom-center { bottom: 15px; left: 50%; transform: translateX(-50%); } .toastr-container.left-bottom { left: 15px; bottom: 15px; } .toastr-container ul { list-style: none; text-align: left; padding: 0; margin: 0; } .toastr-container ul li { position: relative; color: white; cursor: pointer; border-radius: 4px; width: 200px; margin: 0 0 6px; padding: 10px 10px 10px 39px; text-align: left; font-size: 14px; transition: all .3s; box-shadow: 0 0 10px #c3c3c3; } .toastr-container ul li:hover { box-shadow: 0 0 10px #7e7e7e; } .toastr-container ul li:before { position: absolute; font-family: "iconfont"; top: 50%; transform: translateY(-50%); color: white; left: 8px; font-size: 25px; } .toastr-container ul li.lg { font-size: 17px; padding: 15px 15px 15px 44px; } .toastr-container ul li.lg:before { font-size: 30px; } .toastr-container ul li.sm { font-size: 13px; padding: 8px 8px 8px 34px; } .toastr-container ul li.sm:before { font-size: 20px; } .toastr-container ul li.xs { font-size: 12px; padding: 5px 5px 5px 27px; } .toastr-container ul li.xs:before { font-size: 14px; } .toastr-container ul li.toastr-success { background-color: #73b575; } .toastr-container ul li.toastr-success:before { content: "\e69f"; } .toastr-container ul li.toastr-info { background-color: #2f96b4; } .toastr-container ul li.toastr-info:before { content: "\e659"; } .toastr-container ul li.toastr-warning { background-color: #f89406; } .toastr-container ul li.toastr-warning:before { content: "\e627"; } .toastr-container ul li.toastr-error { background-color: #bd362f; } .toastr-container ul li.toastr-error:before { content: "\e677"; } @font-face { font-family: "iconfont"; src: url('iconfont/iconfont.eot?t=1534834882874'); /* IE9*/ src: url('iconfont/iconfont.eot?t=1534834882874#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff'), url('iconfont/iconfont.ttf?t=1534834882874') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/ url('iconfont/iconfont.svg?t=1534834882874#iconfont') format('svg'); /* iOS 4.1- */ } /*@font-face { font-family: 'iconfont'; !* project id 799822 *! src: url('//at.alicdn.com/t/font_799822_gx7p1c2p.eot'); src: url('//at.alicdn.com/t/font_799822_gx7p1c2p.eot?#iefix') format('embedded-opentype'), url('//at.alicdn.com/t/font_799822_gx7p1c2p.woff') format('woff'), url('//at.alicdn.com/t/font_799822_gx7p1c2p.ttf') format('truetype'), url('//at.alicdn.com/t/font_799822_gx7p1c2p.svg#iconfont') format('svg'); }*/ /* fade */ .fade-in, .fade-in-top, .fade-in-right, .fade-in-bottom, .fade-in-left { -webkit-animation: 0.3s ease-out backwards; -moz-animation: 0.3s ease-out backwards; -ms-animation: 0.3s ease-out backwards; animation: 0.3s ease-out backwards; } .fade-out, .fade-out-top, .fade-out-right, .fade-out-bottom, .fade-out-left { -webkit-animation: 0.3s ease-in forwards; -moz-animation: 0.3s ease-in forwards; -ms-animation: 0.3s ease-in forwards; animation: 0.3s ease-in forwards; } /* 淡入 */ .fade-in { -webkit-animation-name: fade-in; -moz-animation-name: fade-in; -ms-animation-name: fade-in; animation-name: fade-in; } /* 淡入-从上 */ .fade-in-top { -webkit-animation-name: fade-in-top; -moz-animation-name: fade-in-top; -ms-animation-name: fade-in-top; animation-name: fade-in-top; } /* 淡入-从右 */ .fade-in-right { -webkit-animation-name: fade-in-right; -moz-animation-name: fade-in-right; -ms-animation-name: fade-in-right; animation-name: fade-in-right; } /* 淡入-从下 */ .fade-in-bottom { -webkit-animation-name: fade-in-bottom; -moz-animation-name: fade-in-bottom; -ms-animation-name: fade-in-bottom; animation-name: fade-in-bottom; } /* 淡入-从左 */ .fade-in-left { -webkit-animation-name: fade-in-left; -moz-animation-name: fade-in-left; -ms-animation-name: fade-in-left; animation-name: fade-in-left; } /* 淡出 */ .fade-out { -webkit-animation-name: fade-out; -moz-animation-name: fade-out; -ms-animation-name: fade-out; animation-name: fade-out; } /* 淡出-向上 */ .fade-out-top { -webkit-animation-name: fade-out-top; -moz-animation-name: fade-out-top; -ms-animation-name: fade-out-top; animation-name: fade-out-top; } /* 淡出-向右 */ .fade-out-right { -webkit-animation-name: fade-out-right; -moz-animation-name: fade-out-right; -ms-animation-name: fade-out-right; animation-name: fade-out-right; } /* 淡出-向下 */ .fade-out-bottom { -webkit-animation-name: fade-out-bottom; -moz-animation-name: fade-out-bottom; -ms-animation-name: fade-out-bottom; animation-name: fade-out-bottom; } /* 淡出-向左 */ .fade-out-left { -webkit-animation-name: fade-out-left; -moz-animation-name: fade-out-left; -ms-animation-name: fade-out-left; animation-name: fade-out-left; } /* 淡入 */ @-webkit-keyframes fade-in { 0% { opacity: 0; } } @-moz-keyframes fade-in { 0% { opacity: 0; } } @-ms-keyframes fade-in { 0% { opacity: 0; } } @keyframes fade-in { 0% { opacity: 0; } } /* 淡入-从上 */ @-webkit-keyframes fade-in-top { 0% { opacity: 0; -webkit-transform: translateY(-100px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fade-in-top { 0% { opacity: 0; -moz-transform: translateY(-100px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-ms-keyframes fade-in-top { 0% { opacity: 0; -ms-transform: translateY(-100px); } 100% { opacity: 1; -ms-transform: translateY(0); } } @keyframes fade-in-top { 0% { opacity: 0; transform: translateY(-100px); } 100% { opacity: 1; transform: translateY(0); } } /* 淡入-从右 */ @-webkit-keyframes fade-in-right { 0% { opacity: 0; -webkit-transform: translateX(100px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fade-in-right { 0% { opacity: 0; -moz-transform: translateX(100px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-ms-keyframes fade-in-right { 0% { opacity: 0; -ms-transform: translateX(100px); } 100% { opacity: 1; -ms-transform: translateX(0); } } @keyframes fade-in-right { 0% { opacity: 0; transform: translateX(100px); } 100% { opacity: 1; transform: translateX(0); } } /* 淡入-从下 */ @-webkit-keyframes fade-in-bottom { 0% { opacity: 0; -webkit-transform: translateY(100px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fade-in-bottom { 0% { opacity: 0; -moz-transform: translateY(100px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-ms-keyframes fade-in-bottom { 0% { opacity: 0; -ms-transform: translateY(100px); } 100% { opacity: 1; -ms-transform: translateY(0); } } @keyframes fade-in-bottom { 0% { opacity: 0; transform: translateY(100px); } 100% { opacity: 1; transform: translateY(0); } } /* 淡入-从左 */ @-webkit-keyframes fade-in-left { 0% { opacity: 0; -webkit-transform: translateX(-100px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fade-in-left { 0% { opacity: 0; -moz-transform: translateX(-100px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-ms-keyframes fade-in-left { 0% { opacity: 0; -ms-transform: translateX(-100px); } 100% { opacity: 1; -ms-transform: translateX(0); } } @keyframes fade-in-left { 0% { opacity: 0; transform: translateX(-100px); } 100% { opacity: 1; transform: translateX(0); } } /* 淡出 */ @-webkit-keyframes fade-out { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fade-out { 0% { opacity: 1; } 100% { opacity: 0; } } @-ms-keyframes fade-out { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fade-out { 0% { opacity: 1; } 100% { opacity: 0; } } /* 淡出-向上 */ @-webkit-keyframes fade-out-top { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-100px); } } @-moz-keyframes fade-out-top { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-100px); } } @-ms-keyframes fade-out-top { 0% { opacity: 1; -ms-transform: translateY(0); } 100% { opacity: 0; -ms-transform: translateY(-100px); } } @keyframes fade-out-top { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-100px); } } /* 淡出-向右 */ @-webkit-keyframes fade-out-right { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(100px); } } @-moz-keyframes fade-out-right { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(100px); } } @-ms-keyframes fade-out-right { 0% { opacity: 1; -ms-transform: translateX(0); } 100% { opacity: 0; -ms-transform: translateX(100px); } } @keyframes fade-out-right { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(100px); } } /* 淡出-向下 */ @-webkit-keyframes fade-out-bottom { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(100px); } } @-moz-keyframes fade-out-bottom { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(100px); } } @-ms-keyframes fade-out-bottom { 0% { opacity: 1; -ms-transform: translateY(0); } 100% { opacity: 0; -ms-transform: translateY(100px); } } @keyframes fade-out-bottom { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(100px); } } /* 淡出-向左 */ @-webkit-keyframes fade-out-left { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-100px); } } @-moz-keyframes fade-out-left { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-100px); } } @-ms-keyframes fade-out-left { 0% { opacity: 1; -ms-transform: translateX(0); } 100% { opacity: 0; -ms-transform: translateX(-100px); } } @keyframes fade-out-left { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-100px); } }