test-nut-ui
Version:
<p align="center"> <img alt="logo" src="https://img11.360buyimg.com/imagetools/jfs/t1/211965/25/7152/22022/61b16785E433119bb/aa41d7a9f7e823f3.png" width="150" style="margin-bottom: 10px;"> </p>
2 lines (1 loc) • 3.71 kB
CSS
@keyframes rotation{0%{-webkit-transform:rotate(0deg)}to{-webkit-transform:rotate(360deg)}}.nut-toast{position:fixed;left:0;top:0;width:100%;height:100%;text-align:center;pointer-events:none;z-index:9999}.nut-toast__overlay-default{--nutui-overlay-bg-color: rgba(0, 0, 0, 0)}.nut-toast-small .nut-toast__inner{font-size:var(--nutui-font-size-1, 12px)}.nut-toast-large .nut-toast__inner{font-size:var(--nutui-font-size-3, 16px)}.nut-toast-cover{display:flex;align-items:center;justify-content:center;pointer-events:none;height:100%;background:var(--nutui-toast-cover-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .65)))}.nut-toast__container{position:absolute;left:50%;top:var(--nutui-toast-inner-top, 50%);transform:translate(-50%,-50%);width:100%}.nut-toast__inner{box-sizing:border-box;display:inline-block;font-size:var(--nutui-toast-text-font-size, 14px);min-width:var(--nutui-toast-inner-min-width, 120px);max-width:var(--nutui-toast-inner-max-width, 210px);text-align:var(--nutui-toast-inner-text-align, "center");padding:var(--nutui-toast-inner-padding, 8px 20px);word-break:break-all;background:var(--nutui-toast-inner-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .65)));border-radius:var(--nutui-toast-inner-border-radius, 4px);color:var(--nutui-toast-font-color, var(--nsui-white-color-1, #FFFFFF))}.nut-toast__inner--row{display:flex;justify-content:center;align-items:center}.nut-toast-center{top:var(--nutui-toast-inner-top, 50%)}.nut-toast-bottom{top:unset;bottom:var(--nutui-toast-position-bottom, 80px);transform:translate(-50%)}.nut-toast-top{top:var(--nutui-toast-position-top, 32px);transform:translate(-50%)}.nut-toast-text{font-size:var(--nutui-toast-text-font-size, 14px);font-weight:var(--nutui-toast-text-font-weight, 400);line-height:var(--nutui-toast-text-line-height, 22px)}.nut-toast-text:empty{margin-bottom:-8px}.nut-toast-title{font-size:var(--nutui-toast-title-font-size, 18px);font-weight:var(--nutui-toast-title-font-weight, 600);line-height:var(--nutui-toast-title-line-height, 28px)}.nut-toast-title:empty{margin-bottom:-8px}.nut-toast-icon{width:var(--nutui-toast-inner-icon-size, 32px);height:var(--nutui-toast-inner-icon-size, 32px);font-size:var(--nutui-toast-inner-icon-size, 32px)}.nut-toast-has-icon .nut-toast__icon-wrapper{width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:8px}.nut-toast-has-icon .nut-toast__inner--row .nut-toast__icon-wrapper{width:auto;margin-bottom:0}.nut-toast-has-icon .nut-toast__inner{padding:var(--nutui-toast-inner-has-title-padding, 14px 20px)}.nut-toast-has-left-icon .nut-toast-icon{width:var(--nutui-toast-inner-left-icon-size, 16px);height:var(--nutui-toast-inner-left-icon-size, 16px);font-size:var(--nutui-toast-inner-left-icon-size, 16px);margin-right:8px}.nut-toast-has-left-icon .nut-toast__inner{padding:var(--nutui-toast-inner-padding, 8px 20px)}.nut-toast-only-icon .nut-toast__inner{min-width:var(--nutui-toast-inner-min-width-only-icon, 64px);padding:var(--nutui-toast-inner-only-icon-padding, 16px 20px)}.nut-toast-only-icon .nut-toast__icon-wrapper{margin-bottom:0}.nut-toast-has-title .nut-toast__inner{padding:var(--nutui-toast-inner-has-title-padding, 14px 20px)}.nut-toast-has-title .nut-toast-title{margin:var(--nutui-toast-inner-has-title-toast-title-margin, 0px 0px 6px 0px)}.nut-toast-loading .nut-toast__inner{display:inline-flex;flex-direction:column;justify-content:center;align-items:center}.nut-toast-loading .nut-toast__icon-wrapper,.nut-toast-icon__loading{animation:rotation 2s linear infinite}.toast-fade-enter-active,.toast-fade-leave-active{transition:opacity .3s}.toast-fade-enter-from,.toast-fade-leave-to{opacity:0}