aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--public/Bluesky_Logo.svg4
-rw-r--r--public/fediverse.svg17
-rw-r--r--src/components/SocialNavbar.astro167
3 files changed, 113 insertions, 75 deletions
diff --git a/public/Bluesky_Logo.svg b/public/Bluesky_Logo.svg
new file mode 100644
index 0000000..b60d51c
--- /dev/null
+++ b/public/Bluesky_Logo.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="600" height="530" version="1.1" xmlns="http://www.w3.org/2000/svg">
+ <path d="m135.72 44.03c66.496 49.921 138.02 151.14 164.28 205.46 26.262-54.316 97.782-155.54 164.28-205.46 47.98-36.021 125.72-63.892 125.72 24.795 0 17.712-10.155 148.79-16.111 170.07-20.703 73.984-96.144 92.854-163.25 81.433 117.3 19.964 147.14 86.092 82.697 152.22-122.39 125.59-175.91-31.511-189.63-71.766-2.514-7.3797-3.6904-10.832-3.7077-7.8964-0.0174-2.9357-1.1937 0.51669-3.7077 7.8964-13.714 40.255-67.233 197.36-189.63 71.766-64.444-66.128-34.605-132.26 82.697-152.22-67.108 11.421-142.55-7.4491-163.25-81.433-5.9562-21.282-16.111-152.36-16.111-170.07 0-88.687 77.742-60.816 125.72-24.795z" fill="#1185fe"/>
+</svg> \ No newline at end of file
diff --git a/public/fediverse.svg b/public/fediverse.svg
new file mode 100644
index 0000000..5f04313
--- /dev/null
+++ b/public/fediverse.svg
@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="196.52mm" height="196.52mm" viewBox="0 0 196.52 196.52">
+ <path fill="#a730b8" d="M47.9242 72.7966a18.2278 18.2278 0 0 1-7.7959 7.7597l42.7984 42.9653 10.3182-5.2291zm56.4524 56.6704-10.3182 5.2291 21.686 21.7708a18.2278 18.2278 0 0 1 7.7975-7.7608z"/>
+ <path fill="#5496be" d="M129.6645 102.0765l1.7865 11.4272 27.4149-13.8942a18.2278 18.2278 0 0 1-4.9719-9.8124zm-14.0658 7.1282-57.2891 29.0339a18.2278 18.2278 0 0 1 4.9728 9.8133l54.1027-27.4194z"/>
+ <path fill="#ce3d1a" d="M69.5312 91.6539l8.1618 8.1933 29.269-57.1387a18.2278 18.2278 0 0 1-9.787-5.0219zm-7.1897 14.0363-14.0022 27.3353a18.2278 18.2278 0 0 1 9.786 5.0214l12.3775-24.1639z"/>
+ <path fill="#d0188f" d="M39.8906 80.6763a18.2278 18.2278 0 0 1-10.8655 1.7198l8.1762 52.2981a18.2278 18.2278 0 0 1 10.8645-1.7198z"/>
+ <path fill="#5b36e9" d="M63.3259 148.3109a18.2278 18.2278 0 0 1-1.7322 10.8629l52.2893 8.3907a18.2278 18.2278 0 0 1 1.7322-10.8629z"/>
+ <path fill="#30b873" d="M134.9148 146.9182a18.2278 18.2278 0 0 1 9.788 5.0224l24.1345-47.117a18.2278 18.2278 0 0 1-9.7875-5.0229z"/>
+ <path fill="#ebe305" d="M126.1329 33.1603a18.2278 18.2278 0 0 1-7.7975 7.7608l37.3765 37.5207a18.2278 18.2278 0 0 1 7.7969-7.7608z"/>
+ <path fill="#f47601" d="M44.7704 51.6279a18.2278 18.2278 0 0 1 4.9723 9.8123l47.2478-23.9453a18.2278 18.2278 0 0 1-4.9718-9.8113z"/>
+ <path fill="#57c115" d="M118.2491 40.9645a18.2278 18.2278 0 0 1-10.8511 1.8123l4.1853 26.8 11.42 1.8324zm-4.2333 44.1927 9.8955 63.3631a18.2278 18.2278 0 0 1 10.88-1.6278l-9.355-59.9035z"/>
+ <path fill="#dbb210" d="M49.7763 61.6412a18.2278 18.2278 0 0 1-1.694 10.8686l26.8206 4.3077 5.2715-10.2945zm45.9677 7.382-5.272 10.2955 63.3713 10.1777a18.2278 18.2278 0 0 1 1.7606-10.8593z"/>
+ <path fill="#ffca00" d="M93.4385 23.8419a1 1 0 1 0 33.0924 1.8025 1 1 0 1 0-33.0924-1.8025"/>
+ <path fill="#64ff00" d="M155.314 85.957a1 1 0 1 0 33.0923 1.8025 1 1 0 1 0-33.0923-1.8025"/>
+ <path fill="#00a3ff" d="M115.3466 163.9824a1 1 0 1 0 33.0923 1.8025 1 1 0 1 0-33.0923-1.8025"/>
+ <path fill="#9500ff" d="M28.7698 150.0898a1 1 0 1 0 33.0923 1.8025 1 1 0 1 0-33.0923-1.8025"/>
+ <path fill="#ff0000" d="M15.2298 63.4781a1 1 0 1 0 33.0923 1.8025 1 1 0 1 0-33.0923-1.8025"/>
+</svg> \ No newline at end of file
diff --git a/src/components/SocialNavbar.astro b/src/components/SocialNavbar.astro
index 3ad89a5..5fb9045 100644
--- a/src/components/SocialNavbar.astro
+++ b/src/components/SocialNavbar.astro
@@ -3,86 +3,103 @@ import "@fortawesome/fontawesome-free/css/all.min.css";
---
<style>
- .dark-social-navbar-wrapper {
- display: flex;
- margin-top: 5px;
- justify-content: center;
- }
+ .dark-social-navbar-wrapper {
+ display: flex;
+ margin-top: 5px;
+ justify-content: center;
+ }
- .dark-social-navbar {
- display: flex;
- gap: 15px;
- padding: 10px 20px;
- border-radius: 8px;
- }
+ .dark-social-navbar {
+ display: flex;
+ gap: 15px;
+ padding: 10px 20px;
+ border-radius: 8px;
+ }
- .dark-social-icon {
- display: flex;
- justify-content: center;
- align-items: center;
- width: 40px;
- height: 40px;
- border-radius: 50%;
- background-color: #3a3f4b;
- color: #fff;
- text-decoration: none;
- transition:
- background-color 0.3s ease,
- transform 0.3s ease;
- }
+ .dark-social-icon {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ background-color: #3a3f4b;
+ color: #fff;
+ text-decoration: none;
+ transition:
+ background-color 0.3s ease,
+ transform 0.3s ease;
+ }
- .dark-social-icon:hover::before {
- content: attr(title);
- background-color: #333;
- color: #fff;
- padding: 4px 8px;
- border-radius: 4px;
- position: absolute;
- bottom: 120%;
- left: 50%;
- transform: translateX(-50%);
- white-space: nowrap;
- opacity: 0;
- transition: opacity 0.3s ease;
-}
- .dark-social-icon:hover::before {
- opacity: 1;
- }
+ .dark-social-icon:hover::before {
+ content: attr(title);
+ background-color: #333;
+ color: #fff;
+ padding: 4px 8px;
+ border-radius: 4px;
+ position: absolute;
+ bottom: 120%;
+ left: 50%;
+ transform: translateX(-50%);
+ white-space: nowrap;
+ opacity: 0;
+ transition: opacity 0.3s ease;
+ }
+ .dark-social-icon:hover::before {
+ opacity: 1;
+ }
- .dark-social-icon:hover {
- background-color: #4a4f5b;
- transform: scale(1.1);
- }
+ .dark-social-icon:hover {
+ background-color: #4a4f5b;
+ transform: scale(1.1);
+ }
</style>
<div class="dark-social-navbar-wrapper">
- <div class="dark-social-navbar">
- <a
- href="https://github.com/pinapelz"
- class="dark-social-icon"
- title="GitHub"><i class="fab fa-github"></i></a
- >
- <a
- href="https://twitter.com/pinapelz"
- class="dark-social-icon"
- title="Twitter/X"><i class="fab fa-x-twitter"></i></a
- >
- <a href="https://blog.pinapelz.com" class="dark-social-icon" title="Blog"
- ><i class="fa fa-book"></i></a
- >
- <a
- href="https://discord.com/users/246787839570739211"
- title="Discord"
- class="dark-social-icon"><i class="fab fa-discord"></i></a
- >
- <a href="mailto:yukais@pinapelz.com" class="dark-social-icon" title="Email"
- ><i class="fa fa-envelope"></i></a
- >
- <a href="https://pinapelz.moe" class="dark-social-icon" title="pinapelz.moe"
- ><i class="fa fa-globe"></i></a
- >
- <a href="/Yukai_Shan.asc" class="dark-social-icon" title="PGP"
- ><i class="fa fa-key"></i></a
- >
- </div>
+ <div class="dark-social-navbar">
+ <a
+ href="https://github.com/pinapelz"
+ class="dark-social-icon"
+ title="GitHub"><i class="fab fa-github"></i></a
+ >
+ <a
+ href="https://twitter.com/pinapelz"
+ class="dark-social-icon"
+ title="Twitter/X"><i class="fab fa-x-twitter"></i></a
+ >
+ <a
+ href="https://bsky.app/profile/pinapelz.moekyun.me"
+ class="dark-social-icon"
+ title="Bluesky"><img src="Bluesky_Logo.svg" width="60%" /></a
+ >
+ <a
+ href="https://mk.arks.cafe/@pinapelz"
+ class="dark-social-icon"
+ title="Fediverse (Misskey)"
+ ><img src="fediverse.svg" width="75%" /></a
+ >
+ <a
+ href="https://discord.com/users/246787839570739211"
+ title="Discord"
+ class="dark-social-icon"><i class="fab fa-discord"></i></a
+ >
+ <a
+ href="mailto:yukais@pinapelz.com"
+ class="dark-social-icon"
+ title="Email"><i class="fa fa-envelope"></i></a
+ >
+ <a
+ href="https://blog.pinapelz.com"
+ class="dark-social-icon"
+ title="Blog"><i class="fa fa-book"></i></a
+ >
+ <a
+ href="https://pinapelz.moe"
+ class="dark-social-icon"
+ title="pinapelz.moe"><i class="fa fa-globe"></i></a
+ >
+ <a href="/Yukai_Shan.asc" class="dark-social-icon" title="PGP"
+ ><i class="fa fa-key"></i></a
+ >
+ </div>
</div>
send patches to the email below
yukais@pinapelz.com
include the subject [PATCH repo_name]
pinapelz.com
homepage