Wowie what a gay little website for my gay little self
aria.coffee
Move friend buttons to front page&re-encode images
Thanks specifically to @LeNooby09 for borking your website and making my
website have a borked image >:3
+189
-132
+38
-14
astro.config.mjs
+38
-14
astro.config.mjs
···
1
1
// @ts-check
2
-
import { defineConfig } from 'astro/config';
3
-
import { remarkModifiedTime } from './remark-modified-time.mjs';
2
+
import { defineConfig } from "astro/config";
3
+
import { remarkModifiedTime } from "./remark-modified-time.mjs";
4
4
5
5
import preact from "@astrojs/preact";
6
6
import tailwind from "@astrojs/tailwind";
7
-
import node from '@astrojs/node';
7
+
import node from "@astrojs/node";
8
8
9
9
import icon from "astro-icon";
10
10
···
12
12
13
13
// https://astro.build/config
14
14
export default defineConfig({
15
-
output: process.env.DOCKER_BUILD ? 'server' : 'static',
16
-
site: "https://aria.coffee",
17
-
integrations: [preact(), tailwind(), icon(), mdx()],
15
+
output: process.env.DOCKER_BUILD ? "server" : "static",
16
+
site: "https://aria.coffee",
17
+
integrations: [preact(), tailwind(), icon(), mdx()],
18
18
19
-
image: {
20
-
domains: ["buymymojo.net", "aria.coffee", "github.com", "githubusercontent.com", "avatars.githubusercontent.com", "camo.githubusercontent.com", "user-images.githubusercontent.com", "private-user-images.githubusercontent.com"],
21
-
},
22
-
markdown: {
23
-
remarkPlugins: [remarkModifiedTime],
24
-
},
19
+
image: {
20
+
domains: [
21
+
"buymymojo.net",
22
+
"aria.coffee",
23
+
"github.com",
24
+
"githubusercontent.com",
25
+
"avatars.githubusercontent.com",
26
+
"camo.githubusercontent.com",
27
+
"user-images.githubusercontent.com",
28
+
"private-user-images.githubusercontent.com",
29
+
"alyxia.dev",
30
+
"nanoshinono.me",
31
+
"ata.moe",
32
+
"buh.moe",
33
+
"hayden.moe",
34
+
"onz.ee",
35
+
"notnite.com",
36
+
"erisdump.neocities.org",
37
+
"espi.me",
38
+
"alula.me",
39
+
"sapphic.moe",
40
+
"calayucu.com",
41
+
"meow-d.github.io",
42
+
"girlthi.ng",
43
+
"lenooby09.tech",
44
+
"ackwell.au",
45
+
],
46
+
},
47
+
markdown: {
48
+
remarkPlugins: [remarkModifiedTime],
49
+
},
25
50
});
26
-
27
51
28
52
// Bellow is for when dedicated server is wanted?
29
53
···
31
55
//
32
56
// adapter: node({
33
57
// mode: "standalone",
34
-
// })
58
+
// })
+2
-2
src/components/FriendLink.astro
+2
-2
src/components/FriendLink.astro
···
1
1
---
2
-
import { Image } from "astro:assets";
2
+
import { Image, Picture } from "astro:assets";
3
3
4
4
const { name, image, target } = Astro.props;
5
5
---
6
-
<a href={`${target}`} target="_blank"><Image src={image} width={88} height={31} alt={`${name}`} class="flex" /></a>
6
+
<a href={`${target}`} target="_blank"><Picture src={image} width={88} height={31} alt={`${name}`} class="flex" quality="max" decoding="async" loading="lazy" formats={['webp']} /></a>
7
7
<style>
8
8
img {
9
9
image-rendering: pixelated;
+1
-97
src/pages/friends.astro
+1
-97
src/pages/friends.astro
···
9
9
---
10
10
11
11
<BaseLayout pageTitle={pageTitle}>
12
-
<Partition>
13
-
<h1 class="text-2xl">These are cool people!!</h1>
14
-
<br />
15
-
<div class="flex outline-dotted p-5 flex-wrap justify-center">
16
-
<FriendLink
17
-
name="Alyxia"
18
-
image="https://alyxia.dev/static/img/88x31/self.png"
19
-
target="https://alyxia.dev"
20
-
/>
21
-
<div class="outline-dashed flex outline-3 mx-1">
22
-
<FriendLink
23
-
name="Prefetcher"
24
-
image="https://nanoshinono.me/prefetcher.gif"
25
-
target="https://nanoshinono.me/"
26
-
/>
27
-
<FriendLink
28
-
name="Ata"
29
-
image="https://ata.moe/88x31.png"
30
-
target="https://ata.moe"
31
-
/>
32
-
</div>
33
-
<FriendLink
34
-
name="Amemoia"
35
-
image="https://buh.moe/resources/buttons/88x31.gif"
36
-
target="https://buh.moe/"
37
-
/>
38
-
<FriendLink
39
-
name="Hayden"
40
-
image="https://hayden.moe/88x31/hayden.png"
41
-
target="https://hayden.moe/"
42
-
/>
43
-
<FriendLink
44
-
name="Onzecki"
45
-
image="https://onz.ee/assets/88x31s/png/onzecki.png"
46
-
target="https://onz.ee/"
47
-
/>
48
-
<FriendLink
49
-
name="NotNite"
50
-
image="https://notnite.com/buttons/notnite.png"
51
-
target="https://notnite.com/"
52
-
/>
53
-
<FriendLink
54
-
name="0x5066"
55
-
image="https://erisdump.neocities.org/buttons/88x31_1.gif"
56
-
target="https://erisdump.neocities.org"
57
-
/>
58
-
<FriendLink
59
-
name="Espi"
60
-
image="https://espi.me/img/webring/espi.png"
61
-
target="https://www.espi.me"
62
-
/>
63
-
<FriendLink
64
-
name="Alula"
65
-
image="https://alula.me/webring/alula.png"
66
-
target="https://alula.me/"
67
-
/>
68
-
<FriendLink
69
-
name="Sapphic"
70
-
image="https://sapphic.moe/buttons/friends/sapphic.png"
71
-
target="https://sapphic.moe/"
72
-
/>
73
-
<FriendLink
74
-
name="Miyuko"
75
-
image="https://calayucu.com/button-88x31.png"
76
-
target="https://calayucu.com"
77
-
/>
78
-
<FriendLink
79
-
name="meow_d"
80
-
image="https://meow-d.github.io/assets/images/buttons/meow_d.webp"
81
-
target="https://meow-d.github.io/"
82
-
/>
83
-
<div class="outline-dashed flex outline-3 mx-1">
84
-
<FriendLink
85
-
name="~thermia"
86
-
image="https://girlthi.ng/~thermia/img/88x31/thermia.gif"
87
-
target="https://girlthi.ng/~thermia/"
88
-
/>
89
-
<FriendLink
90
-
name="girlthi.ng"
91
-
image="https://girlthi.ng/~thermia/img/88x31/girlthing.gif"
92
-
target="https://girlthi.ng/"
93
-
/>
94
-
</div>
95
-
<FriendLink
96
-
name="LeNooby 09"
97
-
image="https://lenooby09.tech/88x31/88x31.png"
98
-
target="https://lenooby09.tech"
99
-
/>
100
-
<FriendLink
101
-
name="Ackwell"
102
-
image="https://ackwell.au/assets/88x31/ackwell-coil.png"
103
-
target="https://ackwell.au"
104
-
/>
105
-
</div>
106
-
<br />
107
-
<a href="/other buttons">Extra 88x31 buttons!</a>
108
-
</Partition>
12
+
109
13
<Partition>
110
14
<h2>My badge:</h2>
111
15
<div class="flex w-fit h-fit" style="background-color: #FFFCBC;">
+147
-18
src/pages/index.astro
+147
-18
src/pages/index.astro
···
4
4
import Greeting from "../components/Greeting";
5
5
import Social from "../components/Social.astro";
6
6
import BaseLayout from "../layouts/BaseLayout.astro";
7
+
import FriendLink from "../components/FriendLink.astro";
7
8
const pageTitle = "Aria";
8
9
9
10
const currentDate = new Date();
10
11
const ariaBirthDate = new Date("2002-05-07");
11
-
12
+
12
13
const seconds = (currentDate.getTime() - ariaBirthDate.getTime()) / 1000;
13
-
14
-
const age = seconds/31556952;
14
+
15
+
const age = seconds / 31556952;
15
16
---
16
17
17
18
<BaseLayout pageTitle={pageTitle}>
···
19
20
<main>
20
21
<h1 class="text-4xl">Welcome!~</h1>
21
22
<p>
22
-
I'm Aria, a <span class="tooltip">{Math.floor(age)}<span class="tooltiptext"><nobr>{age.toFixed(8)} years to be exact!</nobr></span></span> year old software developer and electronics
23
-
repair tech out of rural <span style="color: #D4F7CF;"
23
+
I'm Aria, a <span class="tooltip"
24
+
>{Math.floor(age)}<span class="tooltiptext"
25
+
><nobr>{age.toFixed(8)} years to be exact!</nobr></span
26
+
></span
27
+
> year old software developer and electronics repair tech out of
28
+
rural <span style="color: #D4F7CF;"
24
29
>Australia <span
25
30
class="backdrop-brightness-200 px-1 text-2xl rounded"
26
31
>🇦🇺</span
···
30
35
</main>
31
36
</Partition>
32
37
<Partition>
33
-
<Greeting client:load messages={["Yo", "Hallo", "Ayo", "Hiya", "You're cute"]} />
38
+
<Greeting
39
+
client:load
40
+
messages={["Yo", "Hallo", "Ayo", "Hiya", "You're cute"]}
41
+
/>
34
42
</Partition>
35
43
<Partition>
36
44
<h1>Socials:</h1>
37
45
<Social />
38
46
</Partition>
47
+
<Partition>
48
+
<h1 class="text-2xl">These are cool people!!</h1>
49
+
<br />
50
+
<div class="flex outline-dotted p-5 flex-wrap justify-center">
51
+
<FriendLink
52
+
name="Alyxia"
53
+
image="https://alyxia.dev/static/img/88x31/self.png"
54
+
target="https://alyxia.dev"
55
+
/>
56
+
<div class="outline-dashed flex outline-3 mx-1">
57
+
<FriendLink
58
+
name="Prefetcher"
59
+
image="https://nanoshinono.me/prefetcher.gif"
60
+
target="https://nanoshinono.me/"
61
+
/>
62
+
<FriendLink
63
+
name="Ata"
64
+
image="https://ata.moe/88x31.png"
65
+
target="https://ata.moe"
66
+
/>
67
+
</div>
68
+
<FriendLink
69
+
name="Amemoia"
70
+
image="https://buh.moe/resources/buttons/88x31.gif"
71
+
target="https://buh.moe/"
72
+
/>
73
+
<FriendLink
74
+
name="Hayden"
75
+
image="https://hayden.moe/88x31/hayden.png"
76
+
target="https://hayden.moe/"
77
+
/>
78
+
<FriendLink
79
+
name="Onzecki"
80
+
image="https://onz.ee/assets/88x31s/png/onzecki.png"
81
+
target="https://onz.ee/"
82
+
/>
83
+
<FriendLink
84
+
name="NotNite"
85
+
image="https://notnite.com/buttons/notnite.png"
86
+
target="https://notnite.com/"
87
+
/>
88
+
<FriendLink
89
+
name="0x5066"
90
+
image="https://erisdump.neocities.org/buttons/88x31_1.gif"
91
+
target="https://erisdump.neocities.org"
92
+
/>
93
+
<FriendLink
94
+
name="Espi"
95
+
image="https://espi.me/img/webring/espi.png"
96
+
target="https://www.espi.me"
97
+
/>
98
+
<FriendLink
99
+
name="Alula"
100
+
image="https://alula.me/webring/alula.png"
101
+
target="https://alula.me/"
102
+
/>
103
+
<FriendLink
104
+
name="Sapphic"
105
+
image="https://sapphic.moe/buttons/friends/sapphic.png"
106
+
target="https://sapphic.moe/"
107
+
/>
108
+
<FriendLink
109
+
name="Miyuko"
110
+
image="https://calayucu.com/button-88x31.png"
111
+
target="https://calayucu.com"
112
+
/>
113
+
<FriendLink
114
+
name="meow_d"
115
+
image="https://meow-d.github.io/assets/images/buttons/meow_d.webp"
116
+
target="https://meow-d.github.io/"
117
+
/>
118
+
<div class="outline-dashed flex outline-3 mx-1">
119
+
<FriendLink
120
+
name="~thermia"
121
+
image="https://girlthi.ng/~thermia/img/88x31/thermia.gif"
122
+
target="https://girlthi.ng/~thermia/"
123
+
/>
124
+
<FriendLink
125
+
name="girlthi.ng"
126
+
image="https://girlthi.ng/~thermia/img/88x31/girlthing.gif"
127
+
target="https://girlthi.ng/"
128
+
/>
129
+
</div>
130
+
<FriendLink
131
+
name="LeNooby 09"
132
+
image="https://lenooby09.tech/88x31/88x31.png"
133
+
target="https://lenooby09.tech"
134
+
/>
135
+
<FriendLink
136
+
name="Ackwell"
137
+
image="https://ackwell.au/assets/88x31/ackwell-coil.png"
138
+
target="https://ackwell.au"
139
+
/>
140
+
</div>
141
+
<br />
142
+
<a href="/other buttons">Extra 88x31 buttons!</a>
143
+
</Partition>
144
+
<Partition>
145
+
<h2>My badge:</h2>
146
+
<div class="flex w-fit h-fit" style="background-color: #FFFCBC;">
147
+
<a href="https://aria.coffee/" target="_blank">
148
+
<img
149
+
alt="Aria"
150
+
src="https://aria.coffee/static/img/buttons/aria.gif"
151
+
style="min-width: 88px; width: 176px; min-height: 31px; height: 62px; image-rendering: pixelated;"
152
+
/>
153
+
</a>
154
+
</div>
155
+
<br />
156
+
<p>Code:</p>
157
+
<label>
158
+
<textarea
159
+
onclick="this.select()"
160
+
readonly
161
+
cols="60"
162
+
rows="2"
163
+
class="rounded backdrop-brightness-0"
164
+
style="background-color: black;"
165
+
><img src="https://aria.coffee/static/img/buttons/aria.gif"
166
+
alt="Aria" style="image-rendering: pixelated;" /></textarea
167
+
>
168
+
</label>
169
+
</Partition>
39
170
<script>
40
171
setInterval(() => {
41
-
const currentDate = new Date();
42
-
const ariaBirthDate = new Date("2002-05-07");
43
-
44
-
const seconds = (currentDate.getTime() - ariaBirthDate.getTime()) / 1000;
45
-
46
-
const age = seconds/31556952;
47
-
48
-
const ageElem = document.querySelector('.tooltip');
172
+
const currentDate = new Date();
173
+
const ariaBirthDate = new Date("2002-05-07");
174
+
175
+
const seconds =
176
+
(currentDate.getTime() - ariaBirthDate.getTime()) / 1000;
177
+
178
+
const age = seconds / 31556952;
179
+
180
+
const ageElem = document.querySelector(".tooltip");
49
181
50
182
ageElem!.outerHTML = `<span class="tooltip">${Math.floor(age)}<span class="tooltiptext"><nobr>${age.toFixed(8)} years to be exact!</nobr></span></span>`;
51
183
}, 1000);
52
184
</script>
53
185
54
-
<style is:inline>
55
-
56
-
</style>
186
+
<style is:inline></style>
57
187
</BaseLayout>
58
-