Update index.html

RamWorks-Development-Group · May 9, 2024 · 2774d65 · 2774d65
1 parent 4b8421d
commit 2774d65
Showing 1 changed file with 63 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -63,6 +63,38 @@
       background-color: #ff3333;
     }
 
+    .twitch-button {
+      display: inline-block;
+      padding: 12px 24px;
+      background-color: #6441A4;
+      color: #fff;
+      text-decoration: none;
+      border-radius: 4px;
+      font-size: 18px;
+      transition: background-color 0.3s ease;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+    }
+
+    .twitch-button:hover {
+      background-color: #8C5FAF;
+    }
+
+    .contact-button {
+      display: inline-block;
+      padding: 12px 24px;
+      background-color: #007BFF;
+      color: #fff;
+      text-decoration: none;
+      border-radius: 4px;
+      font-size: 18px;
+      transition: background-color 0.3s ease;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+    }
+
+    .contact-button:hover {
+      background-color: #0056b3;
+    }
+
     .tab {
       display: inline-block;
       margin: 0 10px;
@@ -117,14 +149,42 @@
       margin-top: 40px;
     }
   </style>
+  <script>
+    function copyToClipboard(text) {
+      const textarea = document.createElement('textarea');
+      textarea.value = text;
+      document.body.appendChild(textarea);
+      textarea.select();
+      document.execCommand('copy');
+      document.body.removeChild(textarea);
+      alert('Email copied to clipboard: ' + text);
+    }
+  </script>
 </head>
 <body>
   <div class="logo">
     <img src="image1.png" alt="Logo" width="600">
   </div>
   <h1>Website Under Construction</h1>
-  <p>We are currently working on our website. Please check back later!</p>
-  <a class="github-button" href="https://github.com/RamWorks-Development-Group/RamHub" target="_blank">Visit GitHub</a>
-  <a class="youtube-button" href="https://www.youtube.com/@Ram_Networks" target="_blank">Visit YouTube</a>
+  <p>Sorry for the inconvenience. We are currently working on our website and will be back soon!</p>
+  <a href="https://github.com" class="github-button">GitHub</a>
+  <a href="https://youtube.com" class="youtube-button">YouTube</a>
+  <a href="https://twitch.tv" class="twitch-button">Twitch</a>
+  <button class="contact-button" onclick="copyToClipboard('[email protected]')">Contact Us</button>
+
+  <script>
+    const tabs = document.querySelectorAll('.tab');
+    const contents = document.querySelectorAll('.content');
+
+    tabs.forEach((tab, index) => {
+      tab.addEventListener('click', () => {
+        tabs.forEach((tab) => tab.classList.remove('active'));
+        contents.forEach((content) => content.classList.remove('active'));
+
+        tab.classList.add('active');
+        contents[index].classList.add('active');
+      });
+    });
+  </script>
 </body>
 </html>