setting up dark/white mode. fixed some other small things

This commit is contained in:
2025-12-18 21:06:08 -05:00
parent 7f3818f795
commit c6d1bce771
11 changed files with 260 additions and 107 deletions
+27 -23
View File
@@ -7,7 +7,7 @@ import { CATEGORIES } from "@/data/gunbuilderParts";
import { BUILDER_SLOTS, isSlotSatisfied } from "@/data/builderSlots";
import type { CategoryId, Part } from "@/types/gunbuilder";
import { PART_ROLE_TO_CATEGORY } from "@/lib/catalogMappings";
import { Pencil, Link2, Square, CheckSquare } from "lucide-react";
import { Pencil, X, Link2, Square, CheckSquare } from "lucide-react";
// ✅ Centralized overlap rules + helpers
import OverlapChip from "@/components/builder/OverlapChip";
@@ -164,7 +164,9 @@ export default function GunbuilderPage() {
const selectedParts: Part[] = useMemo(() => {
const seen = new Set<string>();
const resolved = Object.values(build)
.map((partId) => (partId ? parts.find((p) => p.id === partId) : undefined))
.map((partId) =>
partId ? parts.find((p) => p.id === partId) : undefined
)
.filter(Boolean) as Part[];
return resolved.filter((p) => {
@@ -368,7 +370,7 @@ export default function GunbuilderPage() {
brand: p.brand,
price: p.price ?? 0,
imageUrl:
((p as any).imageUrl ?? (p as any).mainImageUrl) ?? undefined,
(p as any).imageUrl ?? (p as any).mainImageUrl ?? undefined,
affiliateUrl: buyUrl,
url: buyUrl,
notes: undefined,
@@ -508,7 +510,9 @@ export default function GunbuilderPage() {
const payload = JSON.stringify(build);
const encoded = window.btoa(payload);
const origin = window.location?.origin ?? "";
const url = `${origin}/builder/build?build=${encodeURIComponent(encoded)}`;
const url = `${origin}/builder/build?build=${encodeURIComponent(
encoded
)}`;
setShareUrl(url);
} catch {
setShareUrl("");
@@ -606,7 +610,7 @@ export default function GunbuilderPage() {
};
return (
<main className="min-h-screen bg-black text-zinc-50">
<main className="min-h-screen bg-white text-zinc-900 dark:bg-black dark:text-zinc-50">
<div className="mx-auto max-w-6xl px-4 py-6 lg:py-10">
{/* Header */}
<header className="mb-6">
@@ -807,9 +811,9 @@ export default function GunbuilderPage() {
{/* Layout */}
<section className="rounded-lg border border-zinc-800 bg-zinc-950/60 p-3 md:p-4">
<p className="mb-4 text-xs text-zinc-500">
Work top-down through the major sections. Each row shows your current
pick for that part type, with price and a direct buy linkor a quick
way to choose a part if you haven&apos;t picked one yet.
Work top-down through the major sections. Each row shows your
current pick for that part type, with price and a direct buy linkor
a quick way to choose a part if you haven&apos;t picked one yet.
</p>
{loading && (
@@ -955,19 +959,21 @@ export default function GunbuilderPage() {
<div className="flex justify-end gap-2">
{selectedPart && selectedPart.url ? (
<>
<Link
href={{
pathname: `/parts/p/${platform}/${category.id}`,
query: platform
? { platform }
: {},
<button
type="button"
onClick={() => {
setBuild((prev) => {
const next = { ...prev };
delete next[category.id];
return next;
});
}}
className="hidden md:inline-flex items-center justify-center rounded-md border border-zinc-700 bg-zinc-900/70 px-2 py-1 hover:bg-zinc-800 hover:border-zinc-600 transition-colors"
aria-label="Change part"
title="Change part"
className="inline-flex items-center justify-center rounded-md border border-zinc-700 bg-zinc-900/70 px-2 py-1 hover:bg-red-500/15 hover:border-red-400 transition-colors"
aria-label="Remove part"
title="Remove part"
>
<Pencil className="h-3.5 w-3.5 text-zinc-300" />
</Link>
<X className="h-3.5 w-3.5 text-zinc-400 hover:text-red-400" />
</button>
<a
href={selectedPart.url}
@@ -984,9 +990,7 @@ export default function GunbuilderPage() {
<Link
href={{
pathname: `/parts/p/${platform}/${category.id}`,
query: platform
? { platform }
: {},
query: platform ? { platform } : {},
}}
className="inline-flex items-center gap-1.5 whitespace-nowrap rounded-md border border-zinc-700 bg-zinc-900/70 px-3 py-1.5 text-xs font-medium text-zinc-300 hover:bg-zinc-800 hover:border-zinc-600 transition-colors"
>
@@ -1027,4 +1031,4 @@ export default function GunbuilderPage() {
</div>
</main>
);
}
}