diff --git a/astro.config.mjs b/astro.config.mjs index 3b2f75c..4aa81b6 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,10 +1,10 @@ -import { defineConfig } from 'astro/config'; -import mdx from '@astrojs/mdx'; +import { defineConfig } from "astro/config"; +import mdx from "@astrojs/mdx"; -import sitemap from '@astrojs/sitemap'; +import sitemap from "@astrojs/sitemap"; // https://astro.build/config export default defineConfig({ - site: 'https://example.com', - integrations: [mdx(), sitemap()], + site: "https://cassidoo.co/blog", + integrations: [mdx(), sitemap()], }); diff --git a/src/components/Post.astro b/src/components/Post.astro index 20c19e7..993b61a 100644 --- a/src/components/Post.astro +++ b/src/components/Post.astro @@ -3,7 +3,7 @@ const { slug, title, tags, description, date } = Astro.props; --- -
  • +
  • {title}
    {description && {description}} - +
  • \ No newline at end of file diff --git a/src/components/RandomPosts.astro b/src/components/RandomPosts.astro new file mode 100644 index 0000000..9149bc1 --- /dev/null +++ b/src/components/RandomPosts.astro @@ -0,0 +1,16 @@ +--- +import Post from '../components/Post.astro'; + +const { allPosts } = Astro.props; + +let posts = allPosts.sort(() => 0.5 - Math.random()).slice(0, 3) +--- + + + + \ No newline at end of file diff --git a/src/global.css b/src/global.css index 43dc352..fac6297 100644 --- a/src/global.css +++ b/src/global.css @@ -19,8 +19,8 @@ background-color: var(--highlight); color: var(--black); } +html, body { - font-family: 'Roboto Mono', monospace; margin: auto; padding: 20px; max-width: 65ch; @@ -30,6 +30,11 @@ body { line-height: 1.8; color: var(--black); } +html, +body, +button { + font-family: "Roboto Mono", monospace; +} h1, h2, h3, @@ -40,6 +45,16 @@ strong, b { color: var(--black); } + +body.dark-mode, +body.dark-mode button, +body.dark-mode .go-home, +button.dark-mode, +button.dark-mode button { + background: var(--black); + color: var(--white); +} + a { color: var(--pink); } @@ -54,6 +69,34 @@ nav a:not(:last-child) { padding: 0 12px 0 0; } +ul { + list-style-type: none; + padding: unset; +} + +.post { + margin: 0 0 30px 0; +} + +.post .title { + font-size: 1.3em; +} + +.tag { + margin-right: 20px; + color: var(--gray); + font-size: 0.8rem; +} +.tag:hover { + cursor: pointer; + font-weight: bold; +} + +.tag-home { + margin-right: 10px; + color: var(--gray); +} + textarea { width: 100%; font-size: 16px; diff --git a/src/pages/about.md b/src/pages/about.md index a79a115..d15b9a5 100644 --- a/src/pages/about.md +++ b/src/pages/about.md @@ -1,7 +1,7 @@ I'm Cassidy, and I like to make memes and dreams and software. -When I’m not working, I like to watch movies, play music, eat a lot, practice Spanish, and salsa dance. I like brainstorming projects that I build maybe half the time. It's nice to dream. +When I’m not working, I like to watch movies, play music, eat a lot, practice Spanish, and play games. I like brainstorming projects that I build maybe half the time. It's nice to dream. You should check out my website, [cassidoo.co](https://cassidoo.co), my [newsletter](https://cassidoo.co/newsletter), or my [GitHub profile](https://github.com/cassidoo). Or don’t. I’m not your mother. -Anyway, welcome to my blog AKA digital garden AKA mind dump land! \ No newline at end of file +Anyway, welcome to my blog AKA digital garden AKA mind dump land! diff --git a/src/pages/index.astro b/src/pages/index.astro index 007bf2d..e5aaf85 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -2,9 +2,31 @@ import BaseHead from '../components/BaseHead.astro'; import Header from '../components/Header.astro'; import Footer from '../components/Footer.astro'; +import RandomPosts from '../components/RandomPosts.astro'; import ColorScript from '../components/ColorScript.astro'; import { SITE_TITLE, SITE_DESCRIPTION } from '../config'; -import {Content as About} from './about.md'; +import { Content as About } from './about.md'; + +const posts = (await Astro.glob('../posts/*.{md,mdx}')); + +// Get tags from all posts +const getTags = posts.map((post) => { + const postTags = post.frontmatter.tags; + let allTags = [] + + if (postTags.length > 0) { + postTags.forEach((tag) => { + if (allTags.indexOf(tag) === -1) { + allTags.push(tag); + } + }); + } + return allTags; +}).flat(1); +// Make the tags unique +let tags = [...new Set(getTags)]; + + --- @@ -18,10 +40,14 @@ import {Content as About} from './about.md';

    Here's a sampler of some posts

    -

    hello blah blah blah

    +

    View posts by tag

    -

    hello blah blah blah

    +

    + {tags && tags.map(tag => ( + <>#{tag}{` `} + ))} +