UNPKG

acud

Version:

acg react 组件库

691 lines (690 loc) • 14.6 kB
/* color */ /* 默认颜色 */ /* 通用-icon */ /* 标签 */ /* 默认颜色 */ /* 其他颜色 */ /* 通用 */ /* 水平 */ /* 垂直 */ /* 序号水平 */ /* 序号垂直 */ /** * @file global style for acud pages * @author [author] */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { margin: 0; padding: 0; } ul, ol { list-style: none; } a { text-decoration: none; } [class*=acud-], [class*=acud-] *, [class*=acud-]:after, [class*=acud-]:before { box-sizing: border-box; } .acud-slide-up-enter, .acud-slide-up-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-up-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-up-enter.acud-slide-up-enter-active, .acud-slide-up-appear.acud-slide-up-appear-active { animation-name: acudSlideUpIn; animation-play-state: running; } .acud-slide-up-leave.acud-slide-up-leave-active { animation-name: acudSlideUpOut; animation-play-state: running; pointer-events: none; } .acud-slide-up-enter, .acud-slide-up-appear { opacity: 0; animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1); } .acud-slide-up-leave { animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } .acud-slide-down-enter, .acud-slide-down-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-down-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-down-enter.acud-slide-down-enter-active, .acud-slide-down-appear.acud-slide-down-appear-active { animation-name: acudSlideDownIn; animation-play-state: running; } .acud-slide-down-leave.acud-slide-down-leave-active { animation-name: acudSlideDownOut; animation-play-state: running; pointer-events: none; } .acud-slide-down-enter, .acud-slide-down-appear { opacity: 0; animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1); } .acud-slide-down-leave { animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } .acud-slide-left-enter, .acud-slide-left-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-left-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-left-enter.acud-slide-left-enter-active, .acud-slide-left-appear.acud-slide-left-appear-active { animation-name: acudSlideLeftIn; animation-play-state: running; } .acud-slide-left-leave.acud-slide-left-leave-active { animation-name: acudSlideLeftOut; animation-play-state: running; pointer-events: none; } .acud-slide-left-enter, .acud-slide-left-appear { opacity: 0; animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1); } .acud-slide-left-leave { animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } .acud-slide-right-enter, .acud-slide-right-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-right-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-slide-right-enter.acud-slide-right-enter-active, .acud-slide-right-appear.acud-slide-right-appear-active { animation-name: acudSlideRightIn; animation-play-state: running; } .acud-slide-right-leave.acud-slide-right-leave-active { animation-name: acudSlideRightOut; animation-play-state: running; pointer-events: none; } .acud-slide-right-enter, .acud-slide-right-appear { opacity: 0; animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1); } .acud-slide-right-leave { animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } @keyframes acudSlideUpIn { 0% { transform: scaleY(0.8); transform-origin: 0% 0%; opacity: 0; } 100% { transform: scaleY(1); transform-origin: 0% 0%; opacity: 1; } } @keyframes acudSlideUpOut { 0% { transform: scaleY(1); transform-origin: 0% 0%; opacity: 1; } 100% { transform: scaleY(0.8); transform-origin: 0% 0%; opacity: 0; } } @keyframes acudSlideDownIn { 0% { transform: scaleY(0.8); transform-origin: 100% 100%; opacity: 0; } 100% { transform: scaleY(1); transform-origin: 100% 100%; opacity: 1; } } @keyframes acudSlideDownOut { 0% { transform: scaleY(1); transform-origin: 100% 100%; opacity: 1; } 100% { transform: scaleY(0.8); transform-origin: 100% 100%; opacity: 0; } } @keyframes acudSlideLeftIn { 0% { transform: scaleX(0.8); transform-origin: 0% 0%; opacity: 0; } 100% { transform: scaleX(1); transform-origin: 0% 0%; opacity: 1; } } @keyframes acudSlideLeftOut { 0% { transform: scaleX(1); transform-origin: 0% 0%; opacity: 1; } 100% { transform: scaleX(0.8); transform-origin: 0% 0%; opacity: 0; } } @keyframes acudSlideRightIn { 0% { transform: scaleX(0.8); transform-origin: 100% 0%; opacity: 0; } 100% { transform: scaleX(1); transform-origin: 100% 0%; opacity: 1; } } @keyframes acudSlideRightOut { 0% { transform: scaleX(1); transform-origin: 100% 0%; opacity: 1; } 100% { transform: scaleX(0.8); transform-origin: 100% 0%; opacity: 0; } } .acud-zoom-enter, .acud-zoom-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-enter.acud-zoom-enter-active, .acud-zoom-appear.acud-zoom-appear-active { animation-name: acudZoomIn; animation-play-state: running; } .acud-zoom-leave.acud-zoom-leave-active { animation-name: acudZoomOut; animation-play-state: running; pointer-events: none; } .acud-zoom-enter, .acud-zoom-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-enter-prepare, .acud-zoom-appear-prepare { transform: none; } .acud-zoom-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .acud-zoom-big-enter, .acud-zoom-big-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-big-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-big-enter.acud-zoom-big-enter-active, .acud-zoom-big-appear.acud-zoom-big-appear-active { animation-name: acudZoomBigIn; animation-play-state: running; } .acud-zoom-big-leave.acud-zoom-big-leave-active { animation-name: acudZoomBigOut; animation-play-state: running; pointer-events: none; } .acud-zoom-big-enter, .acud-zoom-big-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-big-enter-prepare, .acud-zoom-big-appear-prepare { transform: none; } .acud-zoom-big-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .acud-zoom-big-fast-enter, .acud-zoom-big-fast-appear { animation-duration: 0.1s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-big-fast-leave { animation-duration: 0.1s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-big-fast-enter.acud-zoom-big-fast-enter-active, .acud-zoom-big-fast-appear.acud-zoom-big-fast-appear-active { animation-name: acudZoomBigIn; animation-play-state: running; } .acud-zoom-big-fast-leave.acud-zoom-big-fast-leave-active { animation-name: acudZoomBigOut; animation-play-state: running; pointer-events: none; } .acud-zoom-big-fast-enter, .acud-zoom-big-fast-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-big-fast-enter-prepare, .acud-zoom-big-fast-appear-prepare { transform: none; } .acud-zoom-big-fast-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .acud-zoom-up-enter, .acud-zoom-up-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-up-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-up-enter.acud-zoom-up-enter-active, .acud-zoom-up-appear.acud-zoom-up-appear-active { animation-name: acudZoomUpIn; animation-play-state: running; } .acud-zoom-up-leave.acud-zoom-up-leave-active { animation-name: acudZoomUpOut; animation-play-state: running; pointer-events: none; } .acud-zoom-up-enter, .acud-zoom-up-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-up-enter-prepare, .acud-zoom-up-appear-prepare { transform: none; } .acud-zoom-up-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .acud-zoom-down-enter, .acud-zoom-down-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-down-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-down-enter.acud-zoom-down-enter-active, .acud-zoom-down-appear.acud-zoom-down-appear-active { animation-name: acudZoomDownIn; animation-play-state: running; } .acud-zoom-down-leave.acud-zoom-down-leave-active { animation-name: acudZoomDownOut; animation-play-state: running; pointer-events: none; } .acud-zoom-down-enter, .acud-zoom-down-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-down-enter-prepare, .acud-zoom-down-appear-prepare { transform: none; } .acud-zoom-down-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .acud-zoom-left-enter, .acud-zoom-left-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-left-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-left-enter.acud-zoom-left-enter-active, .acud-zoom-left-appear.acud-zoom-left-appear-active { animation-name: acudZoomLeftIn; animation-play-state: running; } .acud-zoom-left-leave.acud-zoom-left-leave-active { animation-name: acudZoomLeftOut; animation-play-state: running; pointer-events: none; } .acud-zoom-left-enter, .acud-zoom-left-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-left-enter-prepare, .acud-zoom-left-appear-prepare { transform: none; } .acud-zoom-left-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } .acud-zoom-right-enter, .acud-zoom-right-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-right-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-zoom-right-enter.acud-zoom-right-enter-active, .acud-zoom-right-appear.acud-zoom-right-appear-active { animation-name: acudZoomRightIn; animation-play-state: running; } .acud-zoom-right-leave.acud-zoom-right-leave-active { animation-name: acudZoomRightOut; animation-play-state: running; pointer-events: none; } .acud-zoom-right-enter, .acud-zoom-right-appear { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1); } .acud-zoom-right-enter-prepare, .acud-zoom-right-appear-prepare { transform: none; } .acud-zoom-right-leave { animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86); } @keyframes acudZoomIn { 0% { transform: scale(0.2); opacity: 0; } 100% { transform: scale(1); opacity: 1; } } @keyframes acudZoomOut { 0% { transform: scale(1); } 100% { transform: scale(0.2); opacity: 0; } } @keyframes acudZoomBigIn { 0% { transform: scale(0.8); opacity: 0; } 100% { transform: scale(1); opacity: 1; } } @keyframes acudZoomBigOut { 0% { transform: scale(1); } 100% { transform: scale(0.8); opacity: 0; } } @keyframes acudZoomUpIn { 0% { transform: scale(0.8); transform-origin: 50% 0%; opacity: 0; } 100% { transform: scale(1); transform-origin: 50% 0%; } } @keyframes acudZoomUpOut { 0% { transform: scale(1); transform-origin: 50% 0%; } 100% { transform: scale(0.8); transform-origin: 50% 0%; opacity: 0; } } @keyframes acudZoomLeftIn { 0% { transform: scale(0.8); transform-origin: 0% 50%; opacity: 0; } 100% { transform: scale(1); transform-origin: 0% 50%; } } @keyframes acudZoomLeftOut { 0% { transform: scale(1); transform-origin: 0% 50%; } 100% { transform: scale(0.8); transform-origin: 0% 50%; opacity: 0; } } @keyframes acudZoomRightIn { 0% { transform: scale(0.8); transform-origin: 100% 50%; opacity: 0; } 100% { transform: scale(1); transform-origin: 100% 50%; } } @keyframes acudZoomRightOut { 0% { transform: scale(1); transform-origin: 100% 50%; } 100% { transform: scale(0.8); transform-origin: 100% 50%; opacity: 0; } } @keyframes acudZoomDownIn { 0% { transform: scale(0.8); transform-origin: 50% 100%; opacity: 0; } 100% { transform: scale(1); transform-origin: 50% 100%; } } @keyframes acudZoomDownOut { 0% { transform: scale(1); transform-origin: 50% 100%; } 100% { transform: scale(0.8); transform-origin: 50% 100%; opacity: 0; } } .acud-fade-enter, .acud-fade-appear { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-fade-leave { animation-duration: 0.2s; animation-fill-mode: both; animation-play-state: paused; } .acud-fade-enter.acud-fade-enter-active, .acud-fade-appear.acud-fade-appear-active { animation-name: acudFadeIn; animation-play-state: running; } .acud-fade-leave.acud-fade-leave-active { animation-name: acudFadeOut; animation-play-state: running; pointer-events: none; } .acud-fade-enter, .acud-fade-appear { opacity: 0; animation-timing-function: linear; } .acud-fade-leave { animation-timing-function: linear; } @keyframes acudFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes acudFadeOut { 0% { opacity: 1; } 100% { opacity: 0; } }