1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
|
---
import BaseHead from '../components/BaseHead.astro';
import Header from '../components/Header.astro';
import Footer from '../components/Footer.astro';
import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
import { getCollection } from 'astro:content';
import FormattedDate from '../components/FormattedDate.astro';
const posts = (await getCollection('blog')).sort(
(a, b) => a.data.pubDate.valueOf() - b.data.pubDate.valueOf()
);
---
<!DOCTYPE html>
<html lang="en">
<head>
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
</head>
<body>
<Header title={SITE_TITLE} />
<main>
<style>
ul {
list-style-type: none;
padding: unset;
}
ul li {
display: flex;
}
ul li :global(time) {
flex: 0 0 130px;
font-style: italic;
color: #646464;
}
</style>
<h2>Recent Posts</h2>
<section>
<ul>
{
posts.slice(-3).map((post) => (
<li>
<FormattedDate date={post.data.pubDate} />
<a href={`/blog/${post.slug}/`}>{post.data.title}</a>
</li>
)).reverse()
}
</ul>
</section>
<h1>👋 Greetings, Adventurer!</h1>
<p>
Welcome to my site/blog! This place will serve as a corner where I can document the progress and process with some of things I've experimented with or made.
I guess its like programming documentation, but uhh more of a mess?
</p>
<h3>I did a thing..</h3>
<p>Here are some of the things I've done/experimented with and found pretty cool! (you can also find more stuff <a href="https://pinapelz.moe">here</a> and on <a href="https://github.com/pinapelz">GitHub</a>)</p>
<style>
.project-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px;
}
.project {
background-color: #292828;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
text-align: center;
}
.project img {
max-width: 100%;
height: auto;
border-radius: 4px;
margin-bottom: 10px;
}
/* Styling for project descriptions */
.project-grid .project p.project-text,
.project-grid a{
text-decoration: none;
font-size: 14px;
line-height: 1.4;
color: #FFFFFF;
}
.project-grid .project p.project-title{
font-size: 18px;
line-height: 1;
}
img {
max-height: 100px;
}
</style>
<div class="project-grid">
<div class="project">
<a href="https://nijitracker.com" >
<img src="/projects/nijitrack.png" alt="Nijitrack Logo">
</a>
<p class="project-title">NijiTrack</p>
<p class="project-text">
Record and track historical subscriber data for a set of YouTube channels.
Currently mine is set up to record data for Nijisanji Virtual YouTubers (Nijitracker link on repo).
</p>
</div>
<div class="project">
<a href="https://archive.pinapelz.moe">
<img src="/projects/patchwork.png" alt="Patchwork Logo">
</a>
<p class="project-title">Video Archive Web (Patchwork Archive)</p>
<p class="project-text">
A Python Flask web app that can host archived YouTube videos, currently used as the
front end for Patchwork Archive (link on repo).
</p>
</div>
<div class="project">
<a href="https://github.com/pinapelz/JHolodex">
<img src="/projects/holodex.png" alt="JHolodex Wrapper">
</a>
<p class="project-title">JHolodex</p>
<p class="project-text">
A Java object oriented wrapper for the Holodex API
</p>
</div>
<div class="project">
<a href="https://github.com/pinapelz/Sapphire">
<img src="https://www.gitbook.com/cdn-cgi/image/width=40,dpr=2,height=40,fit=contain,format=auto/https%3A%2F%2F1852825540-files.gitbook.io%2F~%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FoWEO5F5fxBARvfBEby5l%252Ficon%252F9jUvxgDCe6egTrCyJ8t5%252Fsapphire_logo.png%3Falt%3Dmedia%26token%3D4e1ce138-1a38-4e5c-a9f8-490b24189b57" alt="Sapphire">
</a>
<p class="project-title">Project Sapphire</p>
<p class="project-text">
My fork of Sapphire, a C++ Final Fantasy XIV Server Emulator. Most of the work I've done
is pretaining to scripting content
</p>
</div>
<div class="project">
<a href="https://github.com/pinapelz/yet-another-lavaplayer-bot">
<img src="https://github.com/discord-jda/JDA/raw/assets/assets/readme/logo.png?raw=true" alt="YALP Bot">
</a>
<p class="project-title">Yet Another Lavaplayer Bot</p>
<p class="project-text">
A Discord music bot written in Java using JDA and Lavaplayer
</p>
</div>
<div class="project">
<a href="https://github.com/pinapelz/ytmp3AutoTag">
<img src="projects/github-mark-white.svg" alt="ytmp3 Autotag">
</a>
<p class="project-title">YTMP3 Auto Tag</p>
<p class="project-text">
A Java Swing application that uses yt-dlp to download and then automatically tag
mp3 files with metadata from the video. Supports downloading parts of a video as well
</p>
</div>
</div>
</main>
<Footer />
</body>
</html>
|
