wah.su/wah-su.github.io
1
0
Fork 0
mirror of https://github.com/wah-su/wah-su.github.io.git synced 2025-05-24 21:59:35 +05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Refactor: New Home Page

Browse source
This commit is contained in:
Kentai Radiquum 2024-10-18 02:36:01 +05:00
parent fa94e09a73
commit 3af083c0dd
Signed by: Radiquum
GPG key ID: 858E8EE696525EED
35 changed files with 1952 additions and 442 deletions
Download patch file Download diff file Expand all files Collapse all files

242
index.html
View file

@ -1,134 +1,144 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en" class="bg-page-background">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>wah.su | Homepage</title>
<link href="/public/output.css" rel="stylesheet" />
<link rel="apple-touch-icon" sizes="180x180" href="/public/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/public/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/public/favicon/favicon-16x16.png">
<link rel="manifest" href="/public/favicon/site.webmanifest">
<meta charset="UTF-8">
<meta name="description"
content="Looking for a cozy, reliable den away from tech companies? wah.su is all about providing a safe and stable environment for your projects.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>wah.su | Home</title>
<link rel="stylesheet" href="static/tailwind.css">
<link rel="apple-touch-icon" sizes="180x180" href="static/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="static/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="static/favicon/favicon-16x16.png">
<link rel="manifest" href="static/favicon/site.webmanifest">
<meta name="description" content="Home Page for wah.su.">
<meta name="keywords" content="wah.su, radiquum, invite-only, hosting">
<!-- Twitter Card data -->
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="https://home.wah.su/">
<meta name="twitter:title" content="wah.su | Homepage">
<meta name="twitter:description"
content="Looking for a cozy, reliable den away from tech companies? wah.su is all about providing a safe and stable environment for your projects.">
<meta name="twitter:image" content="https://home.wah.su/public/preview.png">
<meta name="twitter:site" content="https://home.wah.su">
<meta name="twitter:title" content="wah.su | Home">
<meta name="twitter:description" content="Home Page for wah.su.">
<meta name="twitter:image" content="https://home.wah.su/static/preview.png">
<!-- Open Graph data -->
<meta property="og:title" content="wah.su | Homepage" />
<meta property="og:title" content="wah.su | Home" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://home.wah.su/" />
<meta property="og:image" content="https://home.wah.su/public/preview.png" />
<meta property="og:description"
content="Looking for a cozy, reliable den away from tech companies? wah.su is all about providing a safe and stable environment for your projects." />
</head>
<meta property="og:url" content="https://home.wah.su" />
<meta property="og:image" content="https://home.wah.su/static/preview.png" />
<meta property="og:description" content="Home Page for wah.su." />
<body class="light dark:bg-slate-900" id="body">
<header class="top-0 left-0 pt-4 pb-6 shadow-lg bg-slate-50 dark:bg-slate-800">
<div
class="flex flex-col md:flex-row gap-2 md:gap-0 items-center container max-w-[1440px] justify-between px-4">
<div class="self-start"><img src="/public/images/logo-light.svg" alt="wah.su" id="logo" /></div>
<div class="self-start md:self-auto">
<!--noformat-->
<a href="https://status.wah.su" class="flex flex-row items-center gap-2" target="_blank">
<div class="w-4 h-4 transition ease-in bg-gray-500 rounded-full duration-400" id="status-icon"></div>
<p class="dark:text-slate-50" id="status-text">Fetching Services Status</p>
</a>
<!--noformat-->
</div>
<div class="flex flex-row items-center self-start justify-center gap-6 -ml-4">
<label class="inline-flex items-center cursor-pointer">
<span class="mr-4 text-sm font-medium text-gray-900 ms-3 dark:text-gray-300"><svg
class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
viewBox="0 0 24 24">
<path fill-rule="evenodd"
d="M13 3a1 1 0 1 0-2 0v2a1 1 0 1 0 2 0V3ZM6.343 4.929A1 1 0 0 0 4.93 6.343l1.414 1.414a1 1 0 0 0 1.414-1.414L6.343 4.929Zm12.728 1.414a1 1 0 0 0-1.414-1.414l-1.414 1.414a1 1 0 0 0 1.414 1.414l1.414-1.414ZM12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10Zm-9 4a1 1 0 1 0 0 2h2a1 1 0 1 0 0-2H3Zm16 0a1 1 0 1 0 0 2h2a1 1 0 1 0 0-2h-2ZM7.757 17.657a1 1 0 1 0-1.414-1.414l-1.414 1.414a1 1 0 1 0 1.414 1.414l1.414-1.414Zm9.9-1.414a1 1 0 0 0-1.414 1.414l1.414 1.414a1 1 0 0 0 1.414-1.414l-1.414-1.414ZM13 19a1 1 0 1 0-2 0v2a1 1 0 1 0 2 0v-2Z"
clip-rule="evenodd" />
</svg>
</span>
<input type="checkbox" class="sr-only peer" id="theme-toggle">
<div
class="relative w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 dark:peer-focus:ring-blue-800 rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-blue-600">
</div>
<span class="text-sm font-medium text-gray-900 ms-3 dark:text-gray-300"><svg
class="w-6 h-6 text-gray-800 dark:text-white" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
viewBox="0 0 24 24">
<path fill-rule="evenodd"
d="M11.675 2.015a.998.998 0 0 0-.403.011C6.09 2.4 2 6.722 2 12c0 5.523 4.477 10 10 10 4.356 0 8.058-2.784 9.43-6.667a1 1 0 0 0-1.02-1.33c-.08.006-.105.005-.127.005h-.001l-.028-.002A5.227 5.227 0 0 0 20 14a8 8 0 0 1-8-8c0-.952.121-1.752.404-2.558a.996.996 0 0 0 .096-.428V3a1 1 0 0 0-.825-.985Z"
clip-rule="evenodd" />
</svg>
</span>
</label>
<a href="https://auth.wah.su"
class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center inline-flex items-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800">
<svg class="w-6 h-6 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="24"
height="24" fill="currentColor" viewBox="0 0 24 24">
<path fill-rule="evenodd"
d="M4.857 3A1.857 1.857 0 0 0 3 4.857v4.286C3 10.169 3.831 11 4.857 11h4.286A1.857 1.857 0 0 0 11 9.143V4.857A1.857 1.857 0 0 0 9.143 3H4.857Zm10 0A1.857 1.857 0 0 0 13 4.857v4.286c0 1.026.831 1.857 1.857 1.857h4.286A1.857 1.857 0 0 0 21 9.143V4.857A1.857 1.857 0 0 0 19.143 3h-4.286Zm-10 10A1.857 1.857 0 0 0 3 14.857v4.286C3 20.169 3.831 21 4.857 21h4.286A1.857 1.857 0 0 0 11 19.143v-4.286A1.857 1.857 0 0 0 9.143 13H4.857Zm10 0A1.857 1.857 0 0 0 13 14.857v4.286c0 1.026.831 1.857 1.857 1.857h4.286A1.857 1.857 0 0 0 21 19.143v-4.286A1.857 1.857 0 0 0 19.143 13h-4.286Z"
clip-rule="evenodd" />
</svg>
<p class="ml-2">Dashboard</p>
</a>
</div>
</head>
<body class="container flex flex-col gap-8 pb-4 mx-auto sm:pb-8 font-ubuntu">
<header class="px-4 pt-4 sm:px-8 sm:pt-8">
<div class="flex flex-wrap justify-between px-8 py-4 rounded-lg bg-header-background">
<img src="static/LOGO.svg">
<a href="https://status.wah.su" class="flex items-center gap-1">
<div class="relative w-6 h-6 bg-gray-500 rounded-full" id="status-icon">
<div class="absolute inset-0 hidden w-6 h-6 rounded-full bg-inherit animate-ping" id="status-animate"></div>
</div>
<p class="text-2xl text-white" id="status-text">Unknown</p>
</a>
</div>
</header>
<div class="container max-w-[1440px] mt-14 text-center px-4">
<h1 class="text-6xl font-bold text-gray-800 md:text-8xl dark:text-slate-200">Welcome to wah.su!</h1>
<!--noformat-->
<p class="max-w-[840px] mx-auto mt-6 text-gray-700 dark:text-slate-300 text-left w-full">
Looking for a cozy, reliable den away from tech companies? You've come to the right place!
wah.su is all about providing a safe and stable environment for your projects.
</p>
<p class="max-w-[840px] mx-auto mt-6 text-gray-700 dark:text-slate-300 text-left w-full">
Run by yours truly, <a href="https://wah.su/radiquum" class="font-medium text-blue-600 dark:text-blue-500 hover:underline" target="_blank">@radiquum</a>, we believe in quality over quantity, which is why access is currently invite-only.
Interested in joining the pack? Reach out to me to sniff out an invitation.
</p>
<!--noformat-->
</div>
<div class="container max-w-[1440px] mt-16 px-4">
<div class="bg-white rounded-lg shadow dark:bg-gray-800">
<div class="w-full max-w-screen-xl p-4 mb-4">
<h1 class="text-2xl font-bold text-gray-800 dark:text-slate-200">Proudly Hosting</h1>
<h1 class="text-6xl sm:text-8xl font-bold text-center text-[#F9DAD3] px-4 sm:px-8">Welcome to wah.su!</h1>
<section class="flex flex-col flex-wrap gap-8 px-4 sm:px-8 xl:flex-row">
<div class="flex flex-col w-full gap-4 xl:max-w-lg">
<div class="flex flex-col w-full gap-4 px-4 py-4 text-xl text-white rounded-lg sm:px-8 bg-card-background">
<p>Looking for a cozy, reliable den away from tech companies? You've come to the right place! wah.su is all about providing a safe and stable environment for your projects.</p>
<p>Run by yours truly, <a href="https://wah.su/radiquum" class="underline transition-colors hover:text-orange-400">@radiquum</a>, we believe in quality over quantity, which is why access is currently invite-only. Interested in joining the pack? Reach out to me to sniff out an invitation.</p>
</div>
<div class="flex flex-row flex-wrap gap-2 text-white xl:flex-col">
<a class="flex items-center flex-1 gap-2 px-4 py-2 text-2xl transition-colors rounded-lg sm:px-8 sm:text-4xl bg-button-background hover:bg-orange-700" href="https://auth.wah.su"><span class="icon-[mage--dashboard-2-fill] w-8 h-8"></span>Dashboard</a>
<a class="flex items-center w-full gap-2 px-4 py-2 text-2xl transition-colors rounded-lg sm:px-8 sm:text-4xl xl:w-full md:w-fit bg-button-background hover:bg-orange-700" href="/privacy"><span class="icon-[mage--shield-check-fill] w-8 h-8"></span>Privacy Policy</a>
<div class="flex items-center w-full gap-2 px-4 py-2 bg-white rounded-full sm:px-8 xl:mt-2 lg:max-w-fit">
<a href="https://github.com/wah-su" class="w-10 h-10"><span class="icon-[flowbite--github-solid] w-[inherit] h-[inherit] bg-black hover:bg-button-background transition-colors"></span></a>
<!-- <a href="https://github.com/wah-su" class="w-10 h-10"><span class="icon-[mdi--minecraft] w-[inherit] h-[inherit] bg-black hover:bg-button-background transition-colors"></span></a> -->
<!-- <a href="https://home.wah.su/blog" class="flex items-center text-2xl text-white transition-opacity opacity-90 hover:opacity-100"><span class="icon-[mdi--rss] w-10 h-10 bg-white"></span> blog</a> -->
</div>
</div>
</div>
<div class="flex flex-row flex-wrap justify-center gap-2 md:justify-start" id="services">
</div>
</div>
<div class="flex flex-col flex-1 gap-4">
<div class="flex justify-between w-full gap-4 px-4 py-4 text-2xl font-medium text-white rounded-lg sm:px-8 bg-card-background">
<p>Proudly Hosting</p>
<!-- <button>Filters</b> -->
</div>
<div class="grid sm:[grid-template-columns:repeat(auto-fill,minmax(375px,1fr))] gap-2" id="services">
<footer class="m-4 bg-white rounded-lg shadow dark:bg-gray-800">
<div class="w-full max-w-screen-xl p-4 mx-auto md:flex md:items-center md:justify-between">
<span class="text-sm text-gray-500 sm:text-center dark:text-gray-400">© 2024 wah.su | All Rights Reserved.
</span>
<ul class="flex flex-wrap items-center mt-3 text-sm font-medium text-gray-500 dark:text-gray-400 sm:mt-0">
<li>
<a href="/privacy.html" class="hover:underline me-4 md:me-6">Privacy Policy</a>
</li>
<li>
<a href="https://wah.su/radiquum" class="hover:underline">Contact</a>
</li>
</ul>
</div>
</footer>
<div class="flex flex-col justify-between gap-4 px-4 py-4 bg-white rounded-lg sm:px-8 text-header-background">
<div data-tags="security,member only" class="flex flex-wrap gap-1">
</div>
<div class="flex items-center justify-center gap-2 text-3xl font-bold uppercase sm:text-4xl">
<img src="static/img/vaultwarden.png" class="w-12"/>
<p>Vaultwarden</p>
</div>
<p class="text-xl">Unofficial Bitwarden compatible server.</p>
<div class="flex items-center gap-2">
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://github.com/dani-garcia/vaultwarden">About <span class="icon-[mdi--about] w-8 h-8"></span></a>
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://vault.wah.su">Open <span class="icon-[mdi--login] w-8 h-8"></span></a>
</div>
</div>
<script src="/public/js/theme.js"></script>
<script src="/public/js/flowbite.min.js"></script>
<script src="/public/js/cards.js"></script>
<script src="/public/js/status.js"></script>
<div class="flex flex-col justify-between gap-4 px-4 py-4 bg-white rounded-lg sm:px-8 text-header-background">
<div data-tags="media,member only" class="flex flex-wrap gap-1">
</div>
<div class="flex items-center justify-center gap-2 text-3xl font-bold uppercase sm:text-4xl">
<img src="static/img/immich.png" class="w-14"/>
<p>Immich</p>
</div>
<p class="text-xl">platform for managing and browsing your photos.</p>
<div class="flex items-center gap-2">
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://immich.app">About <span class="icon-[mdi--about] w-8 h-8"></span></a>
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://photos.wah.su">Open <span class="icon-[mdi--login] w-8 h-8"></span></a>
</div>
</div>
<div class="flex flex-col justify-between gap-4 px-4 py-4 bg-white rounded-lg sm:px-8 text-header-background">
<div data-tags="media,member only" class="flex flex-wrap gap-1">
</div>
<div class="flex items-center justify-center gap-2 text-3xl font-bold uppercase sm:text-4xl">
<img src="static/img/Nextcloud_Logo.png" class="w-12"/>
<p>Nextcloud</p>
</div>
<p class="text-xl">productivity suite, offering file sharing and collaboration tools.</p>
<div class="flex items-center gap-2">
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://nextcloud.com">About <span class="icon-[mdi--about] w-8 h-8"></span></a>
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://cloud.wah.su">Open <span class="icon-[mdi--login] w-8 h-8"></span></a>
</div>
</div>
<div class="flex flex-col justify-between gap-4 px-4 py-4 bg-white rounded-lg sm:px-8 text-header-background">
<div data-tags="communication,member only" class="flex flex-wrap gap-1">
</div>
<div class="flex items-center justify-center gap-2 text-3xl font-bold uppercase sm:text-4xl">
<img src="static/img/element.svg" class="w-12"/>
<p>Matrix</p>
</div>
<p class="text-xl">An open network for secure, decentralized communication.</p>
<div class="flex items-center gap-2">
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://matrix.org">About <span class="icon-[mdi--about] w-8 h-8"></span></a>
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://chat.wah.su">Open <span class="icon-[mdi--login] w-8 h-8"></span></a>
</div>
</div>
<div class="flex flex-col justify-between gap-4 px-4 py-4 bg-white rounded-lg sm:px-8 text-header-background">
<div data-tags="communication,member only" class="flex flex-wrap gap-1">
</div>
<div class="flex items-center justify-center gap-2 text-3xl font-bold uppercase sm:text-4xl">
<img src="static/img/jitsi.svg" class="h-12"/>
<p>Jitsi</p>
</div>
<p class="text-xl">A web conference platform for secure, decentralized communication.</p>
<div class="flex items-center gap-2">
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://jitsi.org">About <span class="icon-[mdi--about] w-8 h-8"></span></a>
<a class="flex items-center justify-center flex-1 gap-2 px-4 py-2 text-xl transition-colors rounded-md bg-header-background hover:bg-[#85146f] text-white" href="https://meet.wah.su">Open <span class="icon-[mdi--login] w-8 h-8"></span></a>
</div>
</div>
</div>
</div>
</section>
<script src="static/js/tags.js"></script>
<script src="static/js/status.js"></script>
</body>
</html>
</html>