acud/es/style/index.css

acg react 组件库

/* 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;
  }
}