wah-su.github.io/index.html

41 lines
No EOL
2.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>wah.su | Homepage</title>
<link rel="stylesheet" href="static/tailwind.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ubuntu+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
</head>
<body class="bg-[#120D0C] text-white ubuntu-mono-regular">
<div class="container flex flex-col justify-between w-full h-[100dvh] p-8 md:p-16">
<img class="absolute inset-0 object-cover w-full h-full blur-sm -z-10" src="static/will-rust-Vv1E0zcQDCI-unsplash.jpg" alt=""/>
<div class="flex flex-col gap-8 lg:items-center lg:justify-between lg:flex-row">
<img class="w-96" src="static/LOGO.svg" alt="wah.su" id="logo" />
<a href="https://status.wah.su" class="flex flex-row items-center justify-center gap-4" target="_blank">
<div class="w-6 h-6 transition ease-in bg-gray-500 rounded-full sm:w-8 sm:h-8 aspect-square duration-400" id="status-icon"></div>
<p class="text-xl sm:text-3xl" id="status-text">Fetching Services Status</p>
</a>
</div>
<div class="flex flex-col-reverse gap-8 lg:flex-row lg:items-end lg:justify-between md:m-0">
<div class="text-lg sm:text-2xl">
<p>Run by <a class="underline hover:text-[#ff851b] transition-colors" href="https://wah.su/radiquum">@radiquum</a></p>
<p>Photo by <a class="underline hover:text-[#ff851b] transition-colors" href="https://unsplash.com/@willrust">Will Rust</a> on <a class="underline hover:text-[#ff851b] transition-colors" href="https://unsplash.com/">Unsplash</a></p>
</div>
<div class="text-2xl lg:text-right">
<p><a class="underline hover:text-[#ff851b] transition-colors" href="https://github.com/wah-su">Github</a></p>
<!-- <p><a class="underline hover:text-[#ff851b] transition-colors" href="https://wah.su">Discord</a></p> -->
<p><a class="underline hover:text-[#ff851b] transition-colors" href="./services.html">View Services</a></p>
<p><a class="underline hover:text-[#ff851b] transition-colors" href="./privacy.html">Privacy Policy</a></p>
<!-- <p>Run by <a class="underline hover:text-[#ff851b] transition-colors" href="https://wah.su/radiquum">@radiquum</a></p> -->
<!-- <p>Photo by <a class="underline hover:text-[#ff851b] transition-colors" href="https://unsplash.com/@willrust">Will Rust</a> on <a class="underline hover:text-[#ff851b] transition-colors" href="https://unsplash.com/">Unsplash</a></p> -->
</div>
</div>
</div>
</body>
</html>