besaid.zone
+6
-3
astro.config.ts
+6
-3
astro.config.ts
···
1
-
import { defineConfig } from "astro/config";
1
+
import { defineConfig, sharpImageService } from "astro/config";
2
2
import sitemap from "@astrojs/sitemap";
3
-
import UnoCSS from "unocss/astro"
3
+
import UnoCSS from "unocss/astro";
4
4
5
5
export default defineConfig({
6
6
site: "https://dane.computer",
7
+
image: {
8
+
service: sharpImageService(),
9
+
},
7
10
integrations: [
8
11
UnoCSS({
9
-
injectReset: true
12
+
injectReset: true,
10
13
}),
11
14
sitemap(),
12
15
],
bun.lockb
bun.lockb
This is a binary file and will not be displayed.
+6
-2
package.json
+6
-2
package.json
···
11
11
},
12
12
"dependencies": {
13
13
"@astrojs/sitemap": "latest",
14
-
"@fontsource-variable/asap": "^5.0.9",
15
14
"@notionhq/client": "^2.2.10",
16
15
"@tailwindcss/typography": "^0.5.9",
17
-
"astro": "latest"
16
+
"astro": "latest",
17
+
"sharp": "^0.33.0"
18
18
},
19
+
"trustedDependencies": [
20
+
"sharp"
21
+
],
19
22
"devDependencies": {
23
+
"@iconify-json/lucide": "^1.1.144",
20
24
"@unocss/reset": "^0.58.0",
21
25
"unocss": "^0.58.0"
22
26
}
+4
-2
src/layouts/Layout.astro
+4
-2
src/layouts/Layout.astro
···
1
1
---
2
2
import Meta from "../components/Meta.astro";
3
+
import Navbar from "../components/Navbar.astro";
3
4
interface Props {
4
5
title: string;
5
6
description: string;
···
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
15
<body class="bg-snes-light-gray">
15
-
<main class="max-w-5xl px-3 mx-auto xl:px-0" id="maincontent">
16
+
<Navbar />
17
+
<main class="max-w-5xl px-3 mx-auto xl:px-0 pb-5 md:pb-0" id="maincontent">
16
18
<slot />
17
19
</main>
18
20
</body>
src/pages/dane.png
src/pages/dane.png
This is a binary file and will not be displayed.
+112
-2
src/pages/index.astro
+112
-2
src/pages/index.astro
···
1
1
---
2
+
import { Image } from "astro:assets";
3
+
import daneImage from "./dane.png";
2
4
import Layout from "../layouts/Layout.astro";
5
+
6
+
import { getCollection } from "astro:content";
7
+
8
+
const posts = (await getCollection("blog"))
9
+
.sort((a, b) => b.data.published_at.valueOf() - a.data.published_at.valueOf())
10
+
.slice(0, 4);
3
11
---
4
12
5
13
<Layout
6
-
title="Dane's site / Home"
14
+
title="Dane's Space | Home"
7
15
description="Hey, I'm Dane. A frontend/fullstack developer from Toronto that enjoys building cool and accessible websites using the latest web technologies."
8
16
>
9
-
beep beep ima jeep
17
+
<h1 class="text-2xl font-bold mb-4">Dane</h1>
18
+
<div class="mb-4 grid xl:grid-cols-2 gap-4">
19
+
<div>
20
+
<div>
21
+
<Image
22
+
src={daneImage}
23
+
alt="Dane staring down at his camera while on a boat"
24
+
format="avif"
25
+
quality={80}
26
+
class="h-full w-sm rounded-sm border border-gray-300 mb-2"
27
+
/>
28
+
</div>
29
+
<div>
30
+
<p>He/They</p>
31
+
<p>29 years old</p>
32
+
<p>Toronto, ONTARIO, Canada</p>
33
+
</div>
34
+
</div>
35
+
<div>
36
+
<h2 class="font-bold mb-1">Dane's latest blog entires</h2>
37
+
<ul>
38
+
{
39
+
posts.map((post) => (
40
+
<li class="mb-2">
41
+
<p class="mb-0 max-w-[60ch]">
42
+
{post.data.title}
43
+
<a
44
+
href={`/blogs/${post.slug}`}
45
+
class="text-sm text-blue-700 font-bold hover:(underline text-blue-500)"
46
+
>
47
+
(view more)
48
+
</a>
49
+
</p>
50
+
<span class="text-gray-500 text-sm">
51
+
posted on{" "}
52
+
<time datetime={post.data.published_at.toISOString()}>
53
+
{new Intl.DateTimeFormat("en-US").format(
54
+
new Date(post.data.published_at)
55
+
)}
56
+
</time>
57
+
</span>
58
+
</li>
59
+
))
60
+
}
61
+
</ul>
62
+
[<a href="/blogs" class="text-blue-700 font-bold"
63
+
>View All Blog Entries</a
64
+
>]
65
+
</div>
66
+
</div>
67
+
<div class="grid xl:grid-cols-2">
68
+
<div class="border-2 border-blue-400 xl:w-[400px] h-min mb-4 xl:mb-0">
69
+
<h2 class="bg-blue-400 font-bold text-white px-2 py-0.5">
70
+
Contacting Dane
71
+
</h2>
72
+
<ul class="px-2 py-0.5">
73
+
<li class="flex items-center gap-1">
74
+
<div class="i-lucide-mailbox"></div>
75
+
<a
76
+
href="mailto:khadane.miller@gmail.com?subject=Hey%20There"
77
+
class="text-blue-700 hover:(underline text-blue-600)"
78
+
>Send Message</a
79
+
>
80
+
</li>
81
+
<li class="flex items-center gap-1">
82
+
<div class="i-lucide-square-user"></div>
83
+
<a
84
+
href="https://www.linkedin.com/in/dmiller94/"
85
+
target="_blank"
86
+
class="text-blue-700 hover:(underline text-blue-600)"
87
+
rel="noopener noreferrer">Add on LinkedIn</a
88
+
>
89
+
</li>
90
+
<li class="flex items-center gap-1">
91
+
<div class="i-lucide-at-sign"></div>
92
+
<a
93
+
href="https://www.threads.net/@dane__m"
94
+
target="_blank"
95
+
class="text-blue-700 hover:(underline text-blue-600)"
96
+
rel="noopener noreferrer">Follow on Threads</a
97
+
>
98
+
</li>
99
+
</ul>
100
+
</div>
101
+
<div>
102
+
<h2 class="bg-orange-200 font-bold text-orange-500 px-2 py-0.5 mb-2">
103
+
Dane's Blurbs
104
+
</h2>
105
+
<h3 class="text-orange-500 font-bold">About me:</h3>
106
+
<p class="mb-4">
107
+
I'm a developer from Toronto interested in making <i>cool</i> and <span
108
+
class="font-bold">accessible</span
109
+
> websites for everyone.
110
+
</p>
111
+
<p>
112
+
I got my start in programming through video games and just being very
113
+
curious about how things worked. Eventually that turned in to developing
114
+
websites which I am still doing today but I have interests in other
115
+
areas such as DevOps and Game Development. I also try to blog about
116
+
things I've learned when I remember to do so.
117
+
</p>
118
+
</div>
119
+
</div>
10
120
</Layout>
+18
-2
uno.config.ts
+18
-2
uno.config.ts
···
1
-
import { defineConfig } from 'unocss'
1
+
import {
2
+
defineConfig,
3
+
presetWebFonts,
4
+
transformerVariantGroup,
5
+
presetUno,
6
+
presetIcons,
7
+
} from "unocss";
2
8
3
9
export default defineConfig({
4
-
})
10
+
presets: [
11
+
presetUno(),
12
+
presetWebFonts({
13
+
fonts: {
14
+
sans: "Asap:100,300,400,600,700",
15
+
},
16
+
}),
17
+
presetIcons(),
18
+
],
19
+
transformers: [transformerVariantGroup()],
20
+
});