Skip to content

Commit e89e03c

Browse files
retrozinndevretrozinndev
authored
Merge pull request #50 from retrozinndev/devel
✨ feat: use github api to fetch repositories
2 parents 4d59206 + c5a8828 commit e89e03c

File tree

13 files changed

+273
-189
lines changed

13 files changed

+273
-189
lines changed

‎.github/workflows/astro-check-pr.yml‎

Lines changed: 0 additions & 54 deletions
This file was deleted.

‎.gitignore‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ dist/
88
node_modules/
99

1010
# Ignore package-lock
11-
package-lock.json
11+
pnpm-lock.yaml
1212

1313
# logs
1414
npm-debug.log*

‎package.json‎

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
{
2-
"name": "",
2+
"$schema": "https://www.schemastore.org/package.json",
3+
"name": "retrozinndev.github.io",
34
"type": "module",
4-
"version": "0.0.1",
5+
"version": "1.5.1",
56
"scripts": {
67
"dev": "astro dev",
78
"start": "astro dev",
@@ -11,18 +12,18 @@
1112
},
1213
"dependencies": {
1314
"@astrojs/check": "^0.9.4",
14-
"@astrojs/react": "^4.2.7",
15+
"@astrojs/react": "^4.3.0",
1516
"@octokit/rest": "github:octokit/rest.js",
16-
"@types/react": "^19.1.4",
17-
"@types/react-dom": "^19.1.5",
18-
"astro": "^5.1.7",
17+
"@types/react": "^19.1.10",
18+
"@types/react-dom": "^19.1.7",
19+
"astro": "^5.13.2",
1920
"nanostores": "^1.0.1",
20-
"react": "^19.1.0",
21-
"react-dom": "^19.1.0",
21+
"react": "^19.1.1",
22+
"react-dom": "^19.1.1",
2223
"react-icons": "^5.5.0",
23-
"typescript": "^5.4.5"
24+
"typescript": "^5.9.2"
2425
},
2526
"devDependencies": {
26-
"sass": "^1.79.2"
27+
"sass": "^1.90.0"
2728
}
2829
}

‎src/components/Navigation.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const pages: Array<Page> = [
2828
},
2929
{
3030
name: "about",
31-
href: "/#about",
31+
href: "/about",
3232
hasI18n: true
3333
},
3434
{

‎src/components/ProjectCard.astro‎

Lines changed: 42 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,40 @@
11
---
22
import { Image } from "astro:assets";
3+
import { FaRegStar } from "react-icons/fa6";
34
4-
export interface Project {
5-
icon?: string;
6-
developer: string;
7-
title: string;
5+
interface Props {
6+
icon: string;
87
description: string;
8+
title: string;
9+
developer: string;
910
href: string;
11+
stars: number;
1012
}
1113
12-
const { icon, developer, title, description, href } = Astro.props;
14+
const { icon, developer, title, description, href, stars } = Astro.props;
1315
---
1416

15-
<div class="project-card" id="projectCard" data-href={ href }>
17+
<div class="project-card" id="projectCard" onclick={`window.open("${href}", "_blank")`}>
1618
<div class="developer">
17-
<Image class="icon" src={ icon ??
18-
`https://github.com/${developer}.png?size=72`
19-
} alt="dev profile picture" width={32} height={32} loading={"lazy"}
20-
/>
19+
<Image class="icon" src={
20+
icon ?? `https://github.com/${developer}.png?size=72`
21+
} alt="dev profile picture" width={32} height={32} loading={"lazy"}
22+
/>
2123

2224
<span class="developer-name">{ developer }</span>
25+
<div class="stars" style={`display: ${stars > 0 ? "inline-flex" : "none"}`}>
26+
{stars}
27+
<FaRegStar width={16} size={14} style={{
28+
marginLeft: 2
29+
}} />
30+
</div>
2331
</div>
2432
<h1>{ title }</h1>
2533
<p>
2634
{ description }
2735
</p>
2836
</div>
2937

30-
<script>
31-
const projectCard = document.getElementById("projectCard") as HTMLDivElement;
32-
33-
if(projectCard != undefined) {
34-
projectCard.onclick = () =>
35-
window.open(projectCard.getAttribute("data-href")!, "_blank");
36-
}
37-
</script>
3838

3939
<style lang="scss">
4040

@@ -82,16 +82,38 @@ const { icon, developer, title, description, href } = Astro.props;
8282
margin-top: 6px;
8383
}
8484

85+
.stars {
86+
display: inline-flex;
87+
width: 100%;
88+
font-size: 12px;
89+
font-weight: 400;
90+
color: lightgray;
91+
}
92+
93+
body.light .stars {
94+
color: color.adjust($color: gray, $lightness: -20%);
95+
}
96+
8597
.developer {
86-
display: flex;
98+
display: inline-flex;
99+
width: 100%;
100+
align-items: center;
87101

88102
& .developer-name {
89103
font-size: 12px;
104+
display: inline-flex;
90105
color: color.adjust($color: white, $lightness: -20%);
91106
font-weight: 600;
92-
margin-block: auto;
107+
width: 100%;
93108
margin-left: 6px;
94109
}
110+
111+
& .stars {
112+
display: inline-flex;
113+
width: max-content;
114+
align-items: center;
115+
font-size: 12px;
116+
}
95117
}
96118

97119
body.light .developer-name {

‎src/components/ProjectsComponent.astro‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,26 @@
11
---
2-
import ProjectCard, { type Project } from "./ProjectCard.astro";
2+
import type { Repository } from "../scripts/repos";
3+
import ProjectCard from "./ProjectCard.astro";
34
45
interface Props {
5-
projects: Array<Project>;
6+
projects: Array<Repository>;
67
}
78
89
const { projects } = Astro.props;
910
---
1011

1112
<div class="projects"> {
12-
projects.map(project => (
13+
projects.sort((pja, pjb) => pjb.stargazers_count - pja.stargazers_count).map(project =>
1314
<div class="item">
14-
<ProjectCard {...project} />
15+
<ProjectCard title={project.name}
16+
description={project.description}
17+
href={project.html_url}
18+
developer={project.owner.login}
19+
icon={project.owner.avatar_url}
20+
stars={project.stargazers_count}
21+
/>
1522
</div>
16-
))
23+
)
1724
} </div>
1825

1926
<style lang="scss">

‎src/components/SocialLinks.astro‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,17 @@ import { FaGithub, FaGitlab, FaXTwitter, FaReddit, FaDiscord } from "react-icons
44
import { FiMail } from "react-icons/fi";
55
import LinkButton from "./LinkButton.astro";
66
7+
interface Props {
8+
style?: string;
9+
}
10+
711
type SocialLink = {
812
name: string;
913
href: string;
1014
icon: IconType
1115
};
1216
13-
const socials: Array<SocialLink> = [
17+
export const socials: Array<SocialLink> = [
1418
{
1519
name: "GitHub",
1620
href: "https://github.com/retrozinndev",
@@ -42,19 +46,11 @@ const socials: Array<SocialLink> = [
4246
icon: FiMail
4347
}
4448
];
45-
---
4649
47-
<!-- Discord User Widget by vendicated (https://vendicated.dev/) -->
48-
<iframe id="discordEmbed"
49-
title="Discord"
50-
width={340}
51-
height={120}
52-
sandbox="allow-scripts"
53-
style="display: none"
54-
onclick=`window.open("${socials[2].href}", "_blank")`
55-
/>
50+
const { style } = Astro.props;
51+
---
5652

57-
<ul class="social-links"> {
53+
<ul class="social-links" style={style}> {
5854
socials.map(social =>
5955
<li class="social-link">
6056
<LinkButton href={social.href} external={true}
@@ -89,7 +85,14 @@ const socials: Array<SocialLink> = [
8985
.social-links {
9086
display: flex;
9187
flex-direction: row;
88+
flex-wrap: wrap;
9289
list-style: none;
9390
padding: 0;
9491
}
92+
93+
@media screen and (max-width: 800px) {
94+
.social-links {
95+
justify-content: center;
96+
}
97+
}
9598
</style>

‎src/pages/[lang]/about.astro‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
---
2+
import { getStaticPaths } from "../../i18n/route";
3+
import LinkButton from "../../components/LinkButton.astro";
4+
import PageLayout from "../../layouts/PageLayout.astro";
5+
6+
export { getStaticPaths };
7+
---
8+
9+
<PageLayout title="About">
10+
<div class="block">
11+
<h1>About</h1>
12+
<p>
13+
I'm a high school student from Brazil.
14+
I absolutely love open-source and programming stuff!
15+
</p>
16+
17+
<h2>Journey</h1>
18+
<p>
19+
I've been learning a lot stuff about programming and GNU/Linux since 2022.
20+
</p>
21+
<p>
22+
I've been using GNU/Linux as my primary operating system since last year, with
23+
<LinkButton href="https://fedoraproject.org/workstation" spacing={false} external>
24+
Fedora Workstation
25+
</LinkButton> and
26+
then in the start of this year, moving to
27+
<LinkButton href="https://archlinux.org" external spacing={false}>
28+
Arch Linux
29+
</LinkButton>.
30+
</p>
31+
32+
<h2>Interests</h2>
33+
<p>
34+
Besides tech, I really like watching Anime! I am a guy that really likes slice of life,
35+
romance, comedy and drama 😜, my favorite shows are
36+
<a href="https://pt.wikipedia.org/wiki/Oshi_no_Ko">Oshi no Ko</a>,
37+
<a href="https://pt.wikipedia.org/wiki/Bocchi_the_Rock!">Bocchi The Rock!</a> and
38+
<a href="https://pt.wikipedia.org/wiki/Kaoru_Hana_wa_Rin_to_Saku">The Fragrant Flower Blooms with Dignity</a>.
39+
</p>
40+
<LinkButton external href="https://myanimelist.net/profile/retrozinndev">
41+
My Anime List
42+
</LinkButton>
43+
44+
<h2>Recent Projects</h2>
45+
<p>
46+
I started working on a Desktop Environment recently, called
47+
<a href="https://github.com/retrozinndev/colorshell">colorshell</a>.
48+
It's made to be used with the
49+
<LinkButton href="https://hypr.land" external spacing={false}>
50+
Hyprland Wayland Compositor
51+
</LinkButton>,
52+
making usage of amazing technologies like GnomeJS, TypeScript, GTK 4, AGS and the Astal Libraries to create a nice environment for your desktop.
53+
</p>
54+
<p>
55+
There's also a music player I've been working on, but it's a little bit abandoned for now.
56+
Still, I have a lot of ideas for it, so I won't be completely abandoning the app!!
57+
<br>
58+
The Music Player is called <a href="https://github.com/retrozinndev/Vibe">Vibe</a>,
59+
it's expected to use GnomeJS, GTK, Gnim and GStreamer to make things work.
60+
</p>
61+
</div>
62+
</PageLayout>

0 commit comments

Comments
 (0)