diff --git a/package.json b/package.json index 2ff202a..a6257a0 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,6 @@ "version": "2.0.0", "type": "module", "description": "Personal website running on Astro and Node.js.", - "original-author": "Tania Rascia", "author": "Aravind Putrevu", "license": "MIT", "scripts": { diff --git a/src/components/astro/Nav.astro b/src/components/astro/Nav.astro index bcec150..a0b61e5 100644 --- a/src/components/astro/Nav.astro +++ b/src/components/astro/Nav.astro @@ -14,7 +14,7 @@ Writing Archive About - + diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index d8e9382..5b68e8c 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -1,6 +1,5 @@ --- import '../style.css'; -import '../new-moon.css'; import Nav from '../components/astro/Nav.astro'; import Footer from '../components/astro/Footer.astro'; diff --git a/src/new-moon.css b/src/new-moon.css deleted file mode 100644 index 20bce43..0000000 --- a/src/new-moon.css +++ /dev/null @@ -1,312 +0,0 @@ -/* - New Moon Theme by Tania Rascia - https://taniarascia.github.io/new-moon - Source: https://github.com/taniarascia/new-moon -*/ - -@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400&display=swap'); - -:root { - --code-font-family: Menlo, 'Roboto Mono', Courier New, monospace; - --code-font-color: #b3b9c5; - --code-background-color: #353535; - --string: #92d192; - --variable: #f2777a; - --property: #abb2bf; - --number: #fca369; - --operator: #ac8d58; - --punctuation: #d5d8df; - --comment: #848991; - --function: #62cfcf; - --keyword: #ffeead; - --attribute: #ffd479; - --class: #e1a6f2; - --tag: #6ab0f3; - --error: #f2777a; -} - -code[class*='language-'], -pre[class*='language-'] { - -webkit-font-smoothing: subpixel-antialiased; - color: var(--code-font-color); - font-family: var(--code-font-family); - font-size: 0.9rem; - - text-align: left; - white-space: pre-wrap; - word-spacing: normal; - word-break: normal; - word-wrap: normal; - font-weight: 400; - line-height: 1.7; - - -moz-tab-size: 2; - -o-tab-size: 2; - tab-size: 2; - - -webkit-hyphens: none; - -moz-hyphens: none; - -ms-hyphens: none; - hyphens: none; -} - -/* Code blocks */ -pre[class*='language-'] { - padding: 1.5rem; - margin-top: 0.6rem; - margin-bottom: 2rem; - margin-left: -1.5rem; - margin-right: -1.5rem; - overflow: auto; - box-shadow: 0 0 1px rgba(0, 0, 0, 0.1), 0 0 1px rgba(0, 0, 0, 0.06), - 0 2px 2px rgba(0, 0, 0, 0.06), 0 4px 4px rgba(0, 0, 0, 0.06), - 0 8px 8px rgba(0, 0, 0, 0.06), 0 16px 16px rgba(0, 0, 0, 0.06); -} - -@media screen and (min-width: 800px) { - code[class*='language-'], - pre[class*='language-'] { - font-size: 0.9rem; - } - pre[class*='language-'] { - padding: 1.5rem; - margin-left: auto; - margin-right: auto; - border-radius: 0.35rem; - } -} - -:not(pre) > code[class*='language-'], -pre[class*='language-'] { - background-color: var(--code-background-color); -} - -/* Inline code */ -:not(pre) > code[class*='language-'] { - padding: 0.1rem 0.3rem; - border-radius: 0.35rem; -} - -pre.language-text, -code.language-text { - background: var(--light-background) !important; - color: var(--dark-font-color) !important; - border: 1px solid var(--border); - box-shadow: none; -} - -pre.language-text code.language-text { - border: none; -} - -code.language-shell::before { - content: '$ '; - color: var(--comment); -} - -pre.language-terminal { - position: relative; - background: white; - color: #595c62; - padding-top: 3rem; - margin: 2rem 0; - border-radius: 0.35rem; - border: 1px solid #c7c9ca; - box-shadow: 0 0.5rem 1rem rgba(51, 51, 51, 0.2), - 0 0.5rem 2rem rgba(51, 51, 51, 0.2); -} - -code.language-terminal { - color: #595c62; -} - -pre.language-terminal::before { - content: '\2022 \2022 \2022'; - position: absolute; - top: 0; - left: 0; - background: linear-gradient(to bottom, #eaeaea, #d2d2d2); - color: #b9bcbd; - width: 100%; - font-size: 2.5rem; - margin: 0; - line-height: 0; - padding: 15px 0 12px; - text-indent: 6px; - letter-spacing: -18px; - border-bottom: 1px solid #a6a9aa; -} - -pre.language-terminal::after { - content: 'Output'; - line-height: 1; - font-family: 'Myriad Pro', sans-serif; - text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5); - font-size: 0.9rem; - position: absolute; - top: 6px; - right: 0.5rem; -} - -.gatsby-highlight-code-line { - background-color: #191919; - display: block; - margin-right: -1rem; - margin-left: -1rem; - padding-right: 1rem; - padding-left: 0.75rem; - border-left: 0.25rem solid #748ffc; -} - -.token.comment, -.token.prolog, -.token.doctype, -.token.cdata, -.token.important { - color: var(--comment); -} - -.token.punctuation { - color: var(--punctuation); -} - -.token.namespace { - opacity: 0.7; -} - -.token.property { - color: var(--property); -} - -.token.tag, -.token.constant, -.token.symbol, -.token.deleted { - color: var(--tag); -} - -.token.number { - color: var(--number); -} - -.token.char, -.token.builtin, -.token.url, -.token.inserted { - color: var(--code-font-color); -} - -.token.attr-name, -.token.selector { - color: var(--attribute); -} - -.token.attr-value, -.token.string { - color: var(--string); -} - -.token.operator { - color: var(--operator); -} - -.token.atrule, -.token.keyword { - color: var(--keyword); -} - -.token.function { - color: var(--function); -} - -.language-css, -.token.boolean, -.token.class-name { - color: var(--class) !important; -} - -.token.regex { - color: var(--keyword); -} - -.token.variable { - color: var(--variable); -} - -.token.bold { - font-weight: bold; -} -.token.italic { - font-style: italic; -} - -.token.entity { - cursor: help; -} - -.filename { - font-size: 0.9rem; - margin-bottom: -0.8rem; - padding: 0.3rem 1.5rem; - line-height: 1; - font-family: 'Myriad Pro', sans-serif; - - background: linear-gradient(to bottom, #eaeaea, #d2d2d2); - border: 1px solid #b9bcbd; - color: #4d494d; - z-index: 2; - - margin-left: -1.5rem; - margin-right: -1.5rem; - - text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5); - box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5) inset, 0px 1px 0px #515151; - text-align: center; -} - -@media screen and (min-width: 800px) { - .filename { - padding: 0.3rem 1rem 0.5rem; - border-top-left-radius: 0.3rem; - border-top-right-radius: 0.3rem; - - margin-left: auto; - margin-right: auto; - } -} - -pre::-moz-selection, -pre::-moz-selection, -code::-moz-selection, -code::-moz-selection { - text-shadow: none; - color: inherit; - background: rgba(150, 150, 150, 0.3) !important; -} - -pre::selection, -pre::selection, -code::selection, -code::selection { - text-shadow: none; - color: inherit; - background: rgba(150, 150, 150, 0.3) !important; -} - -pre[class*='language-']::-moz-selection, -pre[class*='language-']::-moz-selection, -code[class*='language-'] ::-moz-selection, -code[class*='language-'] ::-moz-selection { - text-shadow: none; - color: inherit; - background: rgba(150, 150, 150, 0.3) !important; -} - -pre[class*='language-']::selection, -pre[class*='language-']::selection, -code[class*='language-'] ::selection, -code[class*='language-'] ::selection { - text-shadow: none; - color: inherit; - background: rgba(150, 150, 150, 0.3) !important; -} diff --git a/src/pages/[...slug].astro b/src/pages/[...slug].astro index 40df1eb..0d43d55 100644 --- a/src/pages/[...slug].astro +++ b/src/pages/[...slug].astro @@ -41,7 +41,7 @@ const description = entry.data.title; {'tags' in entry.data && entry.data.tags && (
{entry.data.tags.map((tag: string) => ( - {tag} + {tag} ))}
)} @@ -82,6 +82,12 @@ const description = entry.data.title; padding: 0.25rem 0.75rem; border-radius: 3px; font-size: 0.85rem; + text-decoration: none; + } + + .tag:hover { + background: var(--lighter-background, var(--light-background)); + opacity: 0.8; } .post-content { diff --git a/src/pages/tags/[tag].astro b/src/pages/tags/[tag].astro new file mode 100644 index 0000000..cdddfdf --- /dev/null +++ b/src/pages/tags/[tag].astro @@ -0,0 +1,125 @@ +--- +import { getCollection } from 'astro:content'; +import BaseLayout from '../../layouts/BaseLayout.astro'; + +export async function getStaticPaths() { + const posts = await getCollection('posts', ({ data }) => !data.hidden); + const guides = await getCollection('guides'); + const allContent = [...posts, ...guides]; + + // Collect all unique tags + const allTags = new Set(); + allContent.forEach(entry => { + if (entry.data.tags) { + entry.data.tags.forEach((tag: string) => allTags.add(tag.toLowerCase())); + } + }); + + // Generate paths for each tag with filtered/sorted content + return Array.from(allTags).map(tag => ({ + params: { tag }, + props: { + tag, + content: allContent + .filter(entry => entry.data.tags?.some((t: string) => t.toLowerCase() === tag)) + .sort((a, b) => { + const dateA = a.data.date ? new Date(a.data.date).getTime() : 0; + const dateB = b.data.date ? new Date(b.data.date).getTime() : 0; + return dateB - dateA; + }) + } + })); +} + +const { tag, content: sortedContent } = Astro.props; +const displayTag = tag.charAt(0).toUpperCase() + tag.slice(1); +--- + + +
+
+

Tagged: {displayTag}

+

{sortedContent.length} {sortedContent.length === 1 ? 'post' : 'posts'}

+
+ +
    + {sortedContent.map((entry) => ( +
  • + {entry.data.title} + {entry.data.date && ( + {new Date(entry.data.date).getFullYear()} + )} +
    • + ))} +
+ + ← Back to all posts +
+ + +