lzh
58630196f7
Some checks failed
Web UI CI/CD / build-and-deploy (push) Failing after 46m41s
## 描述 将 `cleaning` 开发分支合并到 `master`。 主要改动包括： - 基础前端页面调整为初版设计 `cleaning` 分支中包含了多个开发过程的提交，本次合并计划 **使用 Squash 合并为一次提交**，以保持 `master` 分支历史清晰。 ## 类型 - [ ] Bug 修复（非破坏性修改） - [x] 新功能（非破坏性新增功能） - [ ] 破坏性修改（修改会影响现有功能） - [ ] 需要更新文档 - [x] 除非引入新的测试示例，否则不修改 `pnpm-lock.yaml` Reviewed-on: http://124.221.55.225:3000/XW-AIOT/aiot-platform-ui/pulls/2
117 lines
2.2 KiB
HTML
117 lines
2.2 KiB
HTML
<style data-app-loading="inject-css">
|
|
html {
|
|
/* same as ant-design-vue/dist/reset.css setting, avoid the title line-height changed */
|
|
line-height: 1.15;
|
|
}
|
|
|
|
.loading {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 9999;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background-color: #f4f7f9;
|
|
|
|
/* transition: all 0.8s ease-out; */
|
|
}
|
|
|
|
.loading.hidden {
|
|
visibility: hidden;
|
|
pointer-events: none;
|
|
opacity: 0;
|
|
transition: all 0.8s ease-out;
|
|
}
|
|
|
|
.dark .loading {
|
|
background: #0d0d10;
|
|
}
|
|
|
|
.title {
|
|
margin-top: 66px;
|
|
font-family:
|
|
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
|
|
Arial, sans-serif !important;
|
|
font-size: 28px;
|
|
font-weight: 600 !important;
|
|
color: rgb(0 0 0 / 85%) !important;
|
|
}
|
|
|
|
.dark .title {
|
|
color: #fff !important;
|
|
}
|
|
|
|
.loader {
|
|
position: relative;
|
|
width: 48px;
|
|
height: 48px;
|
|
}
|
|
|
|
.loader::before {
|
|
position: absolute;
|
|
top: 60px;
|
|
left: 0;
|
|
width: 48px;
|
|
height: 5px;
|
|
content: '';
|
|
background: hsl(var(--primary, 37 100% 52%) / 50%);
|
|
border-radius: 50%;
|
|
animation: shadow-ani 0.5s linear infinite;
|
|
}
|
|
|
|
.loader::after {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
content: '';
|
|
background: hsl(var(--primary, 37 100% 52%));
|
|
border-radius: 4px;
|
|
animation: jump-ani 0.5s linear infinite;
|
|
}
|
|
|
|
@keyframes jump-ani {
|
|
15% {
|
|
border-bottom-right-radius: 3px;
|
|
}
|
|
|
|
25% {
|
|
transform: translateY(9px) rotate(22.5deg);
|
|
}
|
|
|
|
50% {
|
|
border-bottom-right-radius: 40px;
|
|
transform: translateY(18px) scale(1, 0.9) rotate(45deg);
|
|
}
|
|
|
|
75% {
|
|
transform: translateY(9px) rotate(67.5deg);
|
|
}
|
|
|
|
100% {
|
|
transform: translateY(0) rotate(90deg);
|
|
}
|
|
}
|
|
|
|
@keyframes shadow-ani {
|
|
0%,
|
|
100% {
|
|
transform: scale(1, 1);
|
|
}
|
|
|
|
50% {
|
|
transform: scale(1.2, 1);
|
|
}
|
|
}
|
|
</style>
|
|
<div class="loading" id="__app-loading__">
|
|
<div class="loader"></div>
|
|
<div class="title"><%= VITE_APP_TITLE %></div>
|
|
</div>
|