Files
LogWhispererAI/frontend/package.json
Luca Sacchi Ricciardi a22e4bf7b5 feat: add Navbar and Hero components with Tailwind styling
Create landing page structure following 'Little Often' principle:

Components Created:
- Navbar.tsx: Logo + CTA button with sticky positioning
- Hero.tsx: Headline, sub-headline, dual CTAs, trust indicators, stats
- components/index.ts: Centralized exports

Design Features:
- Mobile-first responsive design (sm:, lg: breakpoints)
- WCAG AA compliant contrast ratios (4.5:1+)
- Accessible focus rings and aria-labels
- Modern color palette (indigo primary, slate neutrals)
- Smooth gradients and shadows

Layout Structure:
frontend/src/
├── components/
│   ├── layout/
│   │   └── Navbar.tsx
│   ├── sections/
│   │   └── Hero.tsx
│   └── index.ts
├── App.tsx: Clean integration of Navbar + Hero

Fixes Applied:
- Install @tailwindcss/postcss for Tailwind v4 compatibility
- Update postcss.config.js with new plugin
- Remove @tailwind directives from index.css (v4 style)

Build Verification:
 TypeScript compilation successful
 Tailwind CSS processing successful
 Production build completed (dist/ folder)

Content:
- Headline: 'Il DevOps tascabile che traduce i crash...'
- Sub-headline: Explains monitoring + AI + Telegram flow
- Primary CTA: 'Ottieni il tuo Webhook URL'
- Secondary CTA: 'Guarda la Demo'
- Stats: <5s response, 300+ models, €0.15/month

Refs: docs/frontend_landing_plan.md, .opencode/skills/frontend-ui-ux/
2026-04-03 14:26:16 +02:00

35 lines
833 B
JSON

{
"name": "frontend",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc -b && vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"react": "^19.2.4",
"react-dom": "^19.2.4"
},
"devDependencies": {
"@eslint/js": "^9.39.4",
"@tailwindcss/postcss": "^4.2.2",
"@types/node": "^24.12.0",
"@types/react": "^19.2.14",
"@types/react-dom": "^19.2.3",
"@vitejs/plugin-react": "^6.0.1",
"autoprefixer": "^10.4.27",
"eslint": "^9.39.4",
"eslint-plugin-react-hooks": "^7.0.1",
"eslint-plugin-react-refresh": "^0.5.2",
"globals": "^17.4.0",
"postcss": "^8.5.8",
"tailwindcss": "^4.2.2",
"typescript": "~5.9.3",
"typescript-eslint": "^8.57.0",
"vite": "^8.0.1"
}
}