AskaEth
bc8b1ee6c0
- M3 认证/权限/审计/限流 + 全部 REST 接口 - M4 管理面板（MIUIx + 成绩录入/积分榜下钻/大屏控制） - M5a 大屏页面（六页 + 明细覆盖层 + 缩放适配） - M6 WebSocket 实时同步中心 - M7 xlsx 导出 + 赛事包 zip + 备份 - 规则包 YAML 导入导出（差异预览） - 字体 vendor 子集化（4 套 x2 字重） - 集成：realtime/export/rules 接入 main+httpapi；backup 子命令 - 修复：中间件包装 ResponseWriter 丢失 Hijacker，导致 WS 握手 501
72 lines
2.3 KiB
CSS
72 lines
2.3 KiB
CSS
/* ═══════════════════════════════════════════
|
|
MIUIX CONSOLE — Animations
|
|
═══════════════════════════════════════════ */
|
|
|
|
/* ── Entry animations ── */
|
|
@keyframes mx-slide-up{
|
|
from{opacity:0;transform:translateY(16px)}
|
|
to{opacity:1;transform:translateY(0)}
|
|
}
|
|
@keyframes mx-card-in{
|
|
from{opacity:0;transform:scale(0.96) translateY(10px)}
|
|
to{opacity:1;transform:scale(1) translateY(0)}
|
|
}
|
|
@keyframes mx-fade-item{
|
|
from{opacity:0;transform:translateX(-8px)}
|
|
to{opacity:1;transform:translateX(0)}
|
|
}
|
|
@keyframes mx-fade-row{
|
|
from{opacity:0;transform:translateY(4px)}
|
|
to{opacity:1;transform:translateY(0)}
|
|
}
|
|
@keyframes mx-bar-grow{
|
|
from{transform:scaleY(0);opacity:0}
|
|
to{transform:scaleY(1);opacity:1}
|
|
}
|
|
@keyframes mx-pulse{
|
|
0%,100%{opacity:1;transform:scale(1)}
|
|
50%{opacity:0.5;transform:scale(1.3)}
|
|
}
|
|
@keyframes mx-dot-in{
|
|
from{transform:translateX(-50%) scale(0);opacity:0}
|
|
to{transform:translateX(-50%) scale(1);opacity:1}
|
|
}
|
|
@keyframes mx-ripple{
|
|
to{transform:scale(4);opacity:0}
|
|
}
|
|
@keyframes mx-shimmer{
|
|
from{background-position:200% 0}
|
|
to{background-position:-200% 0}
|
|
}
|
|
|
|
/* ── Animation classes ── */
|
|
.mx-anim-slide-up{animation:mx-slide-up var(--mx-d3) var(--mx-ease)}
|
|
.mx-anim-card-in{animation:mx-card-in var(--mx-d3) var(--mx-ease) both}
|
|
.mx-anim-fade-item{animation:mx-fade-item var(--mx-d3) var(--mx-ease) both}
|
|
.mx-anim-fade-row{animation:mx-fade-row var(--mx-d3) var(--mx-ease) both}
|
|
.mx-anim-bar-grow{
|
|
transform-origin:bottom;
|
|
animation:mx-bar-grow var(--mx-d4) var(--mx-ease) both;
|
|
}
|
|
|
|
/* ── Stagger delays ── */
|
|
.mx-delay-0{animation-delay:0ms}
|
|
.mx-delay-1{animation-delay:50ms}
|
|
.mx-delay-2{animation-delay:100ms}
|
|
.mx-delay-3{animation-delay:150ms}
|
|
.mx-delay-4{animation-delay:200ms}
|
|
.mx-delay-5{animation-delay:250ms}
|
|
.mx-delay-6{animation-delay:300ms}
|
|
.mx-delay-7{animation-delay:350ms}
|
|
.mx-delay-8{animation-delay:400ms}
|
|
|
|
/* ── Skeleton loading — dual-layer overlay ── */
|
|
.mx-skeleton{
|
|
background:
|
|
linear-gradient(90deg, transparent 25%, rgba(255,255,255,0.06) 50%, transparent 75%),
|
|
var(--mx-s3);
|
|
background-size:200% 100%, 100% 100%;
|
|
animation:mx-shimmer 1.5s ease-in-out infinite;
|
|
border-radius:var(--mx-r-sm);
|
|
}
|