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
parent 561c5aab76
commit be0a2079df
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 SidebarAd from "@/components/SidebarAd";
import { getToolsByCategory, tools } from "@/lib/tools";
import Link from "next/link";
@ -8,15 +7,8 @@ export default function Home() {
const featuredTools = tools.filter((t) => t.featured);
return (
<div className="relative z-10 mx-auto max-w-7xl px-4 py-8">
<div className="flex justify-center items-start gap-6">
{/* 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">
<div className="relative z-10 mx-auto max-w-6xl px-4 py-8">
<div className="w-full">
{/* Header intro */}
<div className="mb-8 border border-[#1a1a1a] bg-[#090909] p-6">
<div className="text-xs font-mono text-[#666] mb-1">
@ -65,12 +57,6 @@ export default function Home() {
</div>
</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>
);

40
src/components/ToolLayout.tsx
View file

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