Fetch the repository succeeded.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>HuLa</title>
<meta
name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
<!-- 🎯 预加载图片资源(仅移动端) -->
<script>
if (/Mobi|Android|iPhone/i.test(navigator.userAgent)) {
const preloadImages = ['/Mobile/1.png', '/Mobile/2.png', '/Mobile/3.png', '/Mobile/4.png']
preloadImages.forEach(src => {
const link = document.createElement('link')
link.rel = 'preload'
link.as = 'image'
link.href = src
document.head.appendChild(link)
})
}
</script>
<!-- iconpark图标库 -->
<script async src="/icon.js"></script>
<!-- 🧩 加载页样式 -->
<style id="loading-css">
#loading-page {
position: fixed;
inset: 0;
z-index: 9999;
background-image: url('/Mobile/2.png');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding-top: env(safe-area-inset-top);
padding-bottom: env(safe-area-inset-bottom);
transition: opacity 0.4s ease-out;
opacity: 1;
}
.bottom-bar {
position: absolute;
bottom: 40px;
display: flex;
gap: 16px;
align-items: center;
}
.rounded-14px {
border-radius: 14px;
}
.size-50px {
width: 50px;
height: 50px;
}
.w-300px {
width: 300px;
}
.h-200px {
height: 200px;
}
.w-78px {
width: 78px;
}
.h-40px {
height: 40px;
}
.mb-140px {
margin-bottom: 140px;
}
</style>
</head>
<body>
<!-- 🚀 加载页 DOM -->
<div id="loading-page">
<img src="/Mobile/4.png" alt="hula" class="w-300px h-200px mb-140px" />
<div class="bottom-bar">
<img src="/Mobile/3.png" alt="hula" class="size-50px rounded-14px" />
<img src="/Mobile/1.png" alt="hula" class="w-78px h-40px" />
</div>
</div>
<!-- Vue 应用挂载点 -->
<div id="app"></div>
<!-- 🎯 加载页逻辑控制(淡出 + 清理) -->
<script>
function isMobileDevice() {
return /Mobi|Android|iPhone/i.test(navigator.userAgent)
}
if (!isMobileDevice()) {
document.getElementById('loading-page')?.remove()
document.getElementById('loading-css')?.remove()
}
window.addEventListener('DOMContentLoaded', () => {
const interval = setInterval(() => {
const isMounted = document.getElementById('app')?.children.length > 0
if (isMounted) {
const loader = document.getElementById('loading-page')
if (loader) {
loader.style.opacity = '0'
setTimeout(() => {
loader.remove()
document.getElementById('loading-css')?.remove()
}, 450) // 等待 transition 完成后再移除
}
clearInterval(interval)
}
}, 100)
})
</script>
<!-- 🚀 Vue 应用入口 -->
<script type="module" src="/src/main.ts"></script>
</body>
</html>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。