alois/OpenFrontIO
1
0
Fork 0
mirror of https://github.com/openfrontio/OpenFrontIO.git synced 2026-06-30 19:02:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add footer with navigation links and copyright

Browse Source
This commit is contained in:
q8gazy
2025-02-09 08:25:13 +03:00
parent 4f4b6adb80
commit 874a8927b7
1 changed files with 35 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/client/index.html
+35 -32
View File
@@ -77,11 +77,13 @@
</head>
<body
class="h-full overflow-hidden select-none font-sans min-h-screen bg-opacity-0 bg-cover bg-center bg-fixed transition-opacity duration-300 ease-in-out"
class="h-full select-none font-sans min-h-screen bg-opacity-0 bg-cover bg-center bg-fixed transition-opacity duration-300 ease-in-out flex flex-col"
>
<!-- Main container with responsive padding -->
<!-- Logo section remains the same -->
<div class="container mx-auto px-4 sm:px-6 lg:px-8 py-4 sm:py-6 lg:py-8">
<div
class="container mx-auto px-4 sm:px-6 lg:px-8 py-4 sm:py-6 lg:py-8 flex-grow"
>
<img
src="../../resources/images/OpenFrontLogo.svg"
alt="OpenFront.io"
@@ -130,36 +132,6 @@
Single Player
</button>
</div>
<!-- Links section -->
<div class="flex justify-center mt-4">
<a
href="https://discord.gg/k22YrnAzGp"
id="discord-link"
target="_blank"
rel="noopener noreferrer"
class="flex items-center justify-center px-6 py-2 bg-blue-200 hover:bg-blue-200 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-300 ease-in-out mx-2"
>
<img
src="../../resources/images/DiscordIcon.svg"
alt="Discord"
class="w-12 h-12"
/>
</a>
<a
href="https://youtu.be/jvHEvbko3uw?si=znspkP84P76B1w5I"
id="yt-link"
target="_blank"
rel="noopener noreferrer"
class="flex items-center justify-center px-2 py-0 bg-blue-200 hover:bg-blue-200 rounded-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-300 ease-in-out mx-2"
>
<img
src="../../resources/images/QuestionMarkIcon.svg"
alt="Question Mark"
class="mt-4 w-20 h-20"
/>
</a>
</div>
</div>
<!-- Game components -->
@@ -200,6 +172,37 @@
</div>
</div>
<!-- Footer section -->
<div class="w-full bg-gray-900/80 backdrop-blur-md py-4">
<div
class="max-w-7xl mx-auto px-4 flex justify-between items-center text-white sm:flex-row flex-col sm:gap-0 gap-4"
>
<div class="flex sm:flex-row flex-col sm:gap-8 gap-2">
<a
href="https://youtu.be/jvHEvbko3uw?si=znspkP84P76B1w5I"
class="text-white/70 hover:text-white transition-colors duration-300"
target="_blank"
>How to Play</a
>
<a
href="https://discord.gg/k22YrnAzGp"
class="text-white/70 hover:text-white transition-colors duration-300"
target="_blank"
>Discord</a
>
</div>
<div class="text-white/70">
© 2025
<a
href="https://github.com/openfrontio/OpenFrontIO"
class="hover:text-white transition-colors duration-300"
target="_blank"
>OpenFront.io</a
>.
</div>
</div>
</div>
<!-- Scripts -->
<script>
// Remove preload class after everything is loaded