bg done
This commit is contained in:
Pablo Moyano
parent
03923b10aa
commit
fb7e621466
@ -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
79
src/layouts/new.astro
Normal 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>
|
||||
@ -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>
|
||||
@ -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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user