Update package.json

Reviewed-on: #29

.forgejo/workflows/build_preview.yml

@@ -51,6 +51,8 @@ jobs:
         with:
           push: true
           tags: forgejo.neshweb.net/firq/firq-dev-website:${{ github.ref_name }}, forgejo.neshweb.net/firq/firq-dev-website:preview
+          build-args: |
+            version=${{ github.ref_name }}
 
   create-release:
     needs: [ build-site ]

.forgejo/workflows/build_release.yml

@@ -51,6 +51,8 @@ jobs:
         with:
           push: true
           tags: forgejo.neshweb.net/firq/firq-dev-website:${{ github.ref_name }}, forgejo.neshweb.net/firq/firq-dev-website:latest
+          build-args: |
+            version=${{ github.ref_name }}
 
   auto-deploy-dockge:
     needs: [ build-site ]

Dockerfile

@@ -1,16 +1,21 @@
-FROM node:22-alpine AS build
+FROM forgejo.neshweb.net/ci-docker-images/node-chromium:22 AS build
 WORKDIR /app
+ENV CI=true
+
 COPY . .
+
 RUN npm i
 RUN npm run astro telemetry disable
 RUN npm run build
+RUN rm ./dist/.original.favicon.ico
 
 FROM forgejo.neshweb.net/ci-docker-images/website-serve:2 AS runtime
+ARG version=0.0.1
+ENV version=${version}
 WORKDIR /
 
 COPY --from=build /app/dist /public
 COPY --from=build /app/serve.json /public/serve.json
-RUN rm /public/.original.favicon.ico
 
 EXPOSE 8081
-CMD serve --listen 8081 --no-clipboard /public
+CMD echo "Website version ${version} - powered by @Firq"; serve --listen 8081 --no-clipboard /public

Dockerfile.reports

@@ -1,9 +1,10 @@
 FROM forgejo.neshweb.net/ci-docker-images/website-serve:2 AS runtime
 
-ARG version
+ARG version=0.0.1
-ENV version=0.0.1
+ENV version=${version}
 
+WORKDIR /
 ADD reports /public
 
 EXPOSE 8081
-CMD echo $version && serve --listen 8081 --no-clipboard /public
+CMD echo "Website version ${version} - powered by @Firq"; serve --listen 8081 --no-clipboard /public

astro.config.mjs

@@ -1,8 +1,8 @@
-import { defineConfig } from 'astro/config';
-
 import mdx from "@astrojs/mdx";
 import sitemap from "@astrojs/sitemap";
+import criticalCss from 'astro-critical-css';
 import astroMetaTags from "astro-meta-tags";
+import { defineConfig } from 'astro/config';
 
 // https://astro.build/config
 export default defineConfig({
@@ -11,5 +11,5 @@ export default defineConfig({
   outDir: 'dist',
   publicDir: 'public',
   site: 'https://firq.dev/',
-  integrations: [sitemap(), mdx(), astroMetaTags()]
+  integrations: [sitemap(), mdx(), astroMetaTags(), criticalCss()],
 });

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@firq/fgosite",
 	"type": "module",
-	"version": "0.2.0-pre.93",
+	"version": "0.2.1-pre.1",
 	"private": true,
 	"scripts": {
 		"dev": "astro dev",
@@ -13,10 +13,11 @@
 	"dependencies": {
 		"@astro-community/astro-embed-youtube": "^0.5.6",
 		"@astrojs/check": "^0.9.4",
-		"@astrojs/mdx": "^4.2.3",
+		"@astrojs/mdx": "^4.3.2",
-		"@astrojs/sitemap": "^3.3.0",
+		"@astrojs/sitemap": "^3.4.2",
 		"@fontsource-variable/work-sans": "^5.2.5",
-		"astro": "^5.6.1",
+		"astro": "^5.12.7",
+		"astro-critical-css": "^0.0.7",
 		"astro-meta-tags": "^0.3.1",
 		"autoprefixer": "^10.4.21",
 		"iconoir": "^7.10.1",
@@ -24,7 +25,7 @@
 		"typescript": "^5.8.3"
 	},
 	"devDependencies": {
-		"unlighthouse": "^0.16.3"
+		"unlighthouse": "^0.17.2"
 	},
 	"browserslist": [
 		"last 2 versions",

public/ai.txt

@@ -0,0 +1,6 @@
+# Spawning AI
+# Prevent datasets from using the following file types
+
+User-Agent: *
+Disallow: /
+Disallow: *

public/robots.txt

@@ -1,8 +1,61 @@
 User-agent: *
 Disallow: /assets/data/
 
-User-agent: GPTBot
+User-agent: AI2Bot
+User-agent: Ai2Bot-Dolma
+User-agent: aiHitBot
+User-agent: Amazonbot
+User-agent: anthropic-ai
+User-agent: Applebot
+User-agent: Applebot-Extended
+User-agent: Brightbot 1.0
 User-agent: Bytespider
+User-agent: CCBot
+User-agent: ChatGPT-User
+User-agent: Claude-Web
+User-agent: ClaudeBot
+User-agent: cohere-ai
+User-agent: cohere-training-data-crawler
+User-agent: Cotoyogi
+User-agent: Crawlspace
+User-agent: Diffbot
+User-agent: DuckAssistBot
+User-agent: FacebookBot
+User-agent: Factset_spyderbot
+User-agent: FirecrawlAgent
+User-agent: FriendlyCrawler
+User-agent: Google-Extended
+User-agent: GoogleOther
+User-agent: GoogleOther-Image
+User-agent: GoogleOther-Video
+User-agent: GPTBot
+User-agent: iaskspider/2.0
+User-agent: ICC-Crawler
+User-agent: ImagesiftBot
+User-agent: img2dataset
+User-agent: imgproxy
+User-agent: ISSCyberRiskCrawler
+User-agent: Kangaroo Bot
+User-agent: Meta-ExternalAgent
+User-agent: Meta-ExternalFetcher
+User-agent: NovaAct
+User-agent: OAI-SearchBot
+User-agent: omgili
+User-agent: omgilibot
+User-agent: Operator
+User-agent: PanguBot
+User-agent: Perplexity-User
+User-agent: PerplexityBot
+User-agent: PetalBot
+User-agent: Scrapy
+User-agent: SemrushBot-OCOB
+User-agent: SemrushBot-SWA
+User-agent: Sidetrade indexer bot
+User-agent: TikTokSpider
+User-agent: Timpibot
+User-agent: VelenPublicWebCrawler
+User-agent: Webzio-Extended
+User-agent: YouBot
 Disallow: /
 
 Sitemap: https://firq.dev/sitemap-index.xml

src/components/aboutText.astro

@@ -20,7 +20,7 @@
     font-size: 16px;
     font-weight: 400;
     line-height: 24px;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, 'Segoe UI', sans-serif;
     max-width: min(87.5%, 360px);
     background-color: var(--c-primary-background);
     color: var(--c-primary-text);

src/components/cards/blogCard.astro

@@ -27,9 +27,6 @@ const date = new Date(pubdate).toLocaleDateString('en-GB', options_date)
 </a>
 
 <style>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
   .circle {
     display: none;
   }
@@ -77,6 +74,7 @@ const date = new Date(pubdate).toLocaleDateString('en-GB', options_date)
     min-height: 100%;
     border: 2px solid var(--c-primary-background);
     border-radius: 1.25rem;
+    transition: border-color var(--a-time-default) var(--a-animation-1);
   }
 
   a:hover article {
@@ -96,13 +94,17 @@ const date = new Date(pubdate).toLocaleDateString('en-GB', options_date)
       border-width: 0.25rem;
       border-color: var(--c-secondary-background);
       border-radius: 40%;
-      transition: all var(--a-time-short) var(--a-animation-1);
+      transition:
+        height var(--a-time-short) var(--a-animation-1),
+        width var(--a-time-short) var(--a-animation-1),
+        margin-right var(--a-time-short) var(--a-animation-1),
+        transform var(--a-time-short) var(--a-animation-1);
     }
 
     a:hover > .circle {
       height: 1.25rem;
       width: 1.25rem;
-      translate: -0.125rem;
+      transform: translateX(-0.125rem);
       margin-right: 4px;
     }
 

src/components/cards/ceCard.astro

@@ -28,16 +28,13 @@ const mlb_image = mlb ? 'mlbalign' : 'hidemlb'
 </article>
 
 <style>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
-
   .hidemlb {
     display: none;
     height: 1em;
   }
 
   article {
+    transition: border-color var(--a-time-default) var(--a-animation-1);
     border-radius: 1.25rem;
     border: 2px var(--c-primary-background) solid;
     background-color: var(--c-primary-background);

src/components/cards/favouriteCard.astro

@@ -32,18 +32,14 @@ const loadedImage = plsLoadImage(images, imagePath)
 </a>
 
 <style>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
-
   .heading {
     display: flex;
-    height: fit-content;
+    height: 3.5rem;
     min-height: 2.5rem;
     line-height: 1.75rem;
     font-size: 24px;
     color: var(--c-primary-text);
-    max-width: 200px;
+    max-width: 150px;
     padding-bottom: 0.3rem;
     font-weight: 500;
     margin: 0px;
@@ -52,6 +48,7 @@ const loadedImage = plsLoadImage(images, imagePath)
   }
 
   a {
+    transition: border-color var(--a-time-default) var(--a-animation-1);
     border-radius: 1rem;
     display: flex;
     flex-wrap: wrap;

src/components/cards/projectCard.astro

@@ -15,11 +15,8 @@ const target = url.startsWith("/") ? "" : "_blank"
 </a>
 
 <style>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
-
   a {
+    transition: border-color var(--a-time-default) var(--a-animation-1);
     align-items: center;
     justify-content: center;
     display: flex;

src/components/cards/servantCard.astro

@@ -47,7 +47,7 @@ let loading: "eager" | "lazy" = index <= 3 ? "eager" : "lazy";
 
 <style>
   article:hover {
-    transition: all var(--a-time-default) var(--a-animation-1);
+    transition: border-color var(--a-time-default) var(--a-animation-1), transform var(--a-time-default) var(--a-animation-1);
     transform: scale(1);
     border-color: var(--c-accent-1);
   }
@@ -97,7 +97,7 @@ let loading: "eager" | "lazy" = index <= 3 ? "eager" : "lazy";
   article:hover .expand-on-hover {
     transform: scaleY(1);
     border-color: var(--c-accent-1);
-    transition: all var(--a-time-default) var(--a-animation-1);
+    transition: border-color var(--a-time-default) var(--a-animation-1), transform var(--a-time-default) var(--a-animation-1);
   }
 
   .bond-ce {

src/components/cards/taCard.astro

@@ -57,9 +57,6 @@ const hasuser = user !== undefined ? 'display: flex' : 'display: none'
 </a>
 
 <style>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
   a {
     text-decoration: none;
     display: flex;
@@ -78,6 +75,7 @@ const hasuser = user !== undefined ? 'display: flex' : 'display: none'
   }
 
   a:hover {
+    transition: border-color var(--a-time-default) var(--a-animation-1), transform var(--a-time-default) var(--a-animation-1);
     transform: scale(1);
     border-color: var(--c-accent-1);
     z-index: 10;
@@ -171,7 +169,7 @@ const hasuser = user !== undefined ? 'display: flex' : 'display: none'
 
   a:hover .expand-on-hover {
     transform: scaleY(1);
-    transition: all var(--a-time-default) var(--a-animation-1);
+    transition: border-color var(--a-time-default) var(--a-animation-1), transform var(--a-time-default) var(--a-animation-1), background-color var(--a-time-default) var(--a-animation-1);
     background-color: var(--c-primary-background);
     border-color: var(--c-accent-1);
   }

src/components/cards/technologyCard.astro

@@ -28,15 +28,12 @@ const loadedImage = plsLoadImage(images_logos, imagePath)
 </a>
 
 <style>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
-
   a {
     text-decoration: none;
   }
 
   article {
+    transition: border-color var(--a-time-default) var(--a-animation-1);
     display: flex;
     position: relative;
     align-items: center;

src/components/fgotaHero.astro

@@ -33,7 +33,7 @@ const display = fadeout ? "": "display: none"
 
   a {
     font-weight: 500;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, 'Segoe UI', sans-serif;
     color: var(--c-primary-text);
     margin: 1rem 0px 0px;
     padding: 0.5rem 0.75rem;
@@ -41,12 +41,11 @@ const display = fadeout ? "": "display: none"
     background: var(--c-primary-background);
     border-radius: 10px;
     border: 2px var(--c-accent-1) solid;
-    transition: all var(--a-time-default) var(--a-animation-1);
+    transition: border-color var(--a-time-default) var(--a-animation-1);
   }
 
   a:hover {
     border-color: var(--c-accent-1-alt);
-    transition: all var(--a-time-default) var(--a-animation-1);
   }
 
   .fade {
@@ -66,6 +65,7 @@ const display = fadeout ? "": "display: none"
 
   @supports (background-clip: text) {
     a:hover .fancy {
+      transition: color var(--a-time-default) var(--a-animation-1);
       background: linear-gradient(125deg, var(--c-accent-1), var(--c-accent-1-alt), var(--c-accent-2) );
       background-clip: text;
       color: transparent;

src/components/links/linkCard.astro

@@ -19,9 +19,6 @@ const icon_src_url = `url("${icon.src}")`
 </a>
 
 <style define:vars={{ icon_src_url }}>
-  * {
-    transition: all var(--a-time-default) var(--a-animation-1);
-  }
   a {
     display: flex;
     align-items: center;
@@ -34,9 +31,11 @@ const icon_src_url = `url("${icon.src}")`
   }
 
   a:hover {
+    transition: border-color var(--a-time-default) var(--a-animation-1);
     border-color: var(--c-accent-1);
     & .icon {
-      background: var(--c-accent-1);
+      transition: background-color var(--a-time-default) var(--a-animation-1);
+      background-color: var(--c-accent-1);
     }
   }
 

src/components/navbar/navbarEntry.astro

@@ -40,7 +40,7 @@ let extraattributes = navtype === 'mobile' ? { tabindex: '0' } : {}
 
 <style define:vars={{ icon_src_url }}>
   * {
-    transition: all var(--a-time-default) var(--a-animation-1);
+    transition: color var(--a-time-default) var(--a-animation-1), background-color var(--a-time-default) var(--a-animation-1);
   }
   li {
     align-items: center;

src/components/titles/smallTitle.astro

@@ -23,7 +23,7 @@ const text = buttontext || baseurl
 <style>
   a {
     font-weight: 500;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, 'Segoe UI', sans-serif;
     color: var(--c-primary-text);
     margin: 1rem 0px 0px;
     padding: 0.5rem 0.75rem;
@@ -37,6 +37,7 @@ const text = buttontext || baseurl
   }
 
   a:hover {
+    transition: border-color var(--a-time-default) var(--a-animation-1);
     border-color: var(--c-accent-1);
   }
 
@@ -65,14 +66,18 @@ const text = buttontext || baseurl
     padding-top: 2rem;
     font-size: 3.25rem;
     font-weight: 700;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+    font-size-adjust: 0.52;
+    line-height: 1.4;
   }
 
   .sub {
     margin: 0 .5rem;
     font-size: 0.9rem;
     font-weight: 500;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+    font-size-adjust: 0.52;
+    line-height: 1.4;
   }
 
   .head {

src/components/titles/title.astro

@@ -34,14 +34,20 @@ import LinkContainer from "../links/linkContainer.astro";
     padding-top: 2rem;
     font-size: 3rem;
     font-weight: 700;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+    font-size-adjust: 0.52;
+    line-height: 1.4;
+    min-height: 4.8rem;
   }
 
   .sub {
     font-size: 1rem;
     font-weight: 400;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+    font-size-adjust: 0.52;
+    line-height: 1.4;
     width: 97.5%;
+    min-height: 1.5rem;
   }
 
   .fancy {

src/data/blog/deploying-this-round-2.md

@@ -63,7 +63,6 @@ COPY --from=build /app/dist /public
 COPY --from=build /app/serve.json /public/serve.json
 RUN rm -r /public/assets/data/
 
-ENV PORT 8081
 EXPOSE 8081
 
 CMD [ "serve", "public/", "-p", "8081" ]
@@ -116,7 +115,8 @@ One last hurdle was, ironically, Gitlab. Specifically, it was their `lighthouse`
 
 After some testing, I decided to just make my own version of the `lighthouse` container, without the user but with `unlighthouse` preinstalled (this also helps with processing times, as puppeteer takes a good amount of time to install each run).
 
-The `Dockerfile` can be found below (really simple again):
+<details>
+<summary>`Dockerfile` (really simple again)</summary>
 
 ```dockerfile
 FROM node:20.10.0-bookworm
@@ -131,6 +131,8 @@ RUN apt-get update && apt-get -y install --no-install-recommends chromium=${CHRO
 RUN npm install @unlighthouse/cli puppeteer
 ```
 
+</details>
+
 With this container, the CI step to actually run the tests became a lot easier:
 
 ```yaml

src/data/blog/deploying-this.md

@@ -60,7 +60,9 @@ deploy-site:
 ```
 
 First installing ssh and readying everything from the CI variables, this was a big change from the Pages configuration. But there was one thing that really bothered me: The ssh call. If you look at it, you can see that I left out the commands that are passed to `ssh`. There is a good reason: These are waaaay too long.
-If displayed as separated shell calls, they would look something like this:
+
+<details>
+<summary>commands formatted as a shell script</summary>
 
 ```shell
 screen -X -S website-firq-npx kill;
@@ -78,6 +80,8 @@ cd ~;
 screen -S website-firq-npx -dm npx serve public/ -p 9000 -c serve.json"
 ```
 
+</details>
+
 With the following directory structure on the remote host, this can easily be explained:
 
 ```plain
@@ -172,7 +176,8 @@ After completing, the new stage begins.
 Since the files are now built on the GitLab server and not in the Proxmox instance, the files need to be moved over during the pipeline. This can be achieved by a great utility known as `rsync`. It can be used for sending data via ssh to any client that supports it, which makes it the ideal tool for my use-case.
 I also recommend looking <a href="https://blog.mitsunee.com/post/copy-steam-games-rsync" target="_blank" rel="noopener noreferrer">at this blog post from Mitsunee</a> detailing how to use `ssh` and `rsync` to sync game libraries to the Steam Deck with ease.
 
-In my case, the resulting `.gitlab-ci.yml` looked like this:
+<details>
+<summary>.gitlab-ci.yml</summary>
 
 ```yaml
 deploy-site:
@@ -201,6 +206,8 @@ deploy-site:
     - ssh $DEPLOY_USER@$DEPLOY_HOST "screen -S website-firq-npx -dm npx serve public/ -p 9000 -c serve.json"
 ```
 
+</details>
+
 First, you have the rsync and ssh setup, which now also creates a new ssh-config for this. This really reduces the amount of arguments that need to be passed to ssh and rsync, making the whole flow less error-prone. My main issue with setting this up was to find out how to structure this, as I needed to setup ssh from the pipeline
 without causing any weird issues. But by using a custom ssh-key and config, it became really easy to get this to run.
 

src/data/blog/unlighthouse-ci.md

@@ -155,15 +155,12 @@ However, there is one interesting entry there: `urls`. This is a dynamic list of
 This is where the magic snippet comes in, which 1. fetches the sitemap, 2. replaces the URLs and 3. fetches each of the URLs once to warm up the `serve` webserver to ensure that the server-caching correctly works (improves the performance by a lot).
 
 ```typescript
-// 1. fetch sitemap
 const sitemap = await (await fetch('http://website:8081/sitemap-0.xml')).text();
 
-// 2. replace URLs
 const urls = sitemap.match(/<loc>(.*?)<\/loc>/g)!.map(
   (loc) => loc.replace(/<\/?loc>/g, '').replace(/https:\/\/firq.dev/g, 'http://website:8081')
 ); 
 
-// 3. warm up serve
 for (const url of urls) { await fetch(url) };
 ```
 
@@ -235,6 +232,6 @@ export default async (): Promise<UserConfig> => {
 After setting this whole thing up over the course of multiple months, with a variety of issues and shortcomings along the way, I hope that this is now ready for good.
 I will, however, write a Forgejo Action for me to reuse in the future, as this would enable me to easily test other sites with the same concept.
 
-If you want to check out the whole thing in action, check out <a href="https://forgejo.neshweb.net/Firq/firq-dev-website/src/branch/dev" target="_blank" rel="noopener noreferrer" >the website repository here </a>. In addition, you can find the reports that get generated <a href="unlighthouse.firq.dev" target="_blank" rel="noopener noreferrer" >here at unlighthouse.firq.dev</a>
+If you want to check out the whole thing in action, check out <a href="https://forgejo.neshweb.net/Firq/firq-dev-website/src/branch/dev" target="_blank" rel="noopener noreferrer" >the website repository here </a>. In addition, you can find the reports that get generated <a href="https://unlighthouse.firq.dev" target="_blank" rel="noopener noreferrer" >here at unlighthouse.firq.dev</a>
 
 Anyway, I wish I gave you an interesting insight in how Unlighthouse ensures good site quality - and how YOU can also profit  from website testing in your CI.

src/data/datafiles/favouritesdata.json

@@ -15,6 +15,12 @@
         "name": "Summer Skadi",
         "origin": "Fate/Grand Order",
         "imageFile": "summerskadi.png",
-        "link": "https://twitter.com/firq_ow/status/1816355501216596073"
+        "link": "https://youtu.be/qmR4s3DHZXw"
+    },
+    {
+        "name": "Summer Scathach",
+        "origin": "Fate/Grand Order",
+        "imageFile": "summerscathach.png",
+        "link": "https://youtu.be/k0E3kgx3eMA"
     }
 ]

src/layouts/Layout.astro

@@ -1,6 +1,6 @@
 ---
 import '@fontsource-variable/work-sans'
-import workSans from '@fontsource-variable/work-sans/files/work-sans-latin-wght-normal.woff2'
+import workSans from '@fontsource-variable/work-sans/files/work-sans-latin-wght-normal.woff2?url'
 
 import Navbar from '@components/navbar/navbar.astro'
 import NavbarEntry from '@components/navbar/navbarEntry.astro'
@@ -123,7 +123,7 @@ const mapped_navdata = navdata.map((item) => ({
 
     /* Fonts */
     --f-default: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-    --f-title: 'Work Sans Variable', sans-serif;
+    --f-title: 'Work Sans Variable', system-ui, 'Segoe UI', sans-serif;
 
     font-family: var(--f-default);
 
@@ -144,6 +144,8 @@ const mapped_navdata = navdata.map((item) => ({
 
     /* Scrollbar */
     scrollbar-color: var(--c-secondary-background) var(--c-primary-background);
+
+    /* Font Size Adjusting to prevent LCP issue */
   }
 
   body {

src/layouts/blogPost.astro

@@ -3,7 +3,7 @@ import SmallTitle from '@components/titles/smallTitle.astro'
 import Layout from './Layout.astro'
 const { frontmatter } = Astro.props
 
-const title = `${frontmatter.title} - Firq FGO Site`
+const title = `${frontmatter.title} - firq.dev`
 const description = frontmatter.description
 const options_date: Intl.DateTimeFormatOptions = {
   year: 'numeric',

src/layouts/blogSection.astro

@@ -135,7 +135,7 @@ const line = displayLine ? "flex" : "none"
       margin-left: 1.75rem;
     }
     .line {
-      margin-left: 2.6rem;
+      margin-left: 2.625rem;
       height: calc(100% + 6rem);
       translate: 0px -2rem;
     }

src/layouts/contactSection.astro

@@ -19,7 +19,7 @@ const { title } = Astro.props
     font-size: 24px;
     font-weight: 700;
     line-height: 32px;
-    font-family: 'Work Sans Adaptive', sans-serif;
+    font-family: 'Work Sans Variable', sans-serif;
     width: max-content;
     margin: 0 auto 0.5rem;
     &:after {

src/pages/404.astro

@@ -8,7 +8,7 @@ const description = "Error. This shouldn't happen :/"
 ---
 
 <Layout
-  title="404 - Firq FGO Site"
+  title="404 - firq.dev"
   currentpage="404"
   descriptionOverride={description}
 >
@@ -31,7 +31,7 @@ const description = "Error. This shouldn't happen :/"
     align-items: center;
   }
   h2 {
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, 'Segoe UI', sans-serif;
     font-weight: 500;
     color: var(--c-primary-text);
     font-size: 1.25rem;
@@ -45,7 +45,7 @@ const description = "Error. This shouldn't happen :/"
     text-align: center;
     width: fit-content;
     font-weight: 500;
-    font-family: 'Work Sans Variable', sans-serif;
+    font-family: 'Work Sans Variable', system-ui, 'Segoe UI', sans-serif;
     color: var(--c-primary-text);
     margin: 1rem 0px 0px;
     padding: 0.5rem 0.75rem;

src/pages/about.astro

@@ -16,7 +16,7 @@ const subtext =
 ---
 
 <Layout
-  title="About - Firq FGO Site"
+  title="About - firq.dev"
   currentpage="about"
   descriptionOverride={description}
 >

src/pages/blog/index.astro

@@ -17,7 +17,7 @@ blogEntries.sort(
 ---
 
 <Layout
-  title="Blog - Firq FGO Site"
+  title="Blog - firq.dev"
   currentpage="blog"
   descriptionOverride={description}
 >

src/pages/fgo.astro

@@ -28,11 +28,11 @@ const projects = [
 
 
 const data = structuredClone(favouritesdata);
-data.map((item) => { item.origin = "First 120 on NA" })
+data.map((item) => { if (item.name !== "Summer Scathach") {item.origin = "First 120 on NA"} else {item.origin = "After Forever"} })
 ---
 
 <Layout
-  title="FGO - Firq FGO Site"
+  title="FGO - firq.dev"
   currentpage="fgo"
   descriptionOverride={description}
 >

src/pages/index.astro

@@ -12,12 +12,13 @@ const description =
 ---
 
 <Layout
-  title="Home - Firq FGO Site"
+  title="Home - firq.dev"
   currentpage="home"
   descriptionOverride={description}
 >
   <Hi />
   <BaseSection title="About me">
+    <Placeholder height="0px"/>
     <AboutText/>
   </BaseSection>
   <BaseSection title="Favourites">

src/pages/projects.astro

@@ -14,7 +14,7 @@ const subtext =
 ---
 
 <Layout
-  title="Projects - Firq FGO Site"
+  title="Projects - firq.dev"
   currentpage="projects"
   descriptionOverride={description}
 >

src/pages/servants.astro

@@ -13,7 +13,7 @@ const description =
 ---
 
 <Layout
-  title="Servants - Firq FGO Site"
+  title="Servants - firq.dev"
   currentpage="fgo"
   descriptionOverride={description}
 >

src/pages/ta-collection.astro

@@ -35,7 +35,7 @@ const description = 'A collection of TAs previously completed be Firq.'
 ---
 
 <Layout
-  title="TA Collection - Firq FGO Site"
+  title="TA Collection - firq.dev"
   currentpage="fgo"
   descriptionOverride={description}
 >

unlighthouse.config.ts

@@ -1,4 +1,4 @@
-import type { UserConfig } from 'unlighthouse'
+import type { UserConfig } from '@unlighthouse/core'
 
 export default async (): Promise<UserConfig> => {
   /* fetch sitemap from debug container */
@@ -12,17 +12,21 @@ export default async (): Promise<UserConfig> => {
   /* actual config */
   return {
     lighthouseOptions: {
-      throttlingMethod: 'devtools',
+      throttlingMethod: 'simulate',
       throttling: {
+        rttMs: 150,
+        throughputKbps: 1638.4,
+        requestLatencyMs: 562.5,
+        downloadThroughputKbps: 1474.56,
+        uploadThroughputKbps: 675,
         cpuSlowdownMultiplier: 4,
-        requestLatencyMs: 150,
-        downloadThroughputKbps: 1638.4,
-        uploadThroughputKbps: 1638.4,
       },
       screenEmulation: {
+        mobile: true,
         width: 412,
         height: 823,
         deviceScaleFactor: 1.75,
+        disabled: false,
       },
       skipAudits: [ 'is-on-https', 'redirects-http', 'uses-http2' ],
     },
@@ -37,9 +41,9 @@ export default async (): Promise<UserConfig> => {
       buildStatic: true,
     },
     scanner: {
-      sitemap: true,
+      sitemap: false,
       dynamicSampling: false,
-      samples: 3,
+      samples: 1,
     },
     outputPath: 'unlighthouse-reports',
     cache: true,