63 lines
1.4 KiB
HTML
63 lines
1.4 KiB
HTML
<!-- 业务脚本未就绪时使用独立样式；Nuxt 在首个页面解析完成后自动移除此模板。 -->
|
|
<div
|
|
id="console-startup"
|
|
role="status"
|
|
aria-label="页面加载中"
|
|
aria-live="polite"
|
|
>
|
|
<img src="/images/brand/logo.png" alt="破碎工坊云" width="168" height="36" />
|
|
<span class="startup-spinner" aria-hidden="true"></span>
|
|
<p>正在加载控制台</p>
|
|
<noscript>请启用 JavaScript 后刷新页面。</noscript>
|
|
</div>
|
|
<style>
|
|
#console-startup {
|
|
position: fixed;
|
|
inset: 0;
|
|
z-index: 9999;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 24px;
|
|
box-sizing: border-box;
|
|
padding: 24px;
|
|
background: #f8fafc;
|
|
color: #334155;
|
|
font:
|
|
14px/1.5 system-ui,
|
|
sans-serif;
|
|
}
|
|
.app-dark #console-startup {
|
|
background: #18181b;
|
|
color: #e4e4e7;
|
|
}
|
|
#console-startup img {
|
|
width: 168px;
|
|
height: 36px;
|
|
object-fit: contain;
|
|
}
|
|
#console-startup p {
|
|
margin: 0;
|
|
}
|
|
#console-startup .startup-spinner {
|
|
width: 28px;
|
|
height: 28px;
|
|
box-sizing: border-box;
|
|
border: 3px solid #94a3b833;
|
|
border-top-color: #2563eb;
|
|
border-radius: 50%;
|
|
animation: startup-spin 0.8s linear infinite;
|
|
}
|
|
@keyframes startup-spin {
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
@media (prefers-reduced-motion: reduce) {
|
|
#console-startup .startup-spinner {
|
|
animation: none;
|
|
}
|
|
}
|
|
</style>
|