kennethnym/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

use catppuccin theme

Browse Source
This commit is contained in:
Kenneth
2024-05-14 00:01:06 +01:00
parent c2e2beaa47
commit 8be90fe64e
7 changed files with 41 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
astro.config.mjs
View File

@@ -1,11 +1,18 @@
import { defineConfig } from 'astro/config';
import mdx from '@astrojs/mdx';
import sitemap from '@astrojs/sitemap';
import { defineConfig } from "astro/config";
import mdx from "@astrojs/mdx";
import sitemap from "@astrojs/sitemap";
import tailwind from "@astrojs/tailwind";
// https://astro.build/config
export default defineConfig({
site: 'https://kennethnym.com',
integrations: [mdx(), sitemap(), tailwind()]
site: "https://kennethnym.com",
integrations: [mdx(), sitemap(), tailwind()],
markdown: {
shikiConfig: {
// Choose from Shiki's built-in themes (or add your own)
// https://shiki.style/themes
theme: "catppuccin-mocha",
},
},
});

1
package.json
View File

@@ -20,6 +20,7 @@
"typescript": "^5.4.2"
},
"devDependencies": {
"@catppuccin/tailwindcss": "^0.1.6",
"@flydotio/dockerfile": "latest",
"@tailwindcss/typography": "^0.5.10",
"prettier": "^3.2.5",

11
pnpm-lock.yaml generated
View File

@@ -31,6 +31,9 @@ dependencies:
version: 5.4.2
devDependencies:
'@catppuccin/tailwindcss':
specifier: ^0.1.6
version: 0.1.6(tailwindcss@3.4.1)
'@flydotio/dockerfile':
specifier: latest
version: 0.5.2
@@ -445,6 +448,14 @@ packages:
to-fast-properties: 2.0.0
dev: false
/@catppuccin/tailwindcss@0.1.6(tailwindcss@3.4.1):
resolution: {integrity: sha512-V+Y0AwZ5SSyvOVAcDl7Ng30xy+m82OKnEJ+9+kcZZ7lRyXuZrAb2GScdq9XR3v+ggt8qiZ/G4TvaC9cJ88AAXA==}
peerDependencies:
tailwindcss: '>=3.0.0'
dependencies:
tailwindcss: 3.4.1
dev: true
/@emmetio/abbreviation@2.3.3:
resolution: {integrity: sha512-mgv58UrU3rh4YgbE/TzgLQwJ3pFsHHhCLqY20aJq+9comytTXUDNGG/SMtSeMJdkpxgXSXunBGLD8Boka3JyVA==}
dependencies:

5
src/components/Link.astro
View File

@@ -6,8 +6,9 @@ const { href, class: className, ...props } = Astro.props;
href={href}
class:list={[
"underline",
"dark:visited:text-purple-300",
"visited:text-purple-500",
"text-blue",
"hover:text-lavender",
"visited:text-mauve",
className,
]}><slot /></a
>

4
src/layouts/BlogPost.astro
View File

@@ -10,12 +10,12 @@ type Props = CollectionEntry<"blog">["data"];
const { title, description, pubDate, updatedDate, heroImage } = Astro.props;
---
<html lang="en">
<html lang="en" class="latte dark:mocha">
<head>
<BaseHead title={title} description={description} image={heroImage} />
</head>
<body class="bg-amber-50 dark:bg-gray-900 dark:text-white dark:text-opacity-80 max-w-prose m-auto p-8">
<body class="bg-base text-text max-w-prose m-auto p-8">
<Header />
<main class="py-10">
<article>

6
src/pages/index.astro
View File

@@ -12,12 +12,12 @@ const posts = (await getBlogs()).sort(
---
<!doctype html>
<html lang="en">
<html lang="en" class="latte dark:mocha">
<head>
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
</head>
<body
class="bg-amber-50 dark:bg-gray-900 text-gray-600 dark:text-white dark:text-opacity-70 max-w-4xl m-auto p-8"
class="bg-base text-text max-w-4xl m-auto p-8"
>
<header>
<p class="font-bold text-2xl">kennethnym</p>
@@ -44,7 +44,7 @@ const posts = (await getBlogs()).sort(
<ul>
{
posts.map((post) => (
<li class="flex flex-row justify-between hover:bg-amber-100 dark:hover:bg-gray-700 -mx-2 px-2 rounded">
<li class="flex flex-row justify-between hover:bg-opacity-10 hover:bg-text -mx-2 px-2 rounded">
<Link href={`/blog/${post.slug}`}>{post.data.title}</Link>
<FormattedDate date={post.data.pubDate} />
</li>

15
tailwind.config.mjs
View File

@@ -1,10 +1,11 @@
import typography from "@tailwindcss/typography"
import typography from "@tailwindcss/typography";
import catppuccin from "@catppuccin/tailwindcss";
/** @type {import('tailwindcss').Config} */
export default {
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
theme: {
extend: {},
},
plugins: [typography],
}
content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"],
theme: {
extend: {},
},
plugins: [typography, catppuccin],
};