Update index.html

p00pcvm · Jan 5, 2025 · 99cbb9c · 99cbb9c
1 parent ea2c5fa
commit 99cbb9c
Showing 1 changed file with 32 additions and 20 deletions.
diff --git a/index.html b/index.html
@@ -5,6 +5,11 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Conway's Farm of Life - Home</title>
     <style>
+        :root {
+            --background-color: #ffffff;
+            --text-color: #000000;
+            --link-color: #007acc;
+        }
         body {
             font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
             display: flex;
@@ -60,11 +65,6 @@
             margin-top: 20px;
             font-size: 14px;
         }
-        .loading {
-            margin-top: 20px;
-            font-size: 14px;
-            color: #3498db;
-        }
         @media (prefers-color-scheme: dark) {
             :root {
                 --background-color: #121212;
@@ -94,7 +94,7 @@ <h1>Welcome to Conway's Farm of Life</h1>
             <option value="limit">Limit</option>
             <option value="action">Action</option>
         </select>
-        <a href="about.html">About</a>
+        <a href="about.html" aria-label="Learn more about Conway's Farm of Life">About</a>
     </div>
 
     <div class="wallet-container">
@@ -104,6 +104,7 @@ <h1>Connect Your TON Wallet</h1>
         <div class="loading" id="loading" style="display: none;">Connecting...</div>
     </div>
 
+    <!-- Load TON Connect UI script -->
     <script src="https://unpkg.com/@tonconnect/ui@^0.3.0/dist/tonconnect-ui.min.js" onload="initTonConnect()" onerror="handleScriptError()"></script>
     <script>
         function handlePlayOptionChange() {
@@ -124,7 +125,7 @@ <h1>Connect Your TON Wallet</h1>
         }
 
         function handleScriptError() {
-            document.getElementById('status').innerText = 'Failed to load TON Connect script. Please try again later.';
+            document.getElementById('status').innerText = 'Failed to load TON Connect script. Please check your internet connection and try again. If the problem persists, visit our support page for more help.';
         }
 
         function initTonConnect() {
@@ -135,22 +136,33 @@ <h1>Connect Your TON Wallet</h1>
             });
 
             tonConnect.onStatusChange((status) => {
-                document.getElementById('loading').style.display = 'none';
-                if (status.connected) {
-                    document.getElementById('status').innerText = `Connected to ${status.account.address}`;
-                } else if (status.notFound) {
-                    document.getElementById('status').innerText = 'TON provider not found. Please install a TON wallet extension.';
-                } else if (status.error) {
-                    document.getElementById('status').innerText = `Error connecting wallet: ${status.error.message}. Please ensure your TON wallet extension is up to date and properly configured.`;
+                const loadingElement = document.getElementById('loading');
+                const statusElement = document.getElementById('status');
+                if (loadingElement && statusElement) {
+                    loadingElement.style.display = 'none';
+                    if (status.connected) {
+                        statusElement.innerText = `Connected to ${status.account.address}`;
+                    } else if (status.notFound) {
+                        statusElement.innerText = 'TON provider not found. Please install a TON wallet extension.';
+                    } else if (status.error) {
+                        statusElement.innerText = `Error connecting wallet: ${status.error.message}. Please ensure your TON wallet extension is up to date and properly configured.`;
+                    }
                 }
             });
 
-            document.getElementById('connectButton').addEventListener('click', () => {
-                document.getElementById('status').innerText = '';
-                document.getElementById('loading').style.display = 'block';
-                tonConnect.connect();
-            });
+            const connectButton = document.getElementById('connectButton');
+            if (connectButton) {
+                connectButton.addEventListener('click', () => {
+                    const statusElement = document.getElementById('status');
+                    const loadingElement = document.getElementById('loading');
+                    if (statusElement && loadingElement) {
+                        statusElement.innerText = '';
+                        loadingElement.style.display = 'block';
+                        tonConnect.connect();
+                    }
+                });
+            }
         }
     </script>
 </body>
-</html>
+</html>