Warmer style for the entire website + shapes

This commit is contained in:
Antoni Nuñez Romeu
2026-03-19 16:27:03 +01:00
parent 71b2c5f2ed
commit 3f0618829f
5 changed files with 70 additions and 62 deletions

View File

@@ -6,7 +6,7 @@ import { Music, Users, Sparkles, PartyPopper } from "lucide-react";
const iconMap = [Music, Users, Sparkles, PartyPopper];
const AboutSection = () => (
<section id="about" className="section-padding bg-background">
<section id="about" className="section-padding bg-background relative z-10 -mt-[50px] pt-[100px]">
<div className="container mx-auto">
<div className="grid md:grid-cols-2 gap-12 items-center">
{/* Imagen */}

View File

@@ -34,7 +34,10 @@ const HeroSection = () => {
];
return (
<section className="relative min-h-screen flex items-center justify-center overflow-hidden">
<section
className="relative min-h-[calc(100vh+50px)] flex items-center justify-center overflow-hidden z-20 pb-[50px]"
style={{ clipPath: "polygon(0 0, 100% 0, 100% calc(100% - 50px), 50% 100%, 0 calc(100% - 50px))" }}
>
{/* Background image */}
<div
className="absolute inset-0 bg-cover bg-center"

View File

@@ -3,8 +3,13 @@ import { ABOUT_ORG } from "@/data/event-data";
import communityImg from "@/assets/community.jpg";
import { Instagram, Facebook, Youtube } from "lucide-react";
const maskStyle = "radial-gradient(491.93px at 50% 660px,#000 99%,#0000 101%) calc(50% - 440px) 0/880px 100%, radial-gradient(491.93px at 50% -440px,#0000 99%,#000 101%) 50% 220px/880px 100% repeat-x";
const OrgSection = () => (
<section className="section-padding bg-card py-20 md:py-28">
<section
className="section-padding bg-card pb-20 md:pb-28 pt-[200px] md:pt-[240px] -mt-[80px] relative z-20"
style={{ WebkitMask: maskStyle, mask: maskStyle }}
>
<div className="container mx-auto">
<div className="grid md:grid-cols-2 gap-12 items-center">
{/* Texto */}