草原探险用户端 v1.0

index.html

@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+  <title>SDF1玩家商城</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;500;700&family=Noto+Sans+SC:wght@300;400;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="css/style.css">
+</head>
+<body>
+
+  <!-- 启动闪屏 -->
+  <div id="splash" class="splash">
+    <div class="splash-inner">
+      <div class="splash-icon">
+        <svg viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
+          <rect width="80" height="80" rx="18" fill="#1a1a2e"/>
+          <path d="M24 28L40 20L56 28V52L40 60L24 52V28Z" stroke="#c9a44a" stroke-width="2.5" fill="none"/>
+          <path d="M40 20V60" stroke="#c9a44a" stroke-width="1.5" opacity="0.5"/>
+          <path d="M24 28L56 52" stroke="#c9a44a" stroke-width="1" opacity="0.3"/>
+          <path d="M56 28L24 52" stroke="#c9a44a" stroke-width="1" opacity="0.3"/>
+          <circle cx="40" cy="40" r="6" fill="#c9a44a" opacity="0.9"/>
+          <circle cx="40" cy="40" r="3" fill="#0a0a0a"/>
+        </svg>
+      </div>
+      <h1 class="splash-title">SDF1</h1>
+      <p class="splash-sub">玩家商城</p>
+      <div class="splash-loader">
+        <div class="loader-bar"></div>
+      </div>
+    </div>
+  </div>
+
+  <!-- 网络错误页 -->
+  <div id="error-page" class="error-page hidden">
+    <div class="error-inner">
+      <svg class="error-icon" viewBox="0 0 64 64" fill="none">
+        <circle cx="32" cy="32" r="28" stroke="#c9a44a" stroke-width="2" opacity="0.3"/>
+        <path d="M22 22L42 42M42 22L22 42" stroke="#c9a44a" stroke-width="2.5" stroke-linecap="round"/>
+      </svg>
+      <h2>无法连接</h2>
+      <p>请检查网络连接后重试</p>
+      <button id="retry-btn" class="retry-btn">重新连接</button>
+    </div>
+  </div>
+
+  <!-- 主 WebView 容器 -->
+  <div id="webview-container" class="webview-container hidden">
+    <web-view id="main-webview" src="https://caoyuan.ypshidifu.cn/plugin/player.php"></web-view>
+  </div>
+
+  <!-- 底部导航栏（备用） -->
+  <nav id="bottom-bar" class="bottom-bar hidden">
+    <button class="bar-btn active" data-action="home">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
+        <polyline points="9 22 9 12 15 12 15 22"/>
+      </svg>
+      <span>首页</span>
+    </button>
+    <button class="bar-btn" data-action="refresh">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <polyline points="23 4 23 10 17 10"/>
+        <path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/>
+      </svg>
+      <span>刷新</span>
+    </button>
+    <button class="bar-btn" data-action="back">
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <polyline points="15 18 9 12 15 6"/>
+      </svg>
+      <span>返回</span>
+    </button>
+  </nav>
+
+  <script src="js/app.js"></script>
+</body>
+</html>