|
|
@@ -0,0 +1,99 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Tux World</title>
|
|
|
+ <meta name="description" content="A Minecraft server where we have lots of fun!">
|
|
|
+ <link rel="icon" type="image/png" href="/images/logo.png" />
|
|
|
+ <link rel="apple-touch-icon" sizes="180x180" href="/images/logo.png">
|
|
|
+ <meta name="robots" content="index">
|
|
|
+ <link href="css/styles.css" rel="stylesheet">
|
|
|
+ <link href="css/tailwind.min.css" rel="stylesheet">
|
|
|
+ <link href="https://fonts.googleapis.com/css2?family=Jost:wght@400;500;700&display=swap" rel="stylesheet">
|
|
|
+ <meta name="theme-color" content="#272727">
|
|
|
+ <meta property="og:title" content="Tux world- Minecraft Server">
|
|
|
+ <meta property="og:description" content="A Minecraft server for tux army members!">
|
|
|
+ <meta property="og:image" content="images/android-chrome-192x192.png">
|
|
|
+ <meta property="og:url" content="https://tuxworld.nl"> </head>
|
|
|
+
|
|
|
+<body style="min-height:100vh;">
|
|
|
+ <nav class="flex items-center justify-between flex-wrap bg-transparent p-6">
|
|
|
+ <a href="/">
|
|
|
+ <div class="flex items-center flex-shrink-0 text-white mr-6 select-none"> <img src="images/logo.png" class="mr-4 rounded shadow" width="30px" alt="Moonrise MC"> <span class="font-semibold text-xl tracking-tight hidden md:block" id="serverLogoName">Tux World</span> </div>
|
|
|
+ </a>
|
|
|
+ <div class="block flex-grow flex items-center w-auto"> </div>
|
|
|
+ <div id="serverStatus" class="text-gray-200 hidden md:block cursor-pointer"></div>
|
|
|
+ <div class="block md:hidden">
|
|
|
+ <div id="serverStatusM" class="text-gray-200 py-2 md:py-4"></div>
|
|
|
+ </div>
|
|
|
+ <script>
|
|
|
+ document.getElementById("serverStatus").innerHTML = "Loading..."; document.getElementById("serverStatusM").innerHTML = "Loading...";
|
|
|
+ </script>
|
|
|
+ </nav>
|
|
|
+ <div class="flex flex-wrap md:flex-row-reverse justify-center items-center text-center py-4">
|
|
|
+ <div class="w-full lg:w-1/2">
|
|
|
+ <h1 class="text-4xl text-gray-100 pt-12 lg:pt-0">Tux World</h1>
|
|
|
+ <h2 class="text-2xl text-gray-200 pt-6" id="serverVer">Minecraft Server</h2>
|
|
|
+ <div class="rounded overflow-hidden w-full sm:w-4/5 md:w-3/4 mx-auto mt-10 mb-6">
|
|
|
+ <div class="px-6 py-4">
|
|
|
+ <div class="text-sm font-thin -mb-3" id="serverPlaynow"> <span class="inline-block bg-yellow-500 rounded-full px-3 py-1 text-sm font-thin uppercase text-gray-900 mr-2 shadow-lg">Play Now</span> </div>
|
|
|
+ <p class="text-gray-100 text-base bg-green-900 rounded py-6 px-3 sm:text-xl md:text-2xl font-mono overflow-hidden select-all" id="serverIP" data-clipboard-text="tuxworld.nl">IP: tuxworld.nl </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+<button id="openWorldMapModal" class="w-4/5 md:w-1/2 xl:w-1/3 mb-2 bg-green-800 hover:bg-teal-800 text-gray-300 hover:text-gray py-3 px-4 text-lg rounded transition duration-200">
|
|
|
+ <span>🌍 World Map</span>
|
|
|
+</button>
|
|
|
+ <a href="https://link.yixboost.dev/jointuxworld" rel="noopener"> <button class="w-4/5 md:w-1/2 xl:w-1/3 mb-2 bg-gray-800 hover:bg-teal-800 text-gray-300 hover:text-gray py-3 px-4 text-lg rounded transition duration-200 ccdiscordjoinpre"> <span class="ccdiscordjoin">Join our Discord to get access</span> </button> </a>
|
|
|
+ <section class="py-12 text-gray-100">
|
|
|
+ <div id="playerCards" class="flex flex-wrap justify-center gap-4">
|
|
|
+ </div>
|
|
|
+</section>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+<div id="worldMapModal" class="fixed inset-0 bg-black bg-opacity-90 hidden z-50 flex flex-col opacity-0 transition-opacity duration-300">
|
|
|
+ <div class="flex justify-between items-center p-4 bg-green-900">
|
|
|
+ <span class="text-gray-100 font-bold text-lg">World Map</span>
|
|
|
+ <button id="closeModal" class="text-gray-200 text-2xl font-bold">×</button>
|
|
|
+ </div>
|
|
|
+ <iframe id="worldMapIframe" src="https://map.tuxworld.nl" class="flex-1 w-full border-0" allowfullscreen></iframe>
|
|
|
+</div>
|
|
|
+
|
|
|
+<script>
|
|
|
+const openBtn = document.getElementById("openWorldMapModal");
|
|
|
+const modal = document.getElementById("worldMapModal");
|
|
|
+const closeBtn = document.getElementById("closeModal");
|
|
|
+
|
|
|
+function openModal() {
|
|
|
+ modal.classList.remove("hidden");
|
|
|
+ setTimeout(() => {
|
|
|
+ modal.classList.remove("opacity-0");
|
|
|
+ }, 10);
|
|
|
+}
|
|
|
+
|
|
|
+function closeModal() {
|
|
|
+ modal.classList.add("opacity-0");
|
|
|
+ setTimeout(() => {
|
|
|
+ modal.classList.add("hidden");
|
|
|
+ }, 300);
|
|
|
+}
|
|
|
+
|
|
|
+openBtn.addEventListener("click", openModal);
|
|
|
+closeBtn.addEventListener("click", closeModal);
|
|
|
+
|
|
|
+modal.addEventListener("click", (e) => {
|
|
|
+ if (e.target === modal) closeModal();
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+ <script src="js/clipboard.min.js"></script>
|
|
|
+ <div id="snackbar" class="text-gray-100 bg-green-900 p-3 rounded shadow-xl">Copied!</div>
|
|
|
+ <script type="text/javascript" src="js/clipboard.js"></script>
|
|
|
+ <div class="layoutfooter w-full pb-8 text-center transition duration-200 text-white"> <a href="https://yixboost.dev" target="_blank">Powered by Yixboost NL</a></div>
|
|
|
+ <script type="text/javascript" src="js/serverstatus-home.js"></script>
|
|
|
+</body>
|
|
|
+
|
|
|
+</html>
|
