add uno typography plugin, fix some accessibility issues

nulfrost de9bb09e 7d690776

Changed files
+13 -16
src
+2 -6
src/components/BlogPost.astro
··· 15 15 > 16 16 <a href={`/blogs/${slug}`}>{title}</a> 17 17 </h2> 18 - <footer class="text-sm"> 18 + <footer class="text-sm text-gray-500"> 19 19 <time datetime={published_at.toISOString()}> 20 - { 21 - new Intl.DateTimeFormat("en-us", { 22 - dateStyle: "full", 23 - }).format(new Date(published_at)) 24 - } 20 + {new Intl.DateTimeFormat("en-us", {}).format(new Date(published_at))} 25 21 </time> 26 22 </footer> 27 23 </article>
-3
src/components/Navbar.astro
··· 11 11 { 12 12 paths.map(({ name, path }) => ( 13 13 <li> 14 - {" "} 15 - [{" "} 16 14 <a 17 15 href={path} 18 16 class="font-bold text-blue-600 hover:(text-blue-500 underline)" 19 17 > 20 18 {name} 21 19 </a>{" "} 22 - ] 23 20 </li> 24 21 )) 25 22 }
+6 -4
src/layouts/BlogLayout.astro
··· 5 5 } 6 6 7 7 import Meta from "../components/Meta.astro"; 8 + import Navbar from "../components/Navbar.astro"; 8 9 const { title, description } = Astro.props; 9 10 --- 10 11 11 - <!DOCTYPE html> 12 + <!doctype html> 12 13 <html lang="en" class="font-sans" dir="ltr"> 13 14 <Meta title={title} description={description} /> 14 - <body class="bg-snes-light-gray"> 15 + <body> 16 + <Navbar /> 15 17 <main class="max-w-5xl px-3 mx-auto xl:px-0" id="maincontent"> 16 - <h1 class="mt-4 mb-1 text-2xl font-bold text-snes-black"> 18 + <h1 class="mt-4 mb-1 text-2xl font-bold"> 17 19 {title} 18 20 </h1> 19 - <p class="mb-4 text-sm">{description}</p> 21 + <p class="mb-4 text-sm text-gray-500">{description}</p> 20 22 <div 21 23 class="pb-6 prose prose-h2:mb-1 prose-a:text-blue-700 hover:prose-a:text-blue-600 prose-h2:mt-7 prose-p:text-gray-700 prose-li:marker:text-snes-black !max-w-none" 22 24 >
+1 -1
src/pages/blogs/index.astro
··· 9 9 --- 10 10 11 11 <Layout 12 - title="Dane's site / Blog" 12 + title="Dane's Space | Blog" 13 13 description="Where I write about things I've learned or found interesting" 14 14 > 15 15 <h1 class="mt-4 mb-4 text-2xl font-bold text-snes-black">Blog</h1>
+2 -2
src/pages/index.astro
··· 59 59 )) 60 60 } 61 61 </ul> 62 - [<a 62 + <a 63 63 href="/blogs" 64 64 class="text-blue-700 font-bold hover:(text-blue-600 underline)" 65 65 >View All Blog Entries</a 66 - >] 66 + > 67 67 </div> 68 68 </div> 69 69 <div class="grid xl:grid-cols-2">
+2
uno.config.ts
··· 4 4 transformerVariantGroup, 5 5 presetUno, 6 6 presetIcons, 7 + presetTypography, 7 8 } from "unocss"; 8 9 9 10 export default defineConfig({ ··· 15 16 }, 16 17 }), 17 18 presetIcons(), 19 + presetTypography(), 18 20 ], 19 21 transformers: [transformerVariantGroup()], 20 22 });