77 lines
3.2 KiB
HTML
77 lines
3.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
|
|
<meta name="theme-color" content="#003D6B" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-title" content="TheBet365" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
<link rel="icon" type="image/png" href="/logo.png" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<link rel="apple-touch-icon" href="/logo.png" />
|
|
<link rel="manifest" href="/site.webmanifest" />
|
|
<title>TheBet365</title>
|
|
<style>
|
|
html, body { margin: 0; padding: 0; height: 100%; background: #F5F7FA; }
|
|
#app-loading {
|
|
position: fixed;
|
|
inset: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #F5F7FA;
|
|
z-index: 9999;
|
|
}
|
|
#app-loading svg {
|
|
width: 48px;
|
|
height: 48px;
|
|
animation: gs-spin 0.8s linear infinite;
|
|
}
|
|
@keyframes gs-spin {
|
|
to { transform: rotate(360deg); }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="app-loading">
|
|
<svg viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<linearGradient id="gs-track" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="#003D6B" stop-opacity="0.18" />
|
|
<stop offset="50%" stop-color="#005B9F" stop-opacity="0.25" />
|
|
<stop offset="100%" stop-color="#003D6B" stop-opacity="0.18" />
|
|
</linearGradient>
|
|
<linearGradient id="gs-arc" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" stop-color="#E8F4FD" />
|
|
<stop offset="22%" stop-color="#7CB9E8" />
|
|
<stop offset="50%" stop-color="#005B9F" />
|
|
<stop offset="78%" stop-color="#003D6B" />
|
|
<stop offset="100%" stop-color="#002847" />
|
|
</linearGradient>
|
|
<filter id="gs-glow">
|
|
<feGaussianBlur stdDeviation="1.2" result="blur" />
|
|
<feMerge>
|
|
<feMergeNode in="blur" />
|
|
<feMergeNode in="SourceGraphic" />
|
|
</feMerge>
|
|
</filter>
|
|
<radialGradient id="gs-dot" cx="50%" cy="50%" r="50%">
|
|
<stop offset="0%" stop-color="#E8F4FD" />
|
|
<stop offset="60%" stop-color="#7CB9E8" />
|
|
<stop offset="100%" stop-color="#005B9F" />
|
|
</radialGradient>
|
|
</defs>
|
|
<circle cx="24" cy="24" r="20" stroke="url(#gs-track)" stroke-width="3" fill="none" />
|
|
<circle cx="24" cy="24" r="20" stroke="url(#gs-arc)" stroke-width="3" fill="none" stroke-linecap="round" stroke-dasharray="31.4 94.2" filter="url(#gs-glow)" />
|
|
<circle cx="24" cy="4" r="2.5" fill="url(#gs-dot)" filter="url(#gs-glow)">
|
|
<animate attributeName="r" values="2.5;3.2;2.5" dur="1.2s" repeatCount="indefinite" />
|
|
</circle>
|
|
</svg>
|
|
</div>
|
|
<div id="app"></div>
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html> |