Skip to content

Commit a4d13a9

Browse files
wdhdevwdhdev
committed
improvements + prettier
1 parent 79edda0 commit a4d13a9

File tree

9 files changed

+988
-91
lines changed

9 files changed

+988
-91
lines changed

‎package-lock.json

Lines changed: 889 additions & 9 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,11 @@
1010
"astro": "astro"
1111
},
1212
"dependencies": {
13+
"@astrojs/check": "^0.9.4",
1314
"@astrojs/mdx": "^4.0.2",
1415
"@astrojs/rss": "^4.0.10",
1516
"@astrojs/sitemap": "^3.2.1",
1617
"astro": "^5.0.9",
17-
"typescript": "^5.7.2"
18+
"typescript": "^5.7.3"
1819
}
1920
}

‎src/components/BaseHead.astro

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
---
22
// Import the global.css file here so that it is included on
33
// all pages through the use of the <BaseHead /> component.
4-
import '../styles/global.css';
5-
import { SITE_TITLE } from '../consts';
4+
import "../styles/global.css";
5+
import { SITE_TITLE } from "../consts";
66
77
interface Props {
8-
title: string;
9-
description: string;
10-
image?: string;
8+
title: string;
9+
description: string;
10+
image?: string;
1111
}
1212
1313
const canonicalURL = new URL(Astro.url.pathname, Astro.site);

‎src/components/Footer.astro

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,13 @@ const today = new Date();
33
---
44

55
<div>
6-
<footer>&copy; 2024-{today.getFullYear()} <b>William Harrison</b> - All Rights Reserved.</footer>
6+
<footer>&copy; 2024-{today.getFullYear()} <a href="https://wdh.gg">William Harrison</a> - All Rights Reserved.</footer>
77
</div>
88
<style>
9-
footer {
10-
padding: 2em 1em 2em 1em;
11-
background: linear-gradient(var(--gray-gradient)) no-repeat;
12-
color: rgb(var(--gray));
13-
text-align: center;
14-
}
9+
footer {
10+
padding: 2em 1em 2em 1em;
11+
background: linear-gradient(var(--gray-gradient)) no-repeat;
12+
color: rgb(var(--gray));
13+
text-align: center;
14+
}
1515
</style>

‎src/components/Header.astro

Lines changed: 32 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,41 @@
11
---
2-
import { SITE_TITLE } from '../consts';
2+
import { SITE_TITLE } from "../consts";
33
---
44

55
<header>
6-
<nav>
7-
<h1><a href="/">{SITE_TITLE}</a></h1>
8-
</nav>
6+
<nav>
7+
<h1><a href="/">{SITE_TITLE}</a></h1>
8+
</nav>
99
</header>
1010
<style>
11-
header {
12-
margin: 0;
13-
padding: 1em 1em;
14-
background: black;
15-
box-shadow: 0 2px 8px rgba(var(--black), 5%);
16-
}
17-
h1 {
18-
margin: 0;
19-
font-size: 1.2em;
11+
header {
12+
margin: 0;
13+
padding: 1em 1em;
14+
background: black;
15+
box-shadow: 0 2px 8px rgba(var(--black), 5%);
16+
}
17+
h1 {
18+
margin: 0;
19+
font-size: 1.2em;
2020
color: white;
21-
}
22-
h1 a,
23-
h1 a.active {
24-
text-decoration: none;
25-
}
26-
nav {
27-
display: flex;
28-
align-items: center;
29-
justify-content: space-between;
30-
}
31-
nav a {
32-
padding: 1em 0.5em;
21+
}
22+
h1 a,
23+
h1 a.active {
24+
text-decoration: none;
25+
}
26+
nav {
27+
display: flex;
28+
align-items: center;
29+
justify-content: space-between;
30+
}
31+
nav a {
32+
padding: 1em 0.5em;
3333
color: white;
34-
border-bottom: 4px solid transparent;
35-
text-decoration: none;
36-
}
37-
nav a.active {
38-
text-decoration: none;
39-
border-bottom-color: var(--accent);
40-
}
34+
border-bottom: 4px solid transparent;
35+
text-decoration: none;
36+
}
37+
nav a.active {
38+
text-decoration: none;
39+
border-bottom-color: var(--accent);
40+
}
4141
</style>

‎src/consts.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,2 @@
1-
// Place any global data in this file.
2-
// You can import this data from anywhere in your site by using the `import` keyword.
3-
41
export const SITE_TITLE = "William's Blog";
52
export const SITE_DESCRIPTION = "My personal blog where I talk about things that interest me.";

‎src/content/config.ts

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,16 +17,23 @@ const blog = defineCollection({
1717
invalid_type_error:
1818
"date must be written in yyyy-mm-dd format without quotes: For example, Jan 22, 2000 should be written as 2000-01-22."
1919
}),
20-
draft: z.boolean({
21-
invalid_type_error: "draft must be a boolean"
22-
}).optional().default(false),
23-
updated: z.date({
24-
invalid_type_error:
25-
"updated must be written in yyyy-mm-dd format without quotes: For example, Jan 22, 2000 should be written as 2000-01-22."
26-
}).optional(),
27-
heroImage: z.string({
28-
invalid_type_error: "heroImage must be a string"
29-
}).optional()
20+
draft: z
21+
.boolean({
22+
invalid_type_error: "draft must be a boolean"
23+
})
24+
.optional()
25+
.default(false),
26+
updated: z
27+
.date({
28+
invalid_type_error:
29+
"updated must be written in yyyy-mm-dd format without quotes: For example, Jan 22, 2000 should be written as 2000-01-22."
30+
})
31+
.optional(),
32+
heroImage: z
33+
.string({
34+
invalid_type_error: "heroImage must be a string"
35+
})
36+
.optional()
3037
})
3138
});
3239

‎src/layouts/BlogPost.astro

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,11 @@ type Props = CollectionEntry<"blog">["data"];
99
const { title, date, description, updated, heroImage } = Astro.props;
1010
1111
function formatDate(date: string) {
12-
return new Date(date).toLocaleDateString("en-au", {
13-
year: "numeric",
14-
month: "long",
15-
day: "numeric"
16-
});
12+
return new Date(date).toLocaleDateString("en-au", {
13+
year: "numeric",
14+
month: "long",
15+
day: "numeric"
16+
});
1717
}
1818
---
1919

‎src/styles/global.css

Lines changed: 31 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
/*
2-
The CSS in this style tag is based off of Bear Blog's default CSS.
32
https://github.com/HermanMartinus/bearblog/blob/297026a877bc2ab2b3bdfbd6b9f7961c350917dd/templates/styles/blog/default.css
4-
License MIT: https://github.com/HermanMartinus/bearblog/blob/master/LICENSE.md
3+
https://github.com/HermanMartinus/bearblog/blob/master/LICENSE.md
54
*/
65

76
:root {
@@ -15,49 +14,55 @@
1514
--box-shadow: 0 2px 6px rgba(var(--gray), 25%), 0 8px 24px rgba(var(--gray), 33%),
1615
0 16px 32px rgba(var(--gray), 33%);
1716
}
17+
1818
@font-face {
1919
font-family: "Atkinson";
2020
src: url("/fonts/atkinson-regular.woff") format("woff");
2121
font-weight: 400;
2222
font-style: normal;
2323
font-display: swap;
2424
}
25+
2526
@font-face {
2627
font-family: "Atkinson";
2728
src: url("/fonts/atkinson-bold.woff") format("woff");
2829
font-weight: 700;
2930
font-style: normal;
3031
font-display: swap;
3132
}
33+
3234
body {
3335
font-family: "Atkinson", sans-serif;
3436
margin: 0;
3537
padding: 0;
3638
text-align: left;
3739
background: linear-gradient(var(--gray-gradient)) no-repeat;
3840
background-size: 100% 600px;
39-
word-wrap: break-word;
40-
overflow-wrap: break-word;
4141
color: rgb(var(--gray-dark));
4242
font-size: 20px;
4343
line-height: 1.7;
44+
word-wrap: break-word;
45+
overflow-wrap: break-word;
4446
}
47+
4548
main {
4649
width: 720px;
4750
max-width: calc(100% - 2em);
4851
margin: auto;
4952
padding: 3em 1em;
5053
}
54+
5155
h1,
5256
h2,
5357
h3,
5458
h4,
5559
h5,
5660
h6 {
57-
margin: 0 0 0.5rem 0;
61+
margin-bottom: 0.5rem;
5862
color: rgb(var(--black));
5963
line-height: 1.2;
6064
}
65+
6166
h1 {
6267
font-size: 3.052em;
6368
}
@@ -73,59 +78,71 @@ h4 {
7378
h5 {
7479
font-size: 1.25em;
7580
}
81+
7682
strong,
7783
b {
7884
font-weight: 700;
7985
}
86+
8087
a {
8188
color: var(--accent);
8289
}
90+
8391
a:hover {
8492
color: var(--accent);
8593
}
94+
8695
p {
8796
margin-bottom: 1em;
8897
}
98+
8999
.prose p {
90100
margin-bottom: 2em;
91101
}
92-
textarea {
93-
width: 100%;
94-
font-size: 16px;
95-
}
102+
103+
textarea,
96104
input {
105+
width: 100%;
97106
font-size: 16px;
98107
}
108+
99109
table {
100110
width: 100%;
101111
}
112+
102113
img {
103114
max-width: 100%;
104115
height: auto;
105116
border-radius: 8px;
106117
}
118+
107119
code {
108120
padding: 2px 5px;
109121
background-color: rgb(var(--gray-light));
110122
border-radius: 2px;
111123
}
124+
112125
pre {
113126
padding: 1.5em;
114127
border-radius: 8px;
115128
}
129+
116130
pre > code {
117131
all: unset;
118132
}
133+
119134
blockquote {
120135
border-left: 4px solid var(--accent);
121-
padding: 0 0 0 20px;
122-
margin: 0px;
136+
padding-left: 20px;
137+
margin: 0;
123138
font-size: 1.333em;
124139
}
140+
125141
hr {
126142
border: none;
127143
border-top: 1px solid rgb(var(--gray-light));
128144
}
145+
129146
@media (max-width: 720px) {
130147
body {
131148
font-size: 18px;
@@ -136,19 +153,14 @@ hr {
136153
}
137154

138155
.sr-only {
139-
border: 0;
140-
padding: 0;
141-
margin: 0;
142156
position: absolute !important;
143157
height: 1px;
144158
width: 1px;
145159
overflow: hidden;
146-
/* IE6, IE7 - a 0 height clip, off to the bottom right of the visible 1px box */
147160
clip: rect(1px 1px 1px 1px);
148-
/* maybe deprecated but we need to support legacy browsers */
149-
clip: rect(1px, 1px, 1px, 1px);
150-
/* modern browsers, clip-path works inwards from each corner */
151161
clip-path: inset(50%);
152-
/* added line to stop words getting smushed together (as they go onto separate lines and some screen readers do not understand line feeds as a space */
153162
white-space: nowrap;
163+
border: 0;
164+
padding: 0;
165+
margin: 0;
154166
}

0 commit comments

Comments
 (0)