z0x/blog.z0x.ca
Code Actions

feat: improve graphics

Browse source
This commit is contained in:
enscribe 2024-09-13 01:23:57 -07:00
parent 8b5d66b32a
commit 3c8ad67774
No known key found for this signature in database
GPG key ID: 9BBD5C4114E25322
20 changed files with 61 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
README.md
View file

@ -4,6 +4,26 @@
## astro-erudite
astro-erudite is an opinionated, no-frills static blogging template built with [Astro](https://astro.build/) and [Tailwind](https://tailwindcss.com/). Extraordinarily loosely based on the [Astro Micro](https://astro-micro.vercel.app/) theme by [trevortylerlee](https://github.com/trevortylerlee).
astro-erudite is an opinionated, no-frills static blogging template built with [Astro](https://astro.build/), [Tailwind](https://tailwindcss.com/), and [shadcn/ui](https://ui.shadcn.com/). Extraordinarily loosely based off the [Astro Micro](https://astro-micro.vercel.app/) theme by [trevortylerlee](https://github.com/trevortylerlee).
To learn more about why this template exists, read [The State of Static Blogs in 2024](https://astro-erudite.vercel.app/blog/the-state-of-static-blogs), where I share my take on what constitutes a great blogging template and my goals while developing this one.
</div>
---
## Technology Stack
This is a list of the various technologies used to build this website:
| Category | Technology Name |
| ------------------- | -------------------------------------------------------------------------------------------------- |
| Framework | [Astro](https://astro.build/) |
| Styling | [Tailwind](https://tailwindcss.com) |
| Components | [shadcn/ui](https://ui.shadcn.com/) |
| Content | [MDX](https://mdxjs.com/) |
| Syntax Highlighting | [Shiki](https://github.com/shikijs/shiki) + [rehype-pretty-code](https://rehype-pretty.pages.dev/) |
| Graphics | [Figma](https://www.figma.com/) |
| Deployment | [Vercel](https://vercel.com) |
---

BIN
public/android-chrome-192x192.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 856 B

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
public/android-chrome-512x512.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
public/apple-touch-icon.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 838 B

After

Width:  |  Height:  |  Size: 720 B

2
public/browserconfig.xml
View file

@ -3,7 +3,7 @@
<msapplication>
<tile>
<square150x150logo src="/mstile-150x150.png"/>
<TileColor>#da532c</TileColor>
<TileColor>#121212</TileColor>
</tile>
</msapplication>
</browserconfig>

BIN
public/favicon-16x16.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 495 B

After

Width:  |  Height:  |  Size: 489 B

BIN
public/favicon-32x32.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 598 B

After

Width:  |  Height:  |  Size: 522 B

BIN
public/favicon.ico
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

BIN
public/mstile-150x150.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1 KiB

After

Width:  |  Height:  |  Size: 987 B

9
public/safari-pinned-tab.svg
View file

@ -9,10 +9,9 @@ Created by potrace 1.14, written by Peter Selinger 2001-2017
</metadata>
<g transform="translate(0.000000,512.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M0 4420 l0 -700 2320 0 2320 0 0 -230 0 -230 -2320 0 -2320 0 0 -700
0 -700 2320 0 2320 0 0 -230 0 -230 -2320 0 -2320 0 0 -700 0 -700 2560 0
2560 0 0 235 0 235 -2320 0 -2320 0 0 230 0 230 2320 0 2320 0 0 700 0 700
-2320 0 -2320 0 0 230 0 230 2320 0 2320 0 0 700 0 700 -2320 0 -2320 0 0 230
0 230 2320 0 2320 0 0 235 0 235 -2560 0 -2560 0 0 -700z"/>
<path d="M0 4020 l0 -1100 2200 0 2200 0 0 -360 0 -360 -2200 0 -2200 0 0
-1100 0 -1100 2560 0 2560 0 0 370 0 370 -2200 0 -2200 0 0 360 0 360 2200 0
2200 0 0 1100 0 1100 -2200 0 -2200 0 0 360 0 360 2200 0 2200 0 0 370 0 370
-2560 0 -2560 0 0 -1100z"/>
</g>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 877 B

After

Width:  |  Height:  |  Size: 771 B

4
public/site.webmanifest
View file

@ -1,6 +1,6 @@
{
"name": "",
"short_name": "",
"name": "erudite",
"short_name": "erudite",
"icons": [
{
"src": "/android-chrome-192x192.png",

BIN
public/static/1200x630.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 77 KiB

BIN
public/static/logo.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.2 KiB

18
public/static/logo.svg
View file

@ -1,16 +1,12 @@
<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_271_118)">
<rect width="512" height="47" fill="#CCCCCC"/>
<rect y="93" width="512" height="47" fill="#CCCCCC"/>
<rect y="186" width="512" height="47" fill="#CCCCCC"/>
<rect y="279" width="512" height="47" fill="#CCCCCC"/>
<rect y="372" width="512" height="47" fill="#CCCCCC"/>
<rect y="465" width="512" height="47" fill="#CCCCCC"/>
<rect y="47" width="48" height="46" fill="#CCCCCC"/>
<rect x="464" y="140" width="48" height="46" fill="#CCCCCC"/>
<rect y="233" width="48" height="46" fill="#CCCCCC"/>
<rect x="464" y="326" width="48" height="46" fill="#CCCCCC"/>
<rect y="419" width="48" height="46" fill="#CCCCCC"/>
<rect width="512" height="74" fill="#CCCCCC"/>
<rect y="146" width="512" height="74" fill="#CCCCCC"/>
<rect y="292" width="512" height="74" fill="#CCCCCC"/>
<rect y="438" width="512" height="74" fill="#CCCCCC"/>
<rect y="74" width="72" height="72" fill="#CCCCCC"/>
<rect y="366" width="72" height="72" fill="#CCCCCC"/>
<rect x="440" y="220" width="72" height="72" fill="#CCCCCC"/>
</g>
<defs>
<clipPath id="clip0_271_118">

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 857 B

After

Width:  |  Height:  |  Size: 632 B

BIN
public/static/twitter-card.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 124 KiB

2
src/components/BlogCard.astro
View file

@ -35,7 +35,7 @@ const authors = await parseAuthors(entry.data.authors ?? [])
alt={entry.data.title}
width={200}
height={200}
class="rounded-xl object-cover"
class="object-cover"
/>
</div>
)

16
src/components/Head.astro
View file

@ -28,15 +28,13 @@ const { title, description, image = '/static/twitter-card.png' } = Astro.props
<meta name="title" content={title} />
<meta name="description" content={description} />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="manifest" href="/site.webmanifest" />
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
<link rel="shortcut icon" href="/favicon.ico" />
<meta name="msapplication-TileColor" content="#da532c" />
<meta name="msapplication-config" content="/browserconfig.xml" />
<meta name="theme-color" content="#121212" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#121212">
<meta name="msapplication-TileColor" content="#121212">
<meta name="theme-color" content="#121212">
<meta property="og:type" content="website" />
<meta property="og:url" content={Astro.url} />

2
src/components/Header.astro
View file

@ -18,7 +18,7 @@ import logo from '../../public/static/logo.svg'
href="/"
class="flex flex-shrink-0 items-center gap-2 text-xl font-semibold transition-colors duration-300 hover:text-primary"
>
<Image src={logo} alt="Logo" class="size-8 rounded-sm" />
<Image src={logo} alt="Logo" class="size-8" />
{SITE.TITLE}
</Link>
<div class="flex items-center gap-2 md:gap-4">

2
src/consts.ts
View file

@ -14,7 +14,7 @@ export type NavigationLink = {
export const SITE: Site = {
TITLE: 'astro-erudite',
DESCRIPTION:
'astro-erudite is a opinionated, no-frills blogging template. Built with Astro.',
'astro-erudite is a opinionated, no-frills blogging template—built with Astro, Tailwind, and shadcn/ui.',
EMAIL: 'jason@enscribe.dev',
NUM_POSTS_ON_HOMEPAGE: 2,
SITEURL: 'https://astro-erudite.vercel.app',

2
src/pages/blog/[...slug].astro
View file

@ -71,7 +71,7 @@ const authors = await parseAuthors(post.data.authors ?? [])
alt={post.data.title}
width={1200}
height={630}
class="rounded-xl object-cover"
class="object-cover"
/>
)
}