new.fosc.space/src/pages/index.astro

77 lines
2.4 KiB
Plaintext

---
import "@/styles/globals.css";
import Navbar from "../components/Navbar.astro";
import HackerText from "../components/HackerText.astro";
// Image imports
import { Image } from "astro:assets";
import foscLogo from "../assets/img/fosc-logo-old.png";
---
<!doctype html>
<html lang="en">
<!-- Ah shit, here we go again. -->
<head>
<meta charset="utf-8" />
<title>FOSC</title>
<meta name="generator" content={Astro.generator} />
<!-- Theme manager -->
<script is:inline>
// ☝️ This script prevent the FART effect.
if (localStorage.getItem("theme") === null) {
document.documentElement.setAttribute("data-theme", "light");
} else
document.documentElement.setAttribute(
"data-theme",
localStorage.getItem("theme")
);
// "theme" LocalStorage value is set by the package to remember user preference.
// The value is checked and applyed before rendering anything.
</script>
<script>
import { themeChange } from 'theme-change';
themeChange();
// 👆 you could import the CDN directly instead of these two lines
</script>
</head>
<body class="bg-fixed bg-cover bg-center bg-repeat-y">
<!-- Vertical screen space is initially shared by navbar and splash content, further content can be obtained by scrolling -->
<div class="flex flex-col h-screen">
<Navbar />
<div class="backdrop-blur object-cover flex-grow">
<!-- Floating center items -->
<div class="container-sm mx-auto px-4 flex flex-col justify-center items-center">
<div class="mt-[10vh] h-[30vh]">
<Image class="h-full w-auto" src={foscLogo} alt="FOSC Logo" />
</div>
<HackerText text="FOSC"></HackerText>
</div>
<div class="container mx-auto flex justify-center items-center">
<button class="btn" data-set-theme="" data-act-class="ACTIVECLASS">none</button>
<button class="btn" data-set-theme="light" data-act-class="ACTIVECLASS">light</button>
<button class="btn" data-set-theme="dark" data-act-class="ACTIVECLASS">dark</button>
<button class="btn" data-set-theme="cyberpunk" data-act-class="ACTIVECLASS">cyber</button>
</div>
</div>
</div>
</body>
</html>
<style>
body {
background-color: black !important;
background-image: url(../img/coreboot2.webp);
}
</style>