Restructure and extra stuff

.gitignore

@@ -1,7 +1,6 @@
 # build output
 dist/
 .output/
-public/
 maintenance/
 
 # astro stuff
@@ -29,10 +28,3 @@ pnpm-debug.log*
 
 # macOS-specific files
 .DS_Store
-
-# exclude default png images
-static/**/*.png
-!static/assets/embed.png
-!static/assets/lurker.png
-!static/assets/padoru.png
-!static/assets/fedora.png

Dockerfile

@@ -9,7 +9,7 @@ FROM forgejo.neshweb.net/ci-docker-images/website-serve:2 AS runtime
 
 COPY --from=build /app/dist /public
 COPY --from=build /app/serve.json /public/serve.json
-RUN rm -r /public/data/
+RUN rm /public/.original.favicon.ico
 
 EXPOSE 8081
 CMD serve public/ -p 8081

astro.config.mjs

@@ -8,7 +8,7 @@ export default defineConfig({
   sitemap: true,
   base: '/',
   outDir: 'dist',
-  publicDir: 'static',
+  publicDir: 'public',
   site: 'https://firq.dev/',
   integrations: [sitemap(), mdx()]
 });

package-lock.json

@@ -1,12 +1,12 @@
 {
 	"name": "@firq/fgosite",
-	"version": "0.2.0-pre.32",
+	"version": "0.2.0-pre.40",
 	"lockfileVersion": 3,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "@firq/fgosite",
-			"version": "0.2.0-pre.32",
+			"version": "0.2.0-pre.40",
 			"dependencies": {
 				"@astro-community/astro-embed-youtube": "^0.5.2",
 				"@astrojs/check": "^0.9.4",
@@ -3183,9 +3183,9 @@
 			}
 		},
 		"node_modules/caniuse-lite": {
-			"version": "1.0.30001669",
-			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001669.tgz",
-			"integrity": "sha512-DlWzFDJqstqtIVx1zeSpIMLjunf5SmwOw0N2Ck/QSQdS8PLS4+9HrLaYei4w8BIAL7IB/UEDu889d8vhCTPA0w==",
+			"version": "1.0.30001671",
+			"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001671.tgz",
+			"integrity": "sha512-jocyVaSSfXg2faluE6hrWkMgDOiULBMca4QLtDT39hw1YxaIPHWc1CcTCKkPmHgGH6tKji6ZNbMSmUAvENf2/A==",
 			"funding": [
 				{
 					"type": "opencollective",
@@ -6832,15 +6832,16 @@
 			}
 		},
 		"node_modules/prettier": {
-			"version": "2.8.7",
-			"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.7.tgz",
-			"integrity": "sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw==",
+			"version": "3.3.3",
+			"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
+			"integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
 			"optional": true,
+			"peer": true,
 			"bin": {
-				"prettier": "bin-prettier.js"
+				"prettier": "bin/prettier.cjs"
 			},
 			"engines": {
-				"node": ">=10.13.0"
+				"node": ">=14"
 			},
 			"funding": {
 				"url": "https://github.com/prettier/prettier?sponsor=1"
@@ -8281,6 +8282,21 @@
 				"prettier": "2.8.7"
 			}
 		},
+		"node_modules/yaml-language-server/node_modules/prettier": {
+			"version": "2.8.7",
+			"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.7.tgz",
+			"integrity": "sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw==",
+			"optional": true,
+			"bin": {
+				"prettier": "bin-prettier.js"
+			},
+			"engines": {
+				"node": ">=10.13.0"
+			},
+			"funding": {
+				"url": "https://github.com/prettier/prettier?sponsor=1"
+			}
+		},
 		"node_modules/yaml-language-server/node_modules/request-light": {
 			"version": "0.5.8",
 			"resolved": "https://registry.npmjs.org/request-light/-/request-light-0.5.8.tgz",

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@firq/fgosite",
 	"type": "module",
-	"version": "0.2.0-pre.40",
+	"version": "0.2.0-pre.41",
 	"private": true,
 	"scripts": {
 		"dev": "astro dev",

src/assets/custom-svg/forgejo.svg

@@ -0,0 +1,37 @@
+<svg viewBox="0 0 212 212" xmlns="http://www.w3.org/2000/svg">
+  <metadata
+    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+    xmlns:cc="http://creativecommons.org/ns#"
+    xmlns:dc="http://purl.org/dc/elements/1.1/"
+  >
+    <rdf:RDF>
+      <cc:Work rdf:about="https://codeberg.org/forgejo/governance/src/branch/main/branding#logo">
+        <dc:title>Forgejo logo</dc:title>
+        <cc:creator rdf:resource="https://caesarschinas.com/"><cc:attributionName>Caesar Schinas</cc:attributionName></cc:creator>
+        <cc:license rdf:resource="http://creativecommons.org/licenses/by-sa/4.0/" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <style type="text/css">
+    :root, svg {
+      color-scheme: dark light;
+    }
+    circle {
+      fill: none;
+      stroke: currentColor;
+      stroke-width: 15;
+    }
+    path {
+      fill: none;
+      stroke: currentColor;
+      stroke-width: 25;
+    }
+  </style>
+  <g transform="translate(6,6)">
+    <path d="M58 168 v-98 a50 50 0 0 1 50-50 h20" />
+    <path d="M58 168 v-30 a50 50 0 0 1 50-50 h20" />
+    <circle cx="142" cy="20" r="18" />
+    <circle cx="142" cy="88" r="18" />
+    <circle cx="58" cy="180" r="18" />
+  </g>
+</svg>

src/assets/custom-svg/rayshift.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+<svg width="124.48" height="203.92" version="1.1" viewBox="0 0 124.48 203.92" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+ <rect x=".0051316" y="-.0039062" width="124.49" height="204" fill="none"/>
+ <path transform="translate(-58.01 -18.484)" d="m119.56 18.484-61.354 74.137 23.795 27.727-23.992 27.334 62.535 74.725 61.943-75.119-24.582-27.332 17.699-19.666-20.451-24.58-1.377-1.7695-0.01-2.3594 1.1894-4.3262 3.3438-4.3262-2.9512-2.5566-23.006 28.709-12.389-15.141-28.908 35.199-15.141-16.715 43.457-52.111 15.732 19.271 2.7539-3.5391-5.1133-5.5078-3.5391-5.7012-2.5566-5.3105 0.19532-4.5215 3.1465-4.918zm22.811 67.646 2.3613 0.19727 13.223 13.273-8.1113 9.7344-14.748-17.699zm-22.416 9.2422 21.236 24.975-20.844 24.385-21.041-24.777zm-29.105 35.789 29.105 35.594 29.889-35.396 14.158 16.322-43.852 52.896-43.852-52.109z" stroke="#000" stroke-width=".40441"/>
+</svg>

src/assets/custom-svg/twitch.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M2.149 0l-1.612 4.119v16.836h5.731v3.045h3.224l3.045-3.045h4.657l6.269-6.269v-14.686h-21.314zm19.164 13.612l-3.582 3.582h-5.731l-3.045 3.045v-3.045h-4.836v-15.045h17.194v11.463zm-3.582-7.343v6.262h-2.149v-6.262h2.149zm-5.731 0v6.262h-2.149v-6.262h2.149z" fill-rule="evenodd" clip-rule="evenodd"/></svg>

src/components/cards/ceCard.astro

@@ -1,6 +1,6 @@
 ---
 import { Image } from 'astro:assets'
-import mlb_ce from '../../assets/ce/mlb.webp'
+import mlb_ce from '@assets/ce/mlb.webp'
 import type { GlobImage } from '../../types/generic'
 import { plsLoadImage } from '../../utils/tools'
 

src/components/fgotaHero.astro

@@ -54,6 +54,10 @@ const display = fadeout ? "": "display: none"
     width: 100%;
   }
 
+  span {
+    margin: 0 .5rem;
+  }
+
   .fancy {
     color: var(--c-accent-1);
   }

src/components/links/linkCard.astro

@@ -0,0 +1,47 @@
+---
+import type { ImageMetadata } from 'astro'
+
+
+export interface Props {
+  text: string
+  icon: ImageMetadata
+  link: string
+}
+
+const { text, icon, link } = Astro.props
+const icon_src_url = `url("${icon.src}")`
+
+---
+
+<a href={link} target="_blank" rel="noopener noreferrer">
+  <div class="icon"></div>
+  <span class="visually-hidden">{text}</span>
+</a>
+
+<style define:vars={{ icon_src_url }}>
+  a {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 36px;
+    height: 36px;
+    background-color: var(--c-primary-background);
+    border-radius: .35rem;
+    border: 2px solid var(--c-primary-text);
+  }
+
+  a:hover {
+    border-color: var(--c-accent-1);
+    & .icon {
+      background: var(--c-accent-1);
+    }
+  }
+
+  .icon {
+    mask: var(--icon_src_url) no-repeat center;
+    mask-size: contain;
+    background-color: var(--c-primary-text);
+    height: 65%;
+    width: 65%;
+  }
+</style>

src/components/links/linkContainer.astro

@@ -0,0 +1,58 @@
+---
+import LinkCard from "./linkCard.astro"
+
+import mastodon from 'iconoir/icons/mastodon.svg'
+import youtube from 'iconoir/icons/youtube.svg'
+import forgejo from '@assets/custom-svg/forgejo.svg'
+import rayshift from '@assets/custom-svg/rayshift.svg'
+import twitch from '@assets/custom-svg/twitch.svg'
+
+const links = [
+  {
+    link: "https://www.youtube.com/@Firq_",
+    icon: youtube,
+    text: "Youtube",
+  },
+  {
+    link: "https://mastodon.neshweb.net/@Firq",
+    icon: mastodon,
+    text: "Mastodon",
+  },
+  {
+    link: "https://twitch.tv/Firq",
+    icon: twitch,
+    text: "Twitch",
+  },
+  {
+    link: "https://forgejo.neshweb.net/Firq",
+    icon: forgejo,
+    text: "Forgejo",
+  },
+  {
+    link: "https://rayshift.io/na/firq",
+    icon: rayshift,
+    text: "Rayshift",
+  }
+]
+---
+
+<div>
+  {
+    links.map(
+      (item) => <LinkCard {...item} />
+    )
+  }
+</div>
+
+<style>
+  div {
+    margin-top: .75rem;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: auto;
+    column-gap: 0.5rem;
+  }
+</style>

src/components/navbar/navbar.astro

@@ -1,6 +1,6 @@
 ---
 import { Image } from 'astro:assets'
-import logo from '../../assets/logo.svg'
+import logo from '@assets/logo.svg'
 import hamburger from 'iconoir/icons/menu.svg'
 const hamburger_src_url = `url("${hamburger.src}")`
 ---

src/components/titles/smallTitle.astro

@@ -58,6 +58,7 @@ const displayBackButton = returnbutton ? "": "display: none"
   }
 
   .head {
+    margin: 0 .5rem;
     hyphens: auto;
     padding-top: 2rem;
     font-size: 3.25rem;
@@ -66,6 +67,7 @@ const displayBackButton = returnbutton ? "": "display: none"
   }
 
   .sub {
+    margin: 0 .5rem;
     font-size: 0.9rem;
     font-weight: 500;
     font-family: 'Work Sans Variable', sans-serif;

src/components/titles/title.astro

@@ -1,9 +1,12 @@
 ---
+import LinkContainer from "../links/linkContainer.astro";
+
 ---
 
 <div class="wrap">
   <div class="head">Hi, I'm <span class="fancy">Firq</span></div>
   <div class="sub">&lt;/ Software dev / Scathach enthusiast / Germany /&gt;</div>
+  <LinkContainer />
   <div class="fade"></div>
 </div>
 

src/layouts/Layout.astro

@@ -2,10 +2,10 @@
 import "@fontsource-variable/work-sans";
 import workSans from "@fontsource-variable/work-sans/files/work-sans-latin-wght-normal.woff2"
 
-import Navbar from '../components/navbar/navbar.astro'
-import NavbarEntry from '../components/navbar/navbarEntry.astro'
-import navdata from '../../static/data/_navdata.json'
-import embed from '../assets/embed.png'
+import Navbar from '@components/navbar/navbar.astro'
+import NavbarEntry from '@components/navbar/navbarEntry.astro'
+import navdata from '@content/data/navdata.json'
+import embed from '@assets/embed.png'
 
 import home from 'iconoir/icons/home.svg'
 import servants from 'iconoir/icons/task-list.svg'
@@ -126,6 +126,13 @@ const mapped_navdata = navdata.map((item) => ({
     --c-accent-1: #b86cff;
     --c-accent-1-alt: #c105ff;
     --c-accent-2: #ff0077;
+
+    --c-rgb-primary-background: 27, 27, 27;
+    --c-rgb-secondary-background: 51, 51, 51;
+    --c-rgb-primary-text: 238, 238, 238;
+    --c-rgb-accent-1: 184, 108, 255;
+    --c-rgb-accent-1-alt: 193, 5, 255;
+    --c-rgb-accent-2: 255, 0, 119;
   }
   body {
     background: var(--c-secondary-background);

src/layouts/blogPost.astro

@@ -1,5 +1,5 @@
 ---
-import SmallTitle from '../components/titles/smallTitle.astro'
+import SmallTitle from '@components/titles/smallTitle.astro'
 import Layout from './Layout.astro'
 const { frontmatter } = Astro.props
 

src/layouts/customFooter.astro

@@ -1,8 +1,8 @@
 ---
-import okita from '../assets/okita.png'
-import atlas from '../assets/atlas.png'
-import foxcat from '../assets/lurker.png'
-import padoru from '../assets/padoru.png'
+import okita from '@assets/okita.png'
+import atlas from '@assets/atlas.png'
+import foxcat from '@assets/lurker.png'
+import padoru from '@assets/padoru.png'
 import { Image } from 'astro:assets'
 
 import packagejson from '../../package.json'

src/pages/404.astro

@@ -1,8 +1,8 @@
 ---
 import { Image } from 'astro:assets'
-import Layout from '../layouts/Layout.astro'
-import sadshishou from '../assets/shishousad.webp'
-import SmallTitle from '../components/titles/smallTitle.astro'
+import Layout from '@layouts/Layout.astro'
+import sadshishou from '@assets/shishousad.webp'
+import SmallTitle from '@components/titles/smallTitle.astro'
 
 const description = "Error. This shouldn't happen :/"
 ---

src/pages/about.astro

@@ -1,14 +1,14 @@
 ---
-import Layout from '../layouts/Layout.astro'
+import Layout from '@layouts/Layout.astro'
 
-import ContactSection from '../layouts/contactSection.astro'
-import ContactCard from '../components/cards/contactCard.astro'
-import contactdata from '../../static/data/_contactdata.json'
+import ContactSection from '@layouts/contactSection.astro'
+import ContactCard from '@components/cards/contactCard.astro'
+import contactdata from '@content/data/contactdata.json'
 
-import CustomFooter from '../layouts/customFooter.astro'
-import TechnologyCard from '../components/cards/technologyCard.astro'
-import technologydata from '../../static/data/_technologydata.json'
-import SmallTitle from '../components/titles/smallTitle.astro'
+import CustomFooter from '@layouts/customFooter.astro'
+import TechnologyCard from '@components/cards/technologyCard.astro'
+import technologydata from '@content/data/technologydata.json'
+import SmallTitle from '@components/titles/smallTitle.astro'
 
 const description =
   "A summary of the technologies used as well as my contact information. You'll also find disclaimers and thank you notes for the people that helped me."

src/pages/blog/index.astro

@@ -1,8 +1,8 @@
 ---
-import Layout from '../../layouts/Layout.astro'
-import BlogCard from '../../components/cards/blogCard.astro'
-import BlogSection from '../../layouts/blogSection.astro'
-import SmallTitle from '../../components/titles/smallTitle.astro'
+import Layout from '@layouts/Layout.astro'
+import BlogCard from '@components/cards/blogCard.astro'
+import BlogSection from '@layouts/blogSection.astro'
+import SmallTitle from '@components/titles/smallTitle.astro'
 import { getCollection } from 'astro:content'
 
 const description =

src/pages/index.astro

@@ -1,10 +1,10 @@
 ---
-import Layout from '../layouts/Layout.astro'
-import BaseSection from '../layouts/baseSection.astro'
-import FavouriteCard from '../components/cards/favouriteCard.astro'
-import favouritesdata from '../../static/data/_favouritesdata.json'
-import Hi from '../components/titles/title.astro'
-import AboutText from '../components/aboutText.astro'
+import Layout from '@layouts/Layout.astro'
+import BaseSection from '@layouts/baseSection.astro'
+import FavouriteCard from '@components/cards/favouriteCard.astro'
+import favouritesdata from '@content/data/favouritesdata.json'
+import Hi from '@components/titles/title.astro'
+import AboutText from '@components/aboutText.astro'
 
 const description =
   'The very own page of Firq for providing informating about TA servants, listing past TA achievements and hosting a blog for talking about FGO, Programming and other stuff'

src/pages/servants.astro

@@ -1,13 +1,13 @@
 ---
-import Layout from '../layouts/Layout.astro'
-import ServantSection from '../layouts/servantSection.astro'
+import Layout from '@layouts/Layout.astro'
+import ServantSection from '@layouts/servantSection.astro'
 
-import ServantCard from '../components/cards/servantCard.astro'
-import servantdata from '../../static/data/_servantdata.json'
+import ServantCard from '@components/cards/servantCard.astro'
+import servantdata from '@content/data/servantdata.json'
 
-import CeCard from '../components/cards/ceCard.astro'
-import cedata from '../../static/data/_cedata.json'
-import SmallTitle from '../components/titles/smallTitle.astro'
+import CeCard from '@components/cards/ceCard.astro'
+import cedata from '@content/data/cedata.json'
+import SmallTitle from '@components/titles/smallTitle.astro'
 
 const description =
   'A list of all the servants and ces that Firq can offer up on support for TA.'

src/pages/ta-collection.astro

@@ -5,14 +5,14 @@
 // > You could have the notable ones like you do now, but at the bottom, there could be a drop-down or "expand" or "more" or
 // > some other section like that which you could click and show the rest
 
-import Layout from '../layouts/Layout.astro'
+import Layout from '@layouts/Layout.astro'
 
-import TaSection from '../layouts/taSection.astro'
-import TaCard from '../components/cards/taCard.astro'
-import tadata from '../../static/data/_tadata.json'
-import featured_data from '../../static/data/_featureddata.json'
-import FgotaHero from '../components/fgotaHero.astro'
-import SmallTitle from '../components/titles/smallTitle.astro'
+import TaSection from '@layouts/taSection.astro'
+import TaCard from '@components/cards/taCard.astro'
+import tadata from '@content/data/tadata.json'
+import featured_data from '@content/data/featureddata.json'
+import FgotaHero from '@components/fgotaHero.astro'
+import SmallTitle from '@components/titles/smallTitle.astro'
 
 const important_data = tadata.filter(function (el) {
   return [

tsconfig.json

@@ -1,3 +1,12 @@
 {
-  "extends": "astro/tsconfigs/strict"
+  "extends": "astro/tsconfigs/strict",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@assets/*": [ "src/assets/*" ],
+      "@components/*": [ "src/components/*" ],
+      "@content/*": [ "src/content/*" ],
+      "@layouts/*": [ "src/layouts/*" ]
+    }
+  }
 }