Initial commit: project structure and header component
Co-authored-by: Junie <junie@jetbrains.com>
This commit is contained in:
commit
737797f536
24
.gitignore
vendored
Normal file
24
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
0
.junie/memory/errors.md
Normal file
0
.junie/memory/errors.md
Normal file
0
.junie/memory/feedback.md
Normal file
0
.junie/memory/feedback.md
Normal file
1
.junie/memory/language.json
Normal file
1
.junie/memory/language.json
Normal file
|
|
@ -0,0 +1 @@
|
|||
[]
|
||||
1
.junie/memory/memory.version
Normal file
1
.junie/memory/memory.version
Normal file
|
|
@ -0,0 +1 @@
|
|||
3.0
|
||||
0
.junie/memory/tasks.md
Normal file
0
.junie/memory/tasks.md
Normal file
29
index.html
Normal file
29
index.html
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
<!doctype html>
|
||||
<html lang="pl" class="scroll-smooth">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>humanAI — ludzka strona AI</title>
|
||||
<meta name="description" content="Strategia, automatyzacje, produkty AI i systemy multiagentowe projektowane z człowiekiem w centrum." />
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:url" content="https://gethumanai.com/" />
|
||||
<meta property="og:title" content="humanAI — ludzka strona AI" />
|
||||
<meta property="og:description" content="Strategia, automatyzacje, produkty AI i systemy multiagentowe projektowane z człowiekiem w centrum." />
|
||||
|
||||
<!-- Twitter -->
|
||||
<meta property="twitter:card" content="summary_large_image" />
|
||||
<meta property="twitter:title" content="humanAI — ludzka strona AI" />
|
||||
<meta property="twitter:description" content="Strategia, automatyzacje, produkty AI i systemy multiagentowe projektowane z człowiekiem w centrum." />
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
<body class="bg-background text-foreground antialiased selection:bg-primary selection:text-background">
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
2766
package-lock.json
generated
Normal file
2766
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
30
package.json
Normal file
30
package.json
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
{
|
||||
"name": "humanai-web",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"lucide-react": "^0.378.0",
|
||||
"framer-motion": "^11.1.7",
|
||||
"clsx": "^2.1.1",
|
||||
"tailwind-merge": "^2.3.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.2.66",
|
||||
"@types/react-dom": "^18.2.22",
|
||||
"@vitejs/plugin-react": "^4.2.1",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"postcss": "^8.4.38",
|
||||
"tailwindcss": "^3.4.3",
|
||||
"typescript": "^5.2.2",
|
||||
"vite": "^5.2.0"
|
||||
}
|
||||
}
|
||||
6
postcss.config.js
Normal file
6
postcss.config.js
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
95
src/components/Header.tsx
Normal file
95
src/components/Header.tsx
Normal file
|
|
@ -0,0 +1,95 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import { Menu, X } from 'lucide-react';
|
||||
import { motion, AnimatePresence } from 'framer-motion';
|
||||
|
||||
const Header = () => {
|
||||
const [isScrolled, setIsScrolled] = useState(false);
|
||||
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const handleScroll = () => {
|
||||
setIsScrolled(window.scrollY > 20);
|
||||
};
|
||||
window.addEventListener('scroll', handleScroll);
|
||||
return () => window.removeEventListener('scroll', handleScroll);
|
||||
}, []);
|
||||
|
||||
const navLinks = [
|
||||
{ name: 'Oferta', href: '#offerings' },
|
||||
{ name: 'Platforma', href: '#process' },
|
||||
{ name: 'Proces', href: '#process' },
|
||||
{ name: 'Kontakt', href: '#contact' },
|
||||
];
|
||||
|
||||
return (
|
||||
<header
|
||||
className={`fixed top-0 left-0 right-0 z-50 transition-all duration-300 ${
|
||||
isScrolled ? 'bg-background/80 backdrop-blur-lg py-3 border-b border-white/5' : 'bg-transparent py-6'
|
||||
}`}
|
||||
>
|
||||
<div className="container mx-auto px-6 flex items-center justify-between">
|
||||
<a href="#" className="text-2xl font-bold tracking-tight hover:opacity-80 transition-opacity">
|
||||
human<span className="text-primary">AI</span>
|
||||
</a>
|
||||
|
||||
{/* Desktop Nav */}
|
||||
<nav className="hidden md:flex items-center space-x-8">
|
||||
{navLinks.map((link) => (
|
||||
<a
|
||||
key={link.name}
|
||||
href={link.href}
|
||||
className="text-sm font-medium text-muted hover:text-foreground transition-colors"
|
||||
>
|
||||
{link.name}
|
||||
</a>
|
||||
))}
|
||||
<a href="#contact" className="btn-primary text-sm px-5 py-2">
|
||||
Porozmawiajmy
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
{/* Mobile Menu Toggle */}
|
||||
<button
|
||||
className="md:hidden text-foreground"
|
||||
onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
|
||||
>
|
||||
{isMobileMenuOpen ? <X size={24} /> : <Menu size={24} />}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Mobile Nav */}
|
||||
<AnimatePresence>
|
||||
{isMobileMenuOpen && (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, height: 0 }}
|
||||
animate={{ opacity: 1, height: 'auto' }}
|
||||
exit={{ opacity: 0, height: 0 }}
|
||||
className="md:hidden bg-surface border-b border-white/10 overflow-hidden"
|
||||
>
|
||||
<div className="flex flex-col p-6 space-y-4">
|
||||
{navLinks.map((link) => (
|
||||
<a
|
||||
key={link.name}
|
||||
href={link.href}
|
||||
className="text-lg font-medium text-muted hover:text-foreground"
|
||||
onClick={() => setIsMobileMenuOpen(false)}
|
||||
>
|
||||
{link.name}
|
||||
</a>
|
||||
))}
|
||||
<a
|
||||
href="#contact"
|
||||
className="btn-primary text-center"
|
||||
onClick={() => setIsMobileMenuOpen(false)}
|
||||
>
|
||||
Porozmawiajmy
|
||||
</a>
|
||||
</div>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</header>
|
||||
);
|
||||
};
|
||||
|
||||
export default Header;
|
||||
81
src/data/content.ts
Normal file
81
src/data/content.ts
Normal file
|
|
@ -0,0 +1,81 @@
|
|||
import {
|
||||
Zap,
|
||||
Search,
|
||||
Workflow,
|
||||
Layers,
|
||||
Users,
|
||||
Cpu,
|
||||
ShieldCheck,
|
||||
BarChart3,
|
||||
Layout,
|
||||
MessageSquare,
|
||||
Eye,
|
||||
Settings,
|
||||
Rocket
|
||||
} from 'lucide-react';
|
||||
|
||||
export const offerings = [
|
||||
{
|
||||
id: 'strategy',
|
||||
title: 'AI Strategy & Advisory',
|
||||
description: 'Pomagamy znaleźć realne zastosowania AI w firmie, wybrać priorytety i zaplanować wdrożenia bez przepalania czasu na przypadkowe eksperymenty.',
|
||||
points: ['audyt procesów', 'mapa use case’ów', 'priorytetyzacja wdrożeń', 'polityki bezpieczeństwa AI'],
|
||||
icon: Search
|
||||
},
|
||||
{
|
||||
id: 'automation',
|
||||
title: 'AI Automation & Workflows',
|
||||
description: 'Budujemy automatyzacje, które łączą modele AI z codziennymi narzędziami: dokumentami, mailem, CRM, bazami danych, API i wewnętrznymi procesami.',
|
||||
points: ['automatyzacje operacyjne', 'integracje API', 'workflow z człowiekiem w pętli', 'monitoring i logi'],
|
||||
icon: Workflow
|
||||
},
|
||||
{
|
||||
id: 'products',
|
||||
title: 'AI Products & Interfaces',
|
||||
description: 'Projektujemy i tworzymy aplikacje, panele, chatboty, copilots i wyszukiwarki semantyczne, które przekładają AI na użyteczne doświadczenie użytkownika.',
|
||||
points: ['aplikacje webowe', 'panele AI', 'chatboty i copilots', 'RAG / wyszukiwanie w wiedzy'],
|
||||
icon: Layout
|
||||
},
|
||||
{
|
||||
id: 'multiagent',
|
||||
title: 'Multiagent Systems & Infrastructure',
|
||||
description: 'Tworzymy systemy wieloagentowe, które potrafią planować, wykonywać zadania, korzystać z narzędzi i współpracować z człowiekiem przy zachowaniu kontroli i audytowalności.',
|
||||
points: ['agent orchestration', 'tool registry / MCP', 'approval gates', 'pamięć, logi i obserwowalność'],
|
||||
icon: Cpu
|
||||
}
|
||||
];
|
||||
|
||||
export const whyHumanAI = [
|
||||
{
|
||||
title: 'Human-in-the-loop',
|
||||
icon: Users
|
||||
},
|
||||
{
|
||||
title: 'Bezpieczeństwo od początku',
|
||||
icon: ShieldCheck
|
||||
},
|
||||
{
|
||||
title: 'Integracja z istniejącymi narzędziami',
|
||||
icon: Layers
|
||||
},
|
||||
{
|
||||
title: 'Mierzalny efekt biznesowy',
|
||||
icon: BarChart3
|
||||
}
|
||||
];
|
||||
|
||||
export const processSteps = [
|
||||
{ id: 1, title: 'Diagnoza', icon: Eye },
|
||||
{ id: 2, title: 'Projekt rozwiązania', icon: Layout },
|
||||
{ id: 3, title: 'Prototyp', icon: Zap },
|
||||
{ id: 4, title: 'Wdrożenie', icon: Rocket },
|
||||
{ id: 5, title: 'Utrzymanie i rozwój', icon: Settings }
|
||||
];
|
||||
|
||||
export const audience = [
|
||||
'founderzy i małe zespoły',
|
||||
'firmy usługowe',
|
||||
'działy operacyjne',
|
||||
'zespoły produktowe',
|
||||
'software house’y i integratorzy'
|
||||
];
|
||||
38
src/index.css
Normal file
38
src/index.css
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
.glass-card {
|
||||
@apply bg-surface/50 backdrop-blur-md border border-white/10 rounded-2xl;
|
||||
}
|
||||
|
||||
.text-gradient {
|
||||
@apply bg-clip-text text-transparent bg-gradient-to-r from-primary via-white to-secondary;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply inline-flex items-center justify-center px-6 py-3 rounded-full bg-primary text-background font-semibold transition-all hover:bg-primary-hover hover:scale-105 active:scale-95;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@apply inline-flex items-center justify-center px-6 py-3 rounded-full border border-white/20 bg-white/5 font-semibold transition-all hover:bg-white/10 hover:border-white/30 hover:scale-105 active:scale-95;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-grid-pattern {
|
||||
background-size: 40px 40px;
|
||||
background-image: linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
|
||||
linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
|
||||
}
|
||||
|
||||
.glow-orb {
|
||||
filter: blur(80px);
|
||||
z-index: -1;
|
||||
}
|
||||
10
src/main.tsx
Normal file
10
src/main.tsx
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App.tsx'
|
||||
import './index.css'
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
)
|
||||
31
tailwind.config.js
Normal file
31
tailwind.config.js
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./index.html",
|
||||
"./src/**/*.{js,ts,tsx,jsx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
background: '#0a0c10', // Deep graphite/navy dark background
|
||||
surface: '#12161e', // Slightly lighter surface
|
||||
primary: {
|
||||
DEFAULT: '#00d1ff', // Electric cyan
|
||||
hover: '#00b8e6',
|
||||
},
|
||||
secondary: {
|
||||
DEFAULT: '#7c3aed', // Violet
|
||||
},
|
||||
accent: {
|
||||
DEFAULT: '#f59e0b', // Humanist amber
|
||||
},
|
||||
foreground: '#f8fafc', // Warm white
|
||||
muted: '#94a3b8', // Gray/navy muted
|
||||
},
|
||||
fontFamily: {
|
||||
sans: ['Inter', 'system-ui', 'sans-serif'],
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
21
tsconfig.json
Normal file
21
tsconfig.json
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["DOM", "DOM.Iterable", "ESNext"],
|
||||
"allowJs": false,
|
||||
"skipLibCheck": true,
|
||||
"esModuleInterop": false,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx"
|
||||
},
|
||||
"include": ["src"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
||||
10
tsconfig.node.json
Normal file
10
tsconfig.node.json
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "Node",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
7
vite.config.ts
Normal file
7
vite.config.ts
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
})
|
||||
Loading…
Reference in a new issue