yu.css.ui/css/component/loading.css

纯CSS通用UI模块和组件

.yu-loading {
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, SimSun, sans-serif;
  font-size: 12px;
  color: #606266;
  margin-right: 8px;
  text-align: center; }
  .yu-loading.primary {
    color: #409EFF; }
  .yu-loading.success {
    color: #67C23A; }
  .yu-loading.warning {
    color: #fecf20; }
  .yu-loading.info {
    color: #909399; }
  .yu-loading.danger {
    color: #F56C6C; }
  .yu-loading.inline {
    display: inline-block; }
    .yu-loading.inline > p {
      display: inline-block;
      font-size: 14px; }
  .yu-loading.large {
    height: 32px;
    font-size: 16px; }
    .yu-loading.large i {
      font-size: 22px; }
  .yu-loading.big {
    height: 36px;
    font-size: 18px; }
    .yu-loading.big i {
      font-size: 24px; }
  .yu-loading i.loading {
    display: inline-block;
    animation: loading 2s linear infinite; }

@keyframes loading {
  0% {
    transform: rotate(0); }
  100% {
    transform: rotate(360deg); } }
  .yu-loading i.icon-circle-loading.loading {
    animation: loading 1s linear infinite; }
  .yu-loading.left {
    text-align: left; }
  .yu-loading.right {
    text-align: right; }
  .yu-loading.center {
    text-align: center; }