|
| 1 | +'use client'; |
| 2 | + |
| 3 | +import React from 'react'; |
| 4 | +import Card from './components/card'; |
| 5 | + |
| 6 | +const sigsData = [ |
| 7 | + { image: '/assets/sigsIcons/Group125.png', title: 'Data' }, |
| 8 | + { image: '/assets/sigsIcons/Group122.png', title: 'Backend' }, |
| 9 | +]; |
| 10 | + |
| 11 | +export default function Sigs() { |
| 12 | + return ( |
| 13 | + <div className="max-w-7xl mx-auto px-"> |
| 14 | + <div className="relative flex flex-col justify-center mt-28 2xl:mt-60"> |
| 15 | + <div className="flex flex-col items-center"> |
| 16 | + <p className="text-primary text-[32px] md:text-[70px] leading-9 md:leading-none font-black text-center"> |
| 17 | + SPECIAL <br /> |
| 18 | + <span className="text-white">INTEREST GROUPS</span> |
| 19 | + </p> |
| 20 | + |
| 21 | + <p className="text-white text-xs md:text-xl text-center mt-4 2xl:my-14 max-w-[909px]"> |
| 22 | + DurianPy’s{' '} |
| 23 | + <span className="text-primary font-bold"> |
| 24 | + Special Interest Groups |
| 25 | + </span>{' '} |
| 26 | + (SIGs) are focused communities within our user group that allow |
| 27 | + Python enthusiasts to dive deeper into specific topics. Whether |
| 28 | + you’re passionate about{' '} |
| 29 | + <span className="text-primary font-bold">data science</span> or{' '} |
| 30 | + <span className="text-primary font-bold">data science</span> or{' '} |
| 31 | + <span className="text-primary font-bold">backend development</span>, |
| 32 | + our SIGs providea space for hands-on learning, networking, and |
| 33 | + collaboration. |
| 34 | + </p> |
| 35 | + |
| 36 | + <button |
| 37 | + className="my-6 md:my-8 lg:my-10 mx-auto block bg-primary text-black text-[8px] md:text-xl leading-3 md:leading-none font-bold rounded-full px-2 md:px-4 lg:px-8 py-1 md:py-2 lg:py-4 border border-transparent hover:bg-opacity-50 hover:border-primary hover:text-primary transition-colors" |
| 38 | + onClick={() => |
| 39 | + (window.location.href = 'https://forms.gle/XxDJZebqbJB6tJo27') |
| 40 | + } |
| 41 | + > |
| 42 | + Join a SIG today |
| 43 | + </button> |
| 44 | + <div className="relative w-full h-[250px] md:h-[350px] -mt-20 -mb-20 flex flex-col items-center -z-10"> |
| 45 | + <div className="absolute top-0 w-[50%] md:w-[80%] h-[100px] md:h-[150px] bg-[#36FF90] rounded-b-full blur-2xl md:blur-3xl opacity-10 z-[-1] -mt-5"></div> |
| 46 | + <div className="absolute top-1/2 -translate-y-1/2 w-full md:w-[85%] h-[80%] md:h-[71%] bg-[#36FF90] rounded-full blur-[80px] md:blur-[120px] opacity-30 z-[-2]"></div> |
| 47 | + <div className="absolute bottom-0 w-[50%] md:w-[80%] h-[100px] md:h-[150px] bg-[#36FF90] rounded-t-full blur-2xl md:blur-3xl opacity-10 z-[-1]"></div> |
| 48 | + </div> |
| 49 | + </div> |
| 50 | + <div className="sm:mt-15 md:-mt-10 lg:-mt-10"> |
| 51 | + <p className="text-primary text-[32px] md:text-[70px] leading-9 md:leading-none font-black text-center"> |
| 52 | + CURRENT <span className="text-white">SIGs</span> |
| 53 | + </p> |
| 54 | + |
| 55 | + <div className="flex flex-wrap justify-center gap-3 md:gap-8 xl:gap-20 mt-6"> |
| 56 | + {sigsData.map((sig, index) => ( |
| 57 | + <Card key={index} image={sig.image} title={sig.title} /> |
| 58 | + ))} |
| 59 | + </div> |
| 60 | + </div> |
| 61 | + |
| 62 | + <div className="py-32"> |
| 63 | + <p className="text-primary text-xl md:text-4xl font-semibold text-center"> |
| 64 | + Want to Start a SIG? |
| 65 | + </p> |
| 66 | + <p className="text-white text-xs md:text-2xl text-center mt-4 mx-auto max-w-[832px]"> |
| 67 | + If you’re passionate about a particular Python topic and want to |
| 68 | + start a SIG, reach out to us at{' '} |
| 69 | + <a href="mailto:durianpy.davao@gmail.com" className="underline"> |
| 70 | + durianpy.davao@gmail.com |
| 71 | + </a> |
| 72 | + . Our organizers will review and respond within 48 hours. |
| 73 | + </p> |
| 74 | + </div> |
| 75 | + </div> |
| 76 | + </div> |
| 77 | + ); |
| 78 | +} |
0 commit comments