Merge Next into Master #1
@ -1,3 +1,3 @@
|
|||||||
<footer>
|
<footer class="p-4">
|
||||||
<p class="text-center text-sm">© 2023 Thomas Cole</p>
|
<p class="text-center text-sm">© 2023 Thomas Cole</p>
|
||||||
</footer>
|
</footer>
|
||||||
@ -10,7 +10,7 @@ const { title, subtitle, image, link } = Astro.props;
|
|||||||
---
|
---
|
||||||
|
|
||||||
|
|
||||||
<div class="rounded-lg hover:shadow-xl transition ease-in-out hover:scale-105">
|
<div class="rounded-lg transition ease-in-out hover:scale-105">
|
||||||
<a href={link}>
|
<a href={link}>
|
||||||
<div class="ml-2 my-2 flex flex-col sm:flex-col md:flex-col lg:flex-row xl:flex-row 2xl:flex-row w-11/12 mx-auto">
|
<div class="ml-2 my-2 flex flex-col sm:flex-col md:flex-col lg:flex-row xl:flex-row 2xl:flex-row w-11/12 mx-auto">
|
||||||
<img class="h-28 my-2 aspect-video object-cover rounded-lg" src={image} alt="">
|
<img class="h-28 my-2 aspect-video object-cover rounded-lg" src={image} alt="">
|
||||||
|
|||||||
@ -32,7 +32,7 @@
|
|||||||
<Divider />
|
<Divider />
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li class="flex">
|
<li class="flex flex-col">
|
||||||
<a href="/" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
<a href="/" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
||||||
<button class="p-2">Home</button>
|
<button class="p-2">Home</button>
|
||||||
</a>
|
</a>
|
||||||
@ -42,11 +42,6 @@
|
|||||||
<button class="p-2">Projects</button>
|
<button class="p-2">Projects</button>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li class="flex">
|
|
||||||
<a href="/blog/1" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
|
||||||
<button class="p-2">Blog</button>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="flex">
|
<li class="flex">
|
||||||
<a href="/resume" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
<a href="/resume" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-200">
|
||||||
<button class="p-2">Resume/CV</button>
|
<button class="p-2">Resume/CV</button>
|
||||||
@ -61,6 +56,7 @@
|
|||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<Divider />
|
<Divider />
|
||||||
|
<div class="grow"></div>
|
||||||
<ThemeToggle />
|
<ThemeToggle />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@ -1,28 +1,15 @@
|
|||||||
---
|
---
|
||||||
import Divider from "../components/misc/Divider.astro";
|
import Divider from "../components/misc/Divider.astro";
|
||||||
import Layout from "./Layout.astro";
|
import Layout from "./Layout.astro";
|
||||||
//import '../styles/Markdown.css';
|
const { frontmatter } = Astro.props;
|
||||||
|
|
||||||
const { frontmatter } = Astro.props;
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<Layout>
|
<Layout>
|
||||||
<main
|
<main class="w-5/6 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4 mb-6 flex flex-col justify-center">
|
||||||
class="w-5/6 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4 mb-6 flex flex-col justify-center"
|
|
||||||
>
|
|
||||||
<div class="relative mb-4">
|
<div class="relative mb-4">
|
||||||
<img
|
<img class="aspect-video object-cover rounded-xl" src={frontmatter.image} alt="" />
|
||||||
class="aspect-video object-cover"
|
<a href={frontmatter.imageattr} class="absolute bottom-0 right-0 h-[24px]">
|
||||||
src={frontmatter.image}
|
<span class="material-symbols-outlined opacity-25 mr-[4px]">link</span>
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
<a
|
|
||||||
href={frontmatter.imageattr}
|
|
||||||
class="absolute bottom-0 right-0 h-[24px]"
|
|
||||||
>
|
|
||||||
<span class="material-symbols-outlined opacity-25 mr-[4px]"
|
|
||||||
>link</span
|
|
||||||
>
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<p class="my-2 font-bold text-5xl">{frontmatter.title}</p>
|
<p class="my-2 font-bold text-5xl">{frontmatter.title}</p>
|
||||||
|
|||||||
@ -50,8 +50,9 @@
|
|||||||
|
|
||||||
<body class="">
|
<body class="">
|
||||||
<Nav />
|
<Nav />
|
||||||
<div class="ml-0 sm:ml-0 md:ml-0 lg:ml-72 xl:ml-72 2xl:ml-72">
|
<div class="ml-0 sm:ml-0 md:ml-0 lg:ml-72 xl:ml-72 2xl:ml-72 flex flex-col min-h-[calc(100vh-48px)] lg:min-h-screen xl:min-h-screen">
|
||||||
<slot />
|
<slot />
|
||||||
|
<div class="grow"></div>
|
||||||
<Footer/>
|
<Footer/>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@ -1,59 +0,0 @@
|
|||||||
---
|
|
||||||
import Layout from "../../layouts/Layout.astro";
|
|
||||||
import BlogProjectCard from "../../components/misc/BlogProjectCard.astro";
|
|
||||||
import Divider from "../../components/misc/Divider.astro";
|
|
||||||
|
|
||||||
export async function getStaticPaths({ paginate }: { paginate: any }) {
|
|
||||||
const posts = (await Astro.glob("./*.{md,mdx}")).sort(
|
|
||||||
(a, b) =>
|
|
||||||
new Date(b.frontmatter.date).valueOf() -
|
|
||||||
new Date(a.frontmatter.date).valueOf()
|
|
||||||
);
|
|
||||||
|
|
||||||
return paginate(posts, { pageSize: 10 });
|
|
||||||
}
|
|
||||||
|
|
||||||
const { page } = Astro.props;
|
|
||||||
---
|
|
||||||
|
|
||||||
<Layout title=" | Blog">
|
|
||||||
<main class="w-1/2 sm:w-5/6 md:w-4/5 lg:w-4/5 xl:w-4/5 2xl:w-1/2 mx-auto mt-4">
|
|
||||||
<div class="flex flex-col">
|
|
||||||
{
|
|
||||||
page.data.map((post: any) => (
|
|
||||||
<BlogProjectCard title={post.frontmatter.title} subtitle={post.frontmatter.tagline}
|
|
||||||
image={post.frontmatter.image} link={post.url} />
|
|
||||||
<Divider />
|
|
||||||
))
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
<div class="w-1/2 mx-auto flex justify-between">
|
|
||||||
{
|
|
||||||
page.url.prev ? (
|
|
||||||
<a class="w-40 flex" href={page.url.prev}>
|
|
||||||
<span class="material-symbols-outlined">
|
|
||||||
chevron_left
|
|
||||||
</span>
|
|
||||||
<p>Previous Page</p>
|
|
||||||
</a>
|
|
||||||
) : (
|
|
||||||
<div class="w-40" />
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
<p class="grow text-center whitespace-nowrap">Page {page.currentPage}</p>
|
|
||||||
{
|
|
||||||
page.url.next ? (
|
|
||||||
<a class="w-40 flex" href={page.url.next}>
|
|
||||||
<p class="grow text-right">Next Page</p>
|
|
||||||
<span class="material-symbols-outlined">
|
|
||||||
chevron_right
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
) : (
|
|
||||||
<div class="w-40" />
|
|
||||||
)
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</Layout>
|
|
||||||
@ -1,14 +0,0 @@
|
|||||||
---
|
|
||||||
layout: "../../layouts/BlogLayout.astro"
|
|
||||||
title: "Content Management vs Flat Files"
|
|
||||||
tagline: "How posts are managed for this blog"
|
|
||||||
date: "Jan 3 2023"
|
|
||||||
image: "https://images.unsplash.com/photo-1569235186275-626cb53b83ce?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1472&q=80"
|
|
||||||
imageattr: "https://unsplash.com/photos/Q9y3LRuuxmg"
|
|
||||||
---
|
|
||||||
|
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
||||||
|
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
||||||
|
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
||||||
@ -1,14 +0,0 @@
|
|||||||
---
|
|
||||||
layout: "../../layouts/BlogLayout.astro"
|
|
||||||
title: "Low Power Routing"
|
|
||||||
tagline: "The search for a low power pfsense firewall"
|
|
||||||
date: "Jan 9 2023"
|
|
||||||
image: "https://images.unsplash.com/photo-1606420187127-dae7c868fa7a?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80"
|
|
||||||
imageattr: "https://unsplash.com/photos/mhA3QOXME5M"
|
|
||||||
---
|
|
||||||
|
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
||||||
|
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
||||||
|
|
||||||
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
|
|
||||||
@ -3,13 +3,6 @@ import BlogProjectCard from "../components/misc/BlogProjectCard.astro";
|
|||||||
import Divider from "../components/misc/Divider.astro";
|
import Divider from "../components/misc/Divider.astro";
|
||||||
import Layout from "../layouts/Layout.astro";
|
import Layout from "../layouts/Layout.astro";
|
||||||
|
|
||||||
const posts = (await Astro.glob("./blog/*.{md,mdx}"))
|
|
||||||
.sort(
|
|
||||||
(a, b) =>
|
|
||||||
new Date(b.frontmatter.date).valueOf() -
|
|
||||||
new Date(a.frontmatter.date).valueOf()
|
|
||||||
).slice(0,5);
|
|
||||||
|
|
||||||
const projects = (await Astro.glob("./projects/**/*.{md,mdx}")).sort(
|
const projects = (await Astro.glob("./projects/**/*.{md,mdx}")).sort(
|
||||||
(a,b) =>
|
(a,b) =>
|
||||||
new Date(b.frontmatter.date).valueOf()-
|
new Date(b.frontmatter.date).valueOf()-
|
||||||
@ -26,7 +19,7 @@ const projects = (await Astro.glob("./projects/**/*.{md,mdx}")).sort(
|
|||||||
</div>
|
</div>
|
||||||
<p class="text-3xl font-semibold">I'm glad you are here!</p>
|
<p class="text-3xl font-semibold">I'm glad you are here!</p>
|
||||||
<p>
|
<p>
|
||||||
Feel free to stay as long as you like. There are cool projects to explore and some mostly ok-ish blog posts. Stay awesome and thanks for visiting!
|
Feel free to stay as long as you like. There are cool projects to explore and more to come. Stay awesome and thanks for visiting!
|
||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
<Divider/>
|
<Divider/>
|
||||||
@ -44,19 +37,5 @@ const projects = (await Astro.glob("./projects/**/*.{md,mdx}")).sort(
|
|||||||
))
|
))
|
||||||
}
|
}
|
||||||
</section>
|
</section>
|
||||||
<section>
|
|
||||||
<p class="text-2xl font-bold py-2 sm:text-2xl md:text-2xl lg:text-4xl xl:text-4xl 2xl:text-4xl">Latest Blog Posts</p>
|
|
||||||
{
|
|
||||||
posts.map((post) => (
|
|
||||||
<BlogProjectCard
|
|
||||||
title={post.frontmatter.title}
|
|
||||||
subtitle={post.frontmatter.tagline}
|
|
||||||
image={post.frontmatter.image}
|
|
||||||
link={post.url}
|
|
||||||
/>
|
|
||||||
<Divider/>
|
|
||||||
))
|
|
||||||
}
|
|
||||||
</section>
|
|
||||||
</main>
|
</main>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user