{
+ const { currLang } = useLang();
+ return (
+
+
+ {translations[currLang].features}:
+
+
+
+
+ {transIntro[currLang].map((item) => (
+ - {item}
+ ))}
+
+
+
+ );
+};
+
+export default Introduction;
diff --git a/src/components/LangToggle.tsx b/src/components/LangToggle.tsx
index c6da196..a40368c 100644
--- a/src/components/LangToggle.tsx
+++ b/src/components/LangToggle.tsx
@@ -32,7 +32,7 @@ const LangToggle = () => {
) {
+ return (
+
+
+ {children}
+
+
+
+
+ );
+}
+
+function ScrollBar({
+ className,
+ orientation = "vertical",
+ ...props
+}: React.ComponentProps) {
+ return (
+
+
+
+ );
+}
+
+export { ScrollArea, ScrollBar };
diff --git a/src/index.css b/src/index.css
index a89aa39..c076c27 100644
--- a/src/index.css
+++ b/src/index.css
@@ -28,7 +28,7 @@
--secondary: oklch(0.968 0.007 247.896);
--secondary-foreground: oklch(0.208 0.042 265.755);
--muted: oklch(0.968 0.007 247.896);
- --muted-foreground: oklch(0.554 0.046 257.417);
+ --muted-foreground: oklch(87.2% 0.01 258.338);
--accent: oklch(0.968 0.007 247.896);
--accent-foreground: oklch(0.208 0.042 265.755);
--destructive: oklch(0.577 0.245 27.325);
@@ -90,17 +90,17 @@
.dark {
--background: oklch(0.129 0.042 264.695);
- --foreground: oklch(0.984 0.003 247.858);
+ --foreground: oklch(96.7% 0.001 286.375);
--card: oklch(0.208 0.042 265.755);
--card-foreground: oklch(0.984 0.003 247.858);
--popover: oklch(0.208 0.042 265.755);
--popover-foreground: oklch(0.984 0.003 247.858);
- --primary: oklch(0.929 0.013 255.508);
+ --primary: oklch(85.2% 0.199 91.936);
--primary-foreground: oklch(0.208 0.042 265.755);
--secondary: oklch(0.279 0.041 260.031);
--secondary-foreground: oklch(0.984 0.003 247.858);
--muted: oklch(0.279 0.041 260.031);
- --muted-foreground: oklch(0.704 0.04 256.788);
+ --muted-foreground: oklch(70.8% 0 0);
--accent: oklch(0.279 0.041 260.031);
--accent-foreground: oklch(0.984 0.003 247.858);
--destructive: oklch(0.704 0.191 22.216);
@@ -122,8 +122,17 @@
--sidebar-ring: oklch(0.551 0.027 264.364);
}
+@layer utilities {
+ .exo-2 {
+ font-family: "Exo 2", sans-serif;
+ }
+ .orbitron {
+ font-family: "Orbitron", sans-serif;
+ }
+}
+
@layer base {
- * {
- @apply m-0 p-0 text-foreground;
+ html body {
+ @apply m-0 p-0 text-foreground exo-2;
}
}
diff --git a/src/lib/hooks/useLang.ts b/src/lib/hooks/useLang.ts
index b823200..2d36e1b 100644
--- a/src/lib/hooks/useLang.ts
+++ b/src/lib/hooks/useLang.ts
@@ -8,12 +8,12 @@ import { useEffect, useMemo } from "react";
const getLangFromSys = (): Lang => {
const navLang = navigator.language;
- const langs = SupportedLangs.filter((l) => l != "sys");
+ const langs = SupportedLangs.filter((l) => l != "System");
return langs.find((l) => navLang.startsWith(l)) || "en";
};
const resolveLang = (lang: LangWithSys): Lang => {
- return lang === "sys" ? getLangFromSys() : lang;
+ return lang === "System" ? getLangFromSys() : lang;
};
const useLang = () => {
diff --git a/src/lib/stores/langStore.ts b/src/lib/stores/langStore.ts
index f6babc7..c103a04 100644
--- a/src/lib/stores/langStore.ts
+++ b/src/lib/stores/langStore.ts
@@ -1,10 +1,10 @@
import { atomWithStorage } from "jotai/utils";
-const SupportedLangs = ["sys", "en"] as const;
+const SupportedLangs = ["System", "en"] as const;
type LangWithSys = (typeof SupportedLangs)[number];
-type Lang = Exclude;
+type Lang = Exclude;
-const langAtom = atomWithStorage("lang", "sys");
+const langAtom = atomWithStorage("lang", "System");
export default langAtom;
diff --git a/src/locale.ts b/src/locale.ts
index 41a58f1..0d6f080 100644
--- a/src/locale.ts
+++ b/src/locale.ts
@@ -1,13 +1,36 @@
import type { Lang } from "@/lib/stores/langStore";
-type TranslationKey = "developedBy" | "title";
+type TranslationKey =
+ | "developedBy"
+ | "title"
+ | "subtitle"
+ | "webDemo"
+ | "download"
+ | "features";
const translations: Record> = {
en: {
developedBy: "Developed with ❤️ by",
title: "Fallout 2 Community Edition",
+ subtitle: "A fully working re-implementation",
+ webDemo: "Try in browser",
+ download: "Download",
+ features: "Features",
},
};
-export default translations;
+const transIntro: Record = {
+ en: [
+ "High resolution support",
+ "Increased pathfinding nodes 5x for more accurate pathfinding",
+ "Ctrl-click to quickly move items when bartering, looting, or stealing",
+ "Press 'a' to select all when choosing item quantity",
+ "Press 'a' to Take All when looting",
+ "When bartering, caps default to the right amount to balance the trade (if possible)",
+ "Music continues playing between maps (requires config)",
+ "Auto open doors (requires config)",
+ ],
+};
+
+export { transIntro, translations };
export type { TranslationKey };