renttrent/peroxy_site
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

better design with selfmade shader
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Lukas Moungos
2023-02-09 21:34:25 +01:00
parent ff8536f8c6
commit 22755e66e5
18 changed files with 1855 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
pages/blog/[slug].tsx
View File

@@ -13,14 +13,18 @@ import { StyledMarkdown } from "../../components/StyledMarkdown";
export const BlogArticle = ({ frontMatter, html }: MarkdownRenderingResult) => {
return (
<MainLayout>
<Link href="/blog">
<button className="flex flex-row items-center gap-2 text-primary hover:text-primary-dark dark:text-secondary dark:hover:text-secondary/50 transition-all ease-in duration-75">
<BackIcon />
<span>Go Back</span>
</button>
</Link>
<PostHeader frontMatter={frontMatter} estTime={readingTime(html)} />
<StyledMarkdown html={html} />
<div className="rounded-md border border-gray-200 shadow-md shadow-gray-200 dark:shadow-gray-900 dark:border-gray-700 gap-4 bg-black bg-opacity-30 round">
<div className="mx-10 mt-5 mb-10">
<Link href="/blog">
<button className="flex flex-row items-center gap-2 text-primary hover:text-primary-dark dark:text-secondary dark:hover:text-secondary/50 transition-all ease-in duration-75">
<BackIcon />
<span>Go Back</span>
</button>
</Link>
<PostHeader frontMatter={frontMatter} estTime={readingTime(html)} />
<StyledMarkdown html={html} />
</div>
</div>
</MainLayout>
);
};

6
pages/blog/index.tsx
View File

@@ -13,12 +13,12 @@ const BlogCard = ({
slug: string;
}) => {
return (
<div className="p-4 rounded-md border border-gray-200 shadow-md shadow-gray-200 dark:shadow-gray-900 dark:border-gray-700">
<div className="p-4 rounded-md border border-gray-200 shadow-md shadow-gray-200 dark:shadow-gray-900 dark:border-gray-700 bg-black bg-opacity-60">
<div className="text-sm font-medium text-gray-500">
{formatDate(blog.date)}
</div>
<h2 className="text-2xl font-bold">{blog.title}</h2>
<p className="text-gray-600 dark:text-gray-400 text-lg">
<p className="text-gray-600 dark:text-gray-400 text-sm">
{blog.description}
</p>
<Link href={`blog/${slug}`}>
@@ -36,7 +36,7 @@ const Blog = ({ posts }: { posts: Post[] }) => {
<h1 className="text-3xl font-bold text-gray-800 dark:text-gray-200">
Blog
</h1>
<div className="w-full h-0.5 bg-gray-200 dark:bg-gray-700 my-4 rounded-full" />
<div className="w-full h-0.5 bg-violet-200 dark:bg-violet-700 my-4 rounded-full" />
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
{posts.map((post, index) => (
<BlogCard