oiupoyt/kattoolbox
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

refactor: simplify layout and remove sidebar ad rails

Browse source
This commit is contained in:
katR 2026-10-11 10:39:33 +05:30 • committed by spearzificial
parent a49d463a83
commit 3a3e6b8f57
2 changed files with 12 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/app/page.tsx
View file

@ -1,5 +1,4 @@
import ToolCard from "@/components/ToolCard"; import ToolCard from "@/components/ToolCard";
import SidebarAd from "@/components/SidebarAd";
import { getToolsByCategory, tools } from "@/lib/tools"; import { getToolsByCategory, tools } from "@/lib/tools";
import Link from "next/link"; import Link from "next/link";
@ -8,15 +7,8 @@ export default function Home() {
const featuredTools = tools.filter((t) => t.featured); const featuredTools = tools.filter((t) => t.featured);
return ( return (
<div className="relative z-10 mx-auto max-w-7xl px-4 py-8"> <div className="relative z-10 mx-auto max-w-6xl px-4 py-8">
<div className="flex justify-center items-start gap-6"> <div className="w-full">
{/* Left Side Rail (Ultra-wide) */}
<div className="hidden 2xl:block sticky top-20 shrink-0">
<SidebarAd format="vertical" slotId="kat-home-left" />
</div>
{/* Main Content */}
<div className="flex-1 max-w-5xl min-w-0">
{/* Header intro */} {/* Header intro */}
<div className="mb-8 border border-[#1a1a1a] bg-[#090909] p-6"> <div className="mb-8 border border-[#1a1a1a] bg-[#090909] p-6">
<div className="text-xs font-mono text-[#666] mb-1"> <div className="text-xs font-mono text-[#666] mb-1">
@ -65,12 +57,6 @@ export default function Home() {
</div> </div>
</section> </section>
))} ))}
</div>
{/* Right Side Rail */}
<div className="hidden xl:block sticky top-20 shrink-0">
<SidebarAd format="vertical" slotId="kat-home-right" />
</div>
</div> </div>
</div> </div>
); );

40
src/components/ToolLayout.tsx
View file

@ -1,42 +1,22 @@
import SidebarAd from "@/components/SidebarAd";
interface ToolLayoutProps { interface ToolLayoutProps {
title: string; title: string;
description: string; description: string;
children: React.ReactNode; children: React.ReactNode;
showSideAds?: boolean;
} }
export default function ToolLayout({ title, description, children, showSideAds = true }: ToolLayoutProps) { export default function ToolLayout({ title, description, children }: ToolLayoutProps) {
return ( return (
<div className="relative z-10 mx-auto max-w-7xl px-4 py-8"> <div className="relative z-10 mx-auto max-w-5xl px-4 py-8">
<div className="flex justify-center items-start gap-6"> <div className="w-full">
{/* Left Side Ad (Ultra-wide screens) */} <div className="flex items-center gap-2 mb-1">
{showSideAds && ( <div className="h-px w-4 bg-blue-900"></div>
<div className="hidden 2xl:block sticky top-20 shrink-0"> <h1 className="text-lg font-semibold text-white">{title}</h1>
<SidebarAd format="vertical" slotId="kat-tool-left" />
</div>
)}
{/* Main Tool Content */}
<div className="flex-1 max-w-5xl min-w-0">
<div className="flex items-center gap-2 mb-1">
<div className="h-px w-4 bg-blue-900"></div>
<h1 className="text-lg font-semibold text-white">{title}</h1>
</div>
<p className="mb-5 text-sm text-[#525252] ml-6">{description}</p>
<div className="border border-[#1a1a1a] bg-[#0a0a0a] p-5">
{children}
</div>
</div> </div>
<p className="mb-5 text-sm text-[#525252] ml-6">{description}</p>
{/* Right Side Ad (Desktop & Laptops) */} <div className="border border-[#1a1a1a] bg-[#0a0a0a] p-5">
{showSideAds && ( {children}
<div className="hidden xl:block sticky top-20 shrink-0"> </div>
<SidebarAd format="vertical" slotId="kat-tool-right" />
</div>
)}
</div> </div>
</div> </div>
); );