Improve Issue Templates and Add Lighthouse CI Integration

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -1,6 +1,6 @@
 name: Bug Report
 description: Submit a report to help improve our project. Please write in English.
-title: "{ BUG } Provide a short title for your bug"
+title: "[BUG] Provide a short title for your bug"
 labels: ["bug"]
 body:
   - type: markdown
@@ -43,3 +43,14 @@ body:
       description: Which operating system are you using (e.g., Windows 11/Linux Distro/Steam Deck)?
     validations:
       required: true
+  - type: dropdown
+    id: browsers
+    attributes:
+      label: What browsers are you seeing the problem on?
+      multiple: true
+      options:
+        - Chrome (including Arc, Brave, Opera, Vivaldi)
+        - Microsoft Edge
+        - Firefox
+        - Safari
+        - Other (please specify)

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -1,6 +1,6 @@
 name: Feature Request
 description: Request a new feature.
-title: "{ REQUEST} "
+title: "[REQUEST] "
 labels: ["enhancement"]
 body:
   - type: markdown

.github/workflows/build.yml

@@ -8,19 +8,25 @@ on:
 
 jobs:
   build:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-24.04
 
     steps:
       - name: Check out Git repository
         uses: actions/checkout@v4
 
       - name: Install Bun
         uses: oven-sh/setup-bun@v2
-        with:
-          node-version: 20.18.0
 
       - name: Install dependencies
         run: bun install
 
       - name: Build Next.js App
         run: bun run build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.bun/install/cache
+            ${{ github.workspace }}/.next/cache
+          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
+          restore-keys: |
+            ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-

.github/workflows/lighthouse.yml

@@ -0,0 +1,38 @@
+name: Lighthouse CI
+
+on:
+  push:
+    branches: [master]
+  pull_request:
+    branches: [master]
+
+jobs:
+  lighthouse:
+    runs-on: ubuntu-24.04
+
+    steps:
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - name: Install dependencies
+        run: bun install
+      - name: Build Next.js app
+        run: bun run build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.bun/install/cache
+            ${{ github.workspace }}/.next/cache
+          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
+          restore-keys: |
+            ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-
+      - name: Run Lighthouse CI
+        run: |
+          npm install -g @lhci/cli
+          lhci autorun
+        env:
+          LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }}
+      - name: Upload Lighthouse reports as artifacts
+        uses: actions/upload-artifact@v4
+        with:
+          name: lighthouse-reports
+          path: ./lighthouserc.cjs

.github/workflows/lint.yml

@@ -4,16 +4,14 @@ on: pull_request
 
 jobs:
   lint:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-24.04
 
     steps:
       - name: Check out Git repository
         uses: actions/checkout@v4
 
       - name: Install Bun
         uses: oven-sh/setup-bun@v2
-        with:
-          node-version: 20.18.0
 
       - name: Install dependencies
         run: bun install

components/footer.tsx

@@ -11,7 +11,6 @@ import { links } from "@/constants/links";
 import { footer } from "@/constants/footer";
 import { useTranslations } from "next-intl";
 import LanguageSwitcher from "@/components/language-switcher";
-import { IconArrowUpRight } from "@tabler/icons-react";
 
 export const Footer = () => {
   const t = useTranslations("footer");
@@ -53,14 +52,9 @@ export const Footer = () => {
                       <li key={idx}>
                         <Link
                           href={item.href || "#"}
-                          className="flex items-center text-white/60 transition duration-300 hover:text-white"
-                          target={item.newTab ? "_blank" : "_self"}
-                          rel={item.newTab ? "noopener noreferrer" : undefined}
+                          className="text-white/60 transition duration-300 hover:text-white"
                         >
                           {t(item.title)}
-                          {item.newTab && (
-                            <IconArrowUpRight className="ml-2 h-4 w-4" />
-                          )}
                         </Link>
                       </li>
                     ))}

components/header.tsx

@@ -5,7 +5,6 @@ import { header } from "@/constants/header";
 import { Button } from "@/components/ui/button";
 import { MobileSidebar } from "@/components/mobile-navbar";
 import { useTranslations } from "next-intl";
-import { IconArrowUpRight } from "@tabler/icons-react";
 
 export const Header = () => {
   const t = useTranslations("header");
@@ -32,19 +31,16 @@ export const Header = () => {
               />
             </Link>
             <div className="hidden md:block">
-              <nav className="flex items-center gap-4 md:gap-8">
+              <nav className="flex items-center gap-3 md:gap-6">
                 {header.map((link) => (
                   <Link
                     key={link.label}
-                    className="flex items-center text-base font-medium text-black/60 transition-colors duration-300 hover:text-black"
+                    className="text-base font-medium text-black/60 transition-colors duration-300 hover:text-black"
                     href={link.href}
-                    target={link.newTab ? "_blank" : "_self"}
-                    rel={link.newTab ? "noopener noreferrer" : undefined}
+                    target="_blank"
+                    rel="noopener noreferrer"
                   >
                     {t(link.label)}
-                    {link.newTab && (
-                      <IconArrowUpRight className="ml-2 h-4 w-4" />
-                    )}
                   </Link>
                 ))}
                 <Button asChild>

components/mobile-navbar.tsx

@@ -1,38 +1,19 @@
-import {
-  Sheet,
-  SheetContent,
-  SheetTitle,
-  SheetTrigger,
-} from "@/components/ui/sheet";
+import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
 import Link from "next/link";
 import { header } from "@/constants/header";
 import { IconMenu } from "@tabler/icons-react";
-import { useTranslations } from "next-intl";
-import Image from "next/image";
 
 export const MobileSidebar = () => {
-  const t = useTranslations("header");
-
   return (
     <Sheet>
       <SheetTrigger aria-label="Open Menu">
         <IconMenu />
       </SheetTrigger>
       <SheetContent side="left">
-        <SheetTitle className="mb-4 flex flex-col gap-2 text-xl font-medium">
-          <Image
-            src="/logo.webp"
-            alt="Redot Engine Logo"
-            width={30}
-            height={30}
-            style={{ filter: "invert(100%)" }}
-          />
-          Redot Engine
-        </SheetTitle>
-        <div className="flex flex-col items-start justify-start gap-1">
+        <div className="flex flex-col items-start justify-start gap-2">
           {header.map((link) => (
             <Link key={link.label} href={link.href}>
-              <span className="block text-lg">{t(link.label)}</span>
+              <span className="block text-xl font-medium">{link.label}</span>
             </Link>
           ))}
         </div>