z0x/blog.z0x.ca
Code Activity Actions

chore: remove junk

Browse source
This commit is contained in:
enscribe 2024-09-10 10:36:58 -07:00
parent f6dcc302d4
commit 8f6872f739
No known key found for this signature in database
GPG key ID: 9BBD5C4114E25322
96 changed files with 1002 additions and 2485 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/pages/404.astro
View file

@ -1,9 +1,9 @@
---
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import Link from "@components/Link.astro";
import BackToPrevious from "@components/BackToPrevious.astro";
import { SITE } from "@consts";
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import Link from '@components/Link.astro'
import BackToPrevious from '@components/BackToPrevious.astro'
import { SITE } from '@consts'
---
<Layout title="404" description={SITE.DESCRIPTION}>

46
src/pages/about.astro
View file

@ -1,9 +1,9 @@
---
import { getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import { ABOUT } from "@consts";
import Image from "astro/components/Image.astro";
import { getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import { ABOUT } from '@consts'
import { Image } from 'astro:assets'
---
<Layout title={ABOUT.TITLE} description={ABOUT.DESCRIPTION}>
@ -14,37 +14,51 @@ import Image from "astro/components/Image.astro";
About
</div>
<section class="animate not-prose flex flex-col gap-4 text-justify">
<p class="text-justify">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores porro hic minima incidunt explicabo obcaecati consectetur consequuntur at quisquam commodi.
</p>
<p class="text-justify">Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores porro hic minima incidunt explicabo obcaecati consectetur consequuntur at quisquam commodi.
<p class="text-justify">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores
porro hic minima incidunt explicabo obcaecati consectetur
consequuntur at quisquam commodi.
</p>
<p class="text-justify">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolores
porro hic minima incidunt explicabo obcaecati consectetur
consequuntur at quisquam commodi.
</p>
</section>
<div class="flex flex-col md:flex-row justify-center">
<div class="flex flex-col justify-center md:flex-row">
<div class="my-10 text-center">
<div class="bg-neutral-300 w-[350px] h-[250px] object-cover rounded-xl -rotate-6 overflow-hidden">
<div
class="h-[250px] w-[350px] -rotate-6 overflow-hidden rounded-xl bg-neutral-300 object-cover"
>
<Image
src={'/astro-nano.png'}
alt={'life2'}
width={350}
height={250}
class="w-[350px] h-[250px] object-cover rounded-xl overflow-hidden"
class="h-[250px] w-[350px] overflow-hidden rounded-xl object-cover"
/>
</div>
<p class="mt-4 text-sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>
<p class="mt-4 text-sm">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</div>
<div class="mx-10 my-10 text-center">
<div class="bg-neutral-300 w-[150px] h-[250px] object-cover rounded-xl rotate-6 mx-auto sm:ml-auto">
<div
class="mx-auto h-[250px] w-[150px] rotate-6 rounded-xl bg-neutral-300 object-cover sm:ml-auto"
>
<Image
src={'/astro-micro.jpg'}
alt={'life2'}
width={150}
height={250}
class="w-[150px] h-[250px] object-cover rounded-xl "
class="h-[250px] w-[150px] rounded-xl object-cover"
/>
</div>
<p class="mt-4 text-sm">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
<p class="mt-4 text-sm">
Lorem ipsum dolor sit amet, consectetur adipisicing elit.
</p>
</div>
</div>
</div>

84
src/pages/blog/[...slug].astro
View file

@ -1,49 +1,51 @@
---
import { type CollectionEntry, getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import FormattedDate from "@components/FormattedDate.astro";
import { readingTime } from "@lib/utils";
import BackToPrevious from "@components/BackToPrevious.astro";
import PostNavigation from "@components/PostNavigation.astro";
import TableOfContents from "@components/TableOfContents.astro";
import Giscus from "@components/Giscus.astro";
import { type CollectionEntry, getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import FormattedDate from '@components/FormattedDate.astro'
import { readingTime } from '@lib/utils'
import BackToPrevious from '@components/BackToPrevious.astro'
import PostNavigation from '@components/PostNavigation.astro'
import TableOfContents from '@components/TableOfContents.astro'
import Giscus from '@components/Giscus.astro'
export async function getStaticPaths() {
const posts = (await getCollection("blog"))
const posts = (await getCollection('blog'))
.filter((post) => !post.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
return posts.map((post) => ({
params: { slug: post.slug },
props: post,
}));
}))
}
type Props = CollectionEntry<"blog">;
type Props = CollectionEntry<'blog'>
const posts = (await getCollection("blog"))
const posts = (await getCollection('blog'))
.filter((post) => !post.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
function getPostIndex(slug: string): number {
return posts.findIndex((post) => post.slug === slug);
return posts.findIndex((post) => post.slug === slug)
}
function getNextPost(slug: string): Props | null {
const postIndex = getPostIndex(slug);
return postIndex !== -1 && postIndex < posts.length - 1 ? posts[postIndex + 1] : null;
const postIndex = getPostIndex(slug)
return postIndex !== -1 && postIndex < posts.length - 1
? posts[postIndex + 1]
: null
}
function getPrevPost(slug: string): Props | null {
const postIndex = getPostIndex(slug);
return postIndex > 0 ? posts[postIndex - 1] : null;
const postIndex = getPostIndex(slug)
return postIndex > 0 ? posts[postIndex - 1] : null
}
const currentPostSlug = Astro.params.slug;
const nextPost = getNextPost(currentPostSlug);
const prevPost = getPrevPost(currentPostSlug);
const currentPostSlug = Astro.params.slug
const nextPost = getNextPost(currentPostSlug)
const prevPost = getPrevPost(currentPostSlug)
const post = Astro.props;
const { Content, headings } = await post.render();
const post = Astro.props
const { Content, headings } = await post.render()
---
<Layout title={post.data.title} description={post.data.description}>
@ -64,21 +66,23 @@ const { Content, headings } = await post.render();
<h1 class="animate text-4xl font-semibold text-black dark:text-white">
{post.data.title}
</h1>
<div class="font-base text-sm ">
{post.data.tags && post.data.tags.length > 0 ? (
post.data.tags.map((tag) => (
<div class="inline-block my-1">
<a
href={`/tags/${tag}`}
class="mx-1 rounded-full px-2 py-1 bg-orange-300 hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500 transition-colors duration-300 ease-in-out"
>
#{tag}
</a>
</div>
))
) : (
<span>No tags available</span>
)}
<div class="font-base text-sm">
{
post.data.tags && post.data.tags.length > 0 ? (
post.data.tags.map((tag) => (
<div class="my-1 inline-block">
<a
href={`/tags/${tag}`}
class="mx-1 rounded-full bg-orange-300 px-2 py-1 transition-colors duration-300 ease-in-out hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500"
>
#{tag}
</a>
</div>
))
) : (
<span>No tags available</span>
)
}
</div>
</div>
{headings.length > 0 && <TableOfContents headings={headings} />}

30
src/pages/blog/index.astro
View file

@ -1,28 +1,28 @@
---
import { type CollectionEntry, getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import ArrowCard from "@components/ArrowCard.astro";
import { BLOG } from "@consts";
import { type CollectionEntry, getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import ArrowCard from '@components/ArrowCard.astro'
import { BLOG } from '@consts'
const data = (await getCollection("blog"))
const data = (await getCollection('blog'))
.filter((post) => !post.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
type Acc = {
[year: string]: CollectionEntry<"blog">[];
};
[year: string]: CollectionEntry<'blog'>[]
}
const posts = data.reduce((acc: Acc, post) => {
const year = post.data.date.getFullYear().toString();
const year = post.data.date.getFullYear().toString()
if (!acc[year]) {
acc[year] = [];
acc[year] = []
}
acc[year].push(post);
return acc;
}, {});
acc[year].push(post)
return acc
}, {})
const years = Object.keys(posts).sort((a, b) => parseInt(b) - parseInt(a));
const years = Object.keys(posts).sort((a, b) => parseInt(b) - parseInt(a))
---
<Layout title={BLOG.TITLE} description={BLOG.DESCRIPTION}>

62
src/pages/cv.astro
View file

@ -1,17 +1,35 @@
---
import { getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import { CV } from "@consts";
import CVCard from "@components/CVCard.astro";
import { getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import { CV } from '@consts'
import CVCard from '@components/CVCard.astro'
// TO Modify
const works = [
{company:"Company A", time: "2022-Present", job_title: "Research Scientist", location: "London, UK", description: "Your Notes about the job"},
{company:"Company A", time: "2022-Present", job_title: "Research Scientist", location: "London, UK", description: "Your Notes about the job"},
{
company: 'Company A',
time: '2022-Present',
job_title: 'Research Scientist',
location: 'London, UK',
description: 'Your Notes about the job',
},
{
company: 'Company A',
time: '2022-Present',
job_title: 'Research Scientist',
location: 'London, UK',
description: 'Your Notes about the job',
},
]
const educations = [
{school:"University 1", time: "2022-Present", job_title: "BEng in Electronic Information Engineering", location: "London, UK", description: "Your Notes about the study"},
{
school: 'University 1',
time: '2022-Present',
job_title: 'BEng in Electronic Information Engineering',
location: 'London, UK',
description: 'Your Notes about the study',
},
]
---
@ -23,17 +41,33 @@ const educations = [
Work Experience
</div>
<ul class="animate not-prose flex flex-col gap-4">
{works.map((work) => (
<CVCard institution={work.company} time={work.time} job_title={work.job_title} location={work.location} description={work.description} />)
)}
{
works.map((work) => (
<CVCard
institution={work.company}
time={work.time}
job_title={work.job_title}
location={work.location}
description={work.description}
/>
))
}
</ul>
<div class="animate font-semibold text-black dark:text-white">
Education
</div>
<ul class="animate not-prose flex flex-col gap-4">
{educations.map((education) => (
<CVCard institution={education.school} time={education.time} job_title={education.job_title} location={education.location} description={education.description} />)
)}
{
educations.map((education) => (
<CVCard
institution={education.school}
time={education.time}
job_title={education.job_title}
location={education.location}
description={education.description}
/>
))
}
</ul>
</div>
</aside>

67
src/pages/index.astro
View file

@ -1,24 +1,24 @@
---
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import { SITE, HOME } from "@consts";
import ArrowCard from "@components/ArrowCard.astro";
import Link from "@components/Link.astro";
import { getCollection } from "astro:content";
import type { CollectionEntry } from "astro:content";
import PublicationCard from "@components/PublicationCard.astro";
import SocialIcons from "@components/SocialIcons.astro";
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import { SITE, HOME } from '@consts'
import ArrowCard from '@components/ArrowCard.astro'
import Link from '@components/Link.astro'
import { getCollection } from 'astro:content'
import type { CollectionEntry } from 'astro:content'
import PublicationCard from '@components/PublicationCard.astro'
import SocialIcons from '@components/SocialIcons.astro'
const blog = (await getCollection("blog"))
const blog = (await getCollection('blog'))
.filter((post) => !post.data.draft)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
.slice(0, SITE.NUM_POSTS_ON_HOMEPAGE);
.slice(0, SITE.NUM_POSTS_ON_HOMEPAGE)
const publications: CollectionEntry<"publications">[] = (
await getCollection("publications")
const publications: CollectionEntry<'publications'>[] = (
await getCollection('publications')
)
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf())
.slice(0, SITE.NUM_PUBLICATIONS_ON_HOMEPAGE);
.slice(0, SITE.NUM_PUBLICATIONS_ON_HOMEPAGE)
---
<Layout title={HOME.TITLE} description={HOME.DESCRIPTION}>
@ -34,16 +34,21 @@ const publications: CollectionEntry<"publications">[] = (
<p>
Astro Micro Academics is a theme for <Link
href="https://astro.build/">Astro</Link
> and tailored for academic users and researchers. It's built on <Link href="https://astro.build/themes/details/astro-micro/">Astro Micro</Link> and
> and tailored for academic users and researchers. It's built on
<Link href="https://astro.build/themes/details/astro-micro/"
>Astro Micro</Link
> and
<Link href="https://github.com/markhorn-dev">
Mark Horn's
</Link> popular theme <Link
href="https://astro.build/themes/details/astronano/"
>Astro Nano</Link
>.
>.
</p>
<p>
Micro Academics adds features like <span class="text-red-500">tags, and blog math support</span> and also inherits <Link href="https://pagefind.app/"
Micro Academics adds features like <span class="text-red-500"
>tags, and blog math support</span
> and also inherits <Link href="https://pagefind.app/"
>Pagefind</Link
> for search, <Link href="https://giscus.app">Giscus</Link> for comments,
from Astro Micro. See full changes this <Link
@ -53,10 +58,10 @@ const publications: CollectionEntry<"publications">[] = (
</span>
<span class="animate">
<p>
Micro Academics still comes with everything great about Micro and Nano — full type
safety, a sitemap, an RSS feed, and Markdown + MDX support.
Styled with TailwindCSS and preconfigured with system, light,
and dark themes.
Micro Academics still comes with everything great about Micro
and Nano — full type safety, a sitemap, an RSS feed, and
Markdown + MDX support. Styled with TailwindCSS and
preconfigured with system, light, and dark themes.
</p>
<p>
Visit
@ -66,11 +71,12 @@ const publications: CollectionEntry<"publications">[] = (
to fork the repository to get started.
</p>
</span>
</article>
</section>
<section class="animate space-y-2 border-2 border-red-800 text-red-800 dark:border-red-400 border-dashed p-2 dark:text-red-400">
<section
class="animate space-y-2 border-2 border-dashed border-red-800 p-2 text-red-800 dark:border-red-400 dark:text-red-400"
>
📢📢 Your important Information (Open for job/Recruiting students)
</section>
@ -81,8 +87,8 @@ const publications: CollectionEntry<"publications">[] = (
</h4>
<article>
<p>
If you want to get in touch with me about something or just to say
hi, reach out on social media or send me an email.
If you want to get in touch with me about something or just to
say hi, reach out on social media or send me an email.
</p>
</article>
<SocialIcons icon_size={'text-3xl'} />
@ -100,14 +106,14 @@ const publications: CollectionEntry<"publications">[] = (
<li>AIGC</li>
</ul>
</section>
<section class="animate space-y-6">
<div class="flex flex-wrap items-center justify-between gap-y-2">
<h2 class="font-semibold text-black dark:text-white">
News
</h2>
<h2 class="font-semibold text-black dark:text-white">News</h2>
</div>
<ul class="not-prose flex flex-col gap-4 overflow-y-auto max-h-[150px] scroll_bar">
<ul
class="not-prose scroll_bar flex max-h-[150px] flex-col gap-4 overflow-y-auto"
>
<li>[06/2024]: Your News1</li>
<li>[06/2024]: Your <span class="text-red-600">News2</span></li>
<li>[06/2024]: Your <span class="text-red-600">News2</span></li>
@ -151,7 +157,6 @@ const publications: CollectionEntry<"publications">[] = (
}
</ul>
</section>
</div>
</aside>
</Container>

15
src/pages/publications/index.astro
View file

@ -1,13 +1,14 @@
---
import { getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import { RESEARCH } from "@consts";
import PublicationCard from "@components/PublicationCard.astro";
import { getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import { RESEARCH } from '@consts'
import PublicationCard from '@components/PublicationCard.astro'
// import PublicationCard from "@components/PublicationCard";
const publications = (await getCollection("publications"))
.sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
const publications = (await getCollection('publications')).sort(
(a, b) => b.data.date.valueOf() - a.data.date.valueOf(),
)
---
<Layout title={RESEARCH.TITLE} description={RESEARCH.DESCRIPTION}>

25
src/pages/rss.xml.js
View file

@ -1,6 +1,6 @@
import rss from "@astrojs/rss";
import { SITE } from "@consts";
import { getCollection } from "astro:content";
import rss from '@astrojs/rss'
import { SITE } from '@consts'
import { getCollection } from 'astro:content'
export async function GET(context) {
// const publications = (await getCollection("publications")).filter(
@ -11,15 +11,20 @@ export async function GET(context) {
// (a, b) => new Date(b.data.date).valueOf() - new Date(a.data.date).valueOf(),
// );
try {
const blog = (await getCollection("blog")).filter((post) => !post.data.draft);
const blog = (await getCollection('blog')).filter(
(post) => !post.data.draft,
)
// Filter posts by tag 'rss-feed'
const filteredBlogs = blog.filter(post => post.data.tags && post.data.tags.includes('rss-feed'));
const filteredBlogs = blog.filter(
(post) => post.data.tags && post.data.tags.includes('rss-feed'),
)
// Sort posts by date
const items = [...filteredBlogs].sort(
(a, b) => new Date(b.data.date).valueOf() - new Date(a.data.date).valueOf()
);
(a, b) =>
new Date(b.data.date).valueOf() - new Date(a.data.date).valueOf(),
)
// Return RSS feed
return rss({
@ -32,9 +37,9 @@ export async function GET(context) {
pubDate: item.data.date,
link: `/${item.collection}/${item.slug}/`,
})),
});
})
} catch (error) {
console.error('Error generating RSS feed:', error);
return new Response('Error generating RSS feed', { status: 500 });
console.error('Error generating RSS feed:', error)
return new Response('Error generating RSS feed', { status: 500 })
}
}

51
src/pages/tags/[...slug].astro
View file

@ -1,37 +1,48 @@
---
import { type CollectionEntry, getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import ArrowCard from "@components/ArrowCard.astro";
import { TAGS } from "@consts";
import { type CollectionEntry, getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import ArrowCard from '@components/ArrowCard.astro'
import { TAGS } from '@consts'
type BlogPost = CollectionEntry<'blog'>;
type BlogPost = CollectionEntry<'blog'>
type Props = {
tag: string;
posts: BlogPost[];
};
tag: string
posts: BlogPost[]
}
const { tag, posts } = Astro.props;
const { tag, posts } = Astro.props
export async function getStaticPaths() {
const posts = await getCollection('blog');
const tags = posts.flatMap((post) => post.data.tags || []);
const uniqueTags = Array.from(new Set(tags.filter((tag): tag is string => typeof tag === 'string')));
const posts = await getCollection('blog')
const tags = posts.flatMap((post) => post.data.tags || [])
const uniqueTags = Array.from(
new Set(tags.filter((tag): tag is string => typeof tag === 'string')),
)
return uniqueTags.map((tag) => ({
params: { slug: tag },
props: { tag, posts: posts.filter((post) => post.data.tags?.includes(tag)) },
}));
props: {
tag,
posts: posts.filter((post) => post.data.tags?.includes(tag)),
},
}))
}
---
<Layout title={`Posts tagged with "${tag}"`} description={`A collection of posts tagged with ${tag}.`}>
<Layout
title={`Posts tagged with "${tag}"`}
description={`A collection of posts tagged with ${tag}.`}
>
<Container>
<aside data-pagefind-ignore>
<div class="space-y-10">
<div class="animate font-semibold text-black dark:text-white">
Tag: <span class="px-3 py-2 rounded-full mx-2 bg-orange-300 hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500 transition-colors duration-300 ease-in-out">#{tag}</span>
Tag: <span
class="mx-2 rounded-full bg-orange-300 px-3 py-2 transition-colors duration-300 ease-in-out hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500"
>#{tag}</span
>
</div>
<div class="space-y-4">
{
@ -39,9 +50,9 @@ export async function getStaticPaths() {
<section class="animate space-y-4">
<div>
<ul class="not-prose flex flex-col gap-4">
<li>
<ArrowCard entry={post} />
</li>
<li>
<ArrowCard entry={post} />
</li>
</ul>
</div>
</section>

36
src/pages/tags/index.astro
View file

@ -1,31 +1,35 @@
---
import { getCollection } from "astro:content";
import Layout from "@layouts/Layout.astro";
import Container from "@components/Container.astro";
import { TAGS } from "@consts";
import Image from "astro/components/Image.astro";
import { getCollection } from 'astro:content'
import Layout from '@layouts/Layout.astro'
import Container from '@components/Container.astro'
import { TAGS } from '@consts'
import Image from 'astro/components/Image.astro'
const blog = (await getCollection("blog"))
.filter((post) => !post.data.draft);
const blog = (await getCollection('blog')).filter((post) => !post.data.draft)
const tags = blog.flatMap(post => post.data.tags).filter((tag, index, self) => self.indexOf(tag) === index);
const tags = blog
.flatMap((post) => post.data.tags)
.filter((tag, index, self) => self.indexOf(tag) === index)
---
<Layout title={TAGS.TITLE} description={TAGS.DESCRIPTION}>
<Container>
<aside data-pagefind-ignore>
<div class="space-y-10">
<div class="animate font-semibold text-black dark:text-white">
Tags
</div>
<ul class="flex flex-wrap ">
{tags.map(tag => (
<div class="animate font-semibold text-black dark:text-white">Tags</div>
<ul class="flex flex-wrap">
{
tags.map((tag) => (
<li class="my-3">
<a href={`/tags/${tag}`} class="px-3 py-2 rounded-full mx-2 bg-orange-300 hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500 transition-colors duration-300 ease-in-out">
#{tag}
<a
href={`/tags/${tag}`}
class="mx-2 rounded-full bg-orange-300 px-3 py-2 transition-colors duration-300 ease-in-out hover:bg-cyan-200 dark:bg-orange-500 dark:hover:bg-cyan-500"
>
#{tag}
</a>
</li>
))}
))
}
</ul>
</div>
</aside>