This commit is contained in:
Pablo Moyano 2023-10-07 22:48:10 +02:00
parent 03923b10aa
commit fb7e621466
4 changed files with 109 additions and 201 deletions

View File

@ -1,47 +0,0 @@
---
interface Props {
title: string;
}
const { title } = Astro.props;
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="description" content="Astro description" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="generator" content={Astro.generator} />
<title>{title}</title>
</head>
<body>
<slot />
</body>
</html>
<style is:global>
:root {
--accent: 136, 58, 234;
--accent-light: 224, 204, 250;
--accent-dark: 49, 10, 101;
--accent-gradient: linear-gradient(
45deg,
rgb(var(--accent)),
rgb(var(--accent-light)) 30%,
white 60%
);
}
html {
font-family: system-ui, sans-serif;
background: #913117;
background-size: 224px;
}
code {
font-family: Menlo, Monaco, Lucida Console, Liberation Mono,
DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
}
</style>

79
src/layouts/new.astro Normal file
View File

@ -0,0 +1,79 @@
---
import "@/styles/globals.css";
import Navbar from "../components/Navbar.astro";
import Footer from "../components/Footer.astro";
import backgroundImage1 from "../assets/gallery/coreboot2.jpg";
---
<!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>
<!-- Apply filters to background -->
<div class="background bg-fixed bg-cover bg-center bg-repeat-y">
<div class="background-filter"></div>
</div>
<!-- Vertical screen space is initially shared by navbar and splash content, further content can be obtained by scrolling -->
<!-- This is our true body for all intents and purposes -->
<!-- Placing content outside this div causes blurry useless things -->
<div class="flex flex-col h-screen">
<Navbar />
<div class="container mx-auto">
<slot />
</div>
<Footer />
</div>
</body>
</html>
<style>
.background {
background-image: url(../assets/gallery/coreboot2.jpg);
background-position: bottom;
height: 100vh;
width: 100%;
position: fixed; /* Ensure the background div stays in place */
top: 0;
left: 0;
z-index: -1;
}
.background-filter {
background: hsl(var(--b1));
opacity: 50%;
backdrop-filter: blur(8px);
height: 100vh;
}
</style>

View File

@ -1,72 +1,14 @@
---
import "@/styles/globals.css";
import Navbar from "../components/Navbar.astro";
import HackerText from "../components/HackerText.astro";
import Badge from "../components/Badge.astro";
import Gallery from "../components/Gallery.astro";
import Footer from "../components/Footer.astro";
import CodeHello from "../components/CodeHello.astro";
// Image imports
import { Image } from "astro:assets";
import foscLogo from "../assets/img/fosc-logo-old.png";
import Layout from '../layouts/new.astro';
---
<!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 -->
<!-- This is our true body for all intents and purposes -->
<!-- Placing content outside this div causes blurry useless things -->
<div class="flex flex-col h-screen">
<Navbar />
<!-- Text description -->
<div class="container-sm py-20 mx-auto">
<code>Blog coming soon</code>
<Layout>
<div class="text-center">
<p>Blog coming soon</p>
</div>
<div class="text-center">
<p>Blog coming soon</p>
</div>
<div>
<Footer />
</div>
</body>
</html>
<style>
/* body {
background-color: black !important;
background-image: url(../img/coreboot2.webp);
} */
</style>
</Layout>

View File

@ -1,60 +1,18 @@
---
import "@/styles/globals.css";
import Navbar from "../components/Navbar.astro";
import Layout from "../layouts/new.astro";
import HackerText from "../components/HackerText.astro";
import Badge from "../components/Badge.astro";
import Gallery from "../components/Gallery.astro";
import Footer from "../components/Footer.astro";
import CodeHello from "../components/CodeHello.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 -->
<!-- This is our true body for all intents and purposes -->
<!-- Placing content outside this div causes blurry useless things -->
<div class="flex flex-col h-screen">
<Navbar />
<div class="backdrop-blur object-cover flex-grow">
<Layout>
<!-- Logo + brand -->
<div
class="container mx-auto flex flex-col justify-center items-center"
>
<div class="container mx-auto flex flex-col justify-center items-center">
<div class="mt-[10vh]">
<Badge />
</div>
@ -72,28 +30,4 @@ import foscLogo from "../assets/img/fosc-logo-old.png";
<div class="container py-20 mx-auto">
<CodeHello />
</div>
<!-- More content -->
<!-- <div class="container py-10 mx-auto">
<div class="flex flex-col w-full">
<div class="grid h-20 card bg-base-300 rounded-box place-items-center">content</div>
<div class="divider"></div>
<div class="grid h-20 card bg-base-300 rounded-box place-items-center">content</div>
</div>
</div> -->
</div>
<div>
<Footer />
</div>
</div>
</body>
</html>
<style>
/* body {
background-color: black !important;
background-image: url(../img/coreboot2.webp);
} */
</style>
</Layout>