Sebastian Krüger
9126589de3
- Hero: remove framer-motion, CSS stagger animations, glass pill CTA button, refined typography and scroll indicator - Stats: remove framer-motion, Lucide icons, tighter glass cards with mono labels - ToolsGrid: remove framer-motion, editorial section heading, 4-col xl grid - ToolCard: replace framer-motion motion.Link with plain Link + CSS hover, compact layout (icon→title→desc→badges+arrow), ElementType icon prop - Footer: remove framer-motion, matches sidebar footer style - BackToTop: remove framer-motion, JS scroll progress bar (1px primary line), compact glass button - not-found: remove framer-motion and shadcn Button, glass pill CTA, 120px mono 404, CSS stagger - page.tsx: remove unnecessary 'use client' directive Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import ToolCard from './ToolCard';
|
|
import { tools } from '@/lib/tools';
|
|
|
|
export default function ToolsGrid() {
|
|
return (
|
|
<section id="tools" className="relative py-16 px-6">
|
|
<div className="max-w-5xl mx-auto">
|
|
|
|
{/* Section heading */}
|
|
<div
|
|
className="mb-8"
|
|
style={{ animation: 'fadeIn 0.5s ease-out both' }}
|
|
>
|
|
<span className="text-[10px] font-semibold text-muted-foreground uppercase tracking-widest block mb-1">
|
|
Available Tools
|
|
</span>
|
|
<p className="text-xs text-muted-foreground/40">
|
|
Carefully crafted tools for your workflow
|
|
</p>
|
|
</div>
|
|
|
|
{/* Tools grid */}
|
|
<div className="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-3">
|
|
{tools.map((tool, index) => (
|
|
<ToolCard
|
|
key={tool.href}
|
|
title={tool.shortTitle}
|
|
description={tool.summary}
|
|
icon={tool.icon}
|
|
url={tool.href}
|
|
badges={tool.badges}
|
|
index={index}
|
|
/>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|