main: vibe coded app to feel like paper

Signed-off-by: nfel <nfilsaraee@gmail.com>
This commit is contained in:
2025-12-30 00:00:16 +03:30
parent acbaebb947
commit 91c149e92e
27 changed files with 901 additions and 8696 deletions
+13 -13
View File
@@ -23,24 +23,24 @@ export default function Header({ onCartClick }: HeaderProps) {
<motion.header
initial={{ y: -100 }}
animate={{ y: 0 }}
className="fixed top-0 left-0 right-0 z-40 glass-effect border-b border-white/10"
className="fixed top-0 left-0 right-0 z-40 bg-paper-sand border-b-4 border-paper-dark shadow-paper-lg"
>
<div className="max-w-7xl mx-auto px-4 md:px-8 py-4">
<div className="flex items-center justify-between">
{/* Logo */}
<motion.div
whileHover={{ scale: 1.05 }}
whileHover={{ scale: 1.02 }}
className="flex items-center gap-3 cursor-pointer"
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
>
<div className="p-2 bg-gradient-to-br from-accent-cyan to-accent-orange rounded-lg glow-cyan">
<FaMusic className="text-2xl text-white" />
<div className="p-2 bg-paper-dark border-2 border-paper-brown">
<FaMusic className="text-2xl text-paper-light" />
</div>
<div>
<h1 className="text-xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-accent-cyan to-accent-orange">
<h1 className="text-xl font-bold text-paper-dark tracking-tight">
Parsa
</h1>
<p className="text-xs text-gray-400">Progressive Rock</p>
<p className="text-xs text-paper-brown">Progressive Rock</p>
</div>
</motion.div>
@@ -49,13 +49,13 @@ export default function Header({ onCartClick }: HeaderProps) {
<div className="hidden md:flex items-center gap-8">
<button
onClick={() => scrollToSection('bio')}
className="text-gray-300 hover:text-accent-cyan transition-colors"
className="text-paper-dark hover:text-paper-brown transition-colors font-medium border-b-2 border-transparent hover:border-paper-brown"
>
Bio
</button>
<button
onClick={() => scrollToSection('albums')}
className="text-gray-300 hover:text-accent-cyan transition-colors"
className="text-paper-dark hover:text-paper-brown transition-colors font-medium border-b-2 border-transparent hover:border-paper-brown"
>
Albums
</button>
@@ -63,18 +63,18 @@ export default function Header({ onCartClick }: HeaderProps) {
{/* Cart Button */}
<motion.button
whileHover={{ scale: 1.05 }}
whileTap={{ scale: 0.95 }}
whileHover={{ scale: 1.02 }}
whileTap={{ scale: 0.98 }}
onClick={onCartClick}
className="relative p-3 bg-white/10 hover:bg-white/20 rounded-lg transition-all"
className="relative p-3 bg-paper-brown hover:bg-paper-dark border-2 border-paper-dark transition-all shadow-paper"
aria-label="Shopping cart"
>
<FaShoppingCart className="text-xl text-accent-cyan" />
<FaShoppingCart className="text-xl text-paper-light" />
{cartCount > 0 && (
<motion.div
initial={{ scale: 0 }}
animate={{ scale: 1 }}
className="absolute -top-1 -right-1 bg-accent-orange text-white text-xs font-bold rounded-full w-5 h-5 flex items-center justify-center"
className="absolute -top-2 -right-2 bg-paper-dark text-paper-light text-xs font-bold border-2 border-paper-brown w-6 h-6 flex items-center justify-center"
>
{cartCount}
</motion.div>