ignacio/ignaciops.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit from Astro

Browse Source
This commit is contained in:
houston[bot]
2025-08-02 13:27:23 -06:00
committed by Ignacio
commit c636f09699
131 changed files with 26084 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/layouts/Base.astro Normal file
View File

@@ -0,0 +1,60 @@
---
import BaseHead from "@/components/BaseHead.astro";
import SkipLink from "@/components/SkipLink.astro";
import ThemeProvider from "@/components/ThemeProvider.astro";
import Header from "@/components/layout/Header.astro";
import Footer from "@/components/layout/Footer.astro";
import { siteConfig } from "@/site.config";
import type { SiteMeta } from "@/types";
interface Props {
meta: SiteMeta;
}
const {
meta: { articleDate, description = siteConfig.description, ogImage, title },
} = Astro.props;
---
<html
class="overflow-x-hidden grid scroll-pt-20 scroll-smooth font-sans text-textColor text-xl md:text-base antialiased"
lang={siteConfig.lang}
>
<head>
<BaseHead articleDate={articleDate} description={description} ogImage={ogImage} title={title} />
</head>
<body class="min-w-4xl relative m-auto min-h-screen w-full max-w-6xl grow bg-bgColor">
<ThemeProvider />
<SkipLink />
<!-- Background
TODO: This approach is not optimal and requires improvements.
- Too many absolutely positioned elements can affect performance.
-->
<div class="fixed top-0 left-1/2 -ml-[50vw] min-h-screen w-screen pointer-events-none blur-2xl">
<div class="absolute top-[-90%] right-[25%] w-[75%] h-full bg-gradient-to-b from-blue-300 via-pink-300 to-transparent rounded-full opacity-40 dark:opacity-5"></div>
<div class="absolute top-[-90%] left-[25%] w-[75%] h-full bg-gradient-to-b from-blue-300 via-pink-300 to-transparent rounded-full opacity-40 dark:opacity-5"></div>
<div class="absolute top-[-85%] right-[25%] w-[55%] h-full bg-gradient-to-b from-purple-300 via-blue-300 to-transparent rounded-full opacity-40 dark:opacity-5"></div>
<div class="absolute top-[-85%] left-[25%] w-[55%] h-full bg-gradient-to-b from-indigo-300 via-orange-300 to-transparent rounded-full opacity-40 dark:opacity-5"></div>
<div class="absolute top-[-75%] left-[-25%] w-[65%] h-full bg-gradient-to-b from-blue-300 via-pink-300 to-transparent rounded-full opacity-30 dark:opacity-5"></div>
<div class="absolute top-[-75%] right-[-25%] w-[65%] h-full bg-gradient-to-b from-purple-300 via-blue-300 to-transparent rounded-full opacity-30 dark:opacity-5"></div>
<div class="absolute top-[-85%] left-[-30%] w-[85%] h-full bg-gradient-to-b from-indigo-300 via-orange-300 to-transparent rounded-full opacity-60 dark:opacity-5"></div>
<div class="absolute top-[-85%] right-[-30%] w-[85%] h-full bg-gradient-to-b from-orange-300 via-indigo-300 to-transparent rounded-full opacity-60 dark:opacity-5"></div>
</div>
<div class="relative flex min-h-screen w-full">
<!-- Sidebar for Docs Series -->
<slot name="sidebar" />
<!-- Main container for the page content -->
<div id="container" class="min-w-3xl relative m-auto max-w-4xl grow">
<div class="m-auto grid min-h-screen md:grid-rows-[auto_auto_1fr] px-4 md:px-8 md:pt-4">
<Header />
<main id="main" class="relative flex-grow mt-32 md:mt-[3.5rem]">
<slot />
</main>
<Footer />
</div>
</div>
</div>
</body>
</html>