Polished Events and Contact pages

Author: Meatball1601

public/Everyone_SoSe2025.jpg

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { Card, CardContent, CardFooter, CardHeader } from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
@@ -72,18 +71,44 @@ const EventCard: React.FC<EventCardProps> = ({ event }) => {
     <Card className="overflow-hidden h-full flex flex-col transition-all hover:shadow-md">
       {/* Image and date/location badges */}
       <div className="relative h-48">
-        <img 
-          src={image} 
-          alt={title} 
-          className="w-full h-full object-cover" 
-        />
+        {image ? (
+          <img 
+            src={image} 
+            alt={title} 
+            className="w-full h-full object-cover" 
+          />
+        ) : (
+          <div className="w-full h-full bg-gradient-to-br from-primary-blue/10 to-primary-blue/5 flex items-center justify-center">
+            <svg
+              width="120"
+              height="120"
+              viewBox="0 0 120 120"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+              className="opacity-50"
+            >
+              {/* Confetti pieces */}
+              <path d="M20 20l10-10 10 10-10 10z" fill="#AB9A89" />
+              <path d="M80 30l15-15 15 15-15 15z" fill="rgb(51 51 81)" />
+              <path d="M40 80l12-12 12 12-12 12z" fill="rgb(248 221 186)" />
+              <path d="M90 70l8-8 8 8-8 8z" fill="#AB9A89" />
+              <path d="M60 40l6-6 6 6-6 6z" fill="rgb(51 51 81)" />
+              <path d="M30 50l9-9 9 9-9 9z" fill="rgb(248 221 186)" />
+              <path d="M70 90l11-11 11 11-11 11z" fill="#AB9A89" />
+              {/* Calendar icon in center */}
+              <rect x="45" y="45" width="30" height="30" rx="4" fill="none" stroke="currentColor" strokeWidth="2" />
+              <line x1="45" y1="55" x2="75" y2="55" stroke="currentColor" strokeWidth="2" />
+              <line x1="55" y1="45" x2="55" y2="65" stroke="currentColor" strokeWidth="2" />
+            </svg>
+          </div>
+        )}
         <div className="absolute top-3 left-3 flex items-center gap-1 bg-white/80 backdrop-blur-sm px-2 py-1 rounded-md">
           <Calendar size={14} className="text-primary-blue flex-shrink-0" />
           <span className="text-xs font-medium truncate max-w-[150px]">{formatDate(date)}</span>
         </div>
         {location && (
           <div className="absolute top-3 right-3">
-            <Badge variant="secondary" className="bg-offwhite text-primary-blue text-xs truncate max-w-[100px]">
+            <Badge variant="secondary" className="bg-offwhite text-primary-blue text-xs truncate max-w-[120px]">
               {location}
             </Badge>
           </div>
@@ -118,15 +143,15 @@ const EventCard: React.FC<EventCardProps> = ({ event }) => {
           <div className="flex flex-wrap gap-1">
             {supporters.map((supporter, index) => {
               // Get color based on index
-              const backgroundColor = getRotatingColor(index);
+              const backgroundColor = "#AB9A89";//getRotatingColor(index);
               // Get appropriate text color for contrast
-              const textColor = getContrastTextColor(backgroundColor);
+              const textColor = "hsl(40 33% 98%)";//getContrastTextColor("#AB9A89");
 
               return (
                 <Badge 
                   key={index} 
                   variant="outline" 
-                  className="text-xs border truncate max-w-[120px]"
+                  className="text-xs border truncate max-w-[240px]"
                   style={{ 
                     backgroundColor, 
                     borderColor: backgroundColor,

src/components/EventCard.tsx

@@ -1,4 +1,3 @@
-
 import React from "react";
 import { Link } from "react-router-dom";
 import { Button } from "@/components/ui/button";
@@ -55,12 +54,12 @@ const HeroSection = () => {
           </div>
 
           {/* Team image with rounded corners */}
-          <div className="w-full lg:w-1/2 flex justify-center lg:justify-end">
-            <div className="relative overflow-hidden rounded-2xl shadow-lg border-4 border-offwhite">
+          <div className="w-full lg:w-1/2 flex justify-center">
+            <div className="relative overflow-hidden rounded-2xl shadow-lg border-4 border-offwhite h-[600px]">
               <img 
-                src="/lovable-uploads/f96871b8-773a-4f10-a7bf-67c1abe3384c.png" 
+                src="/Everyone_SoSe2025.jpg" 
                 alt="OpenHardware Team" 
-                className="w-full max-w-md mx-auto object-cover"
+                className="w-full h-full object-cover object-center"
               />
             </div>
           </div>

src/components/HeroSection.tsx

@@ -52,11 +52,21 @@ const TeamMember: React.FC<TeamMemberProps> = ({
           ) : !isOpenPosition ? (
             // Placeholder image if no image and not open position
             <div className="w-full h-60 flex items-center justify-center bg-gray-100">
-              <img 
-                src={"placeholder.png"} 
-                alt={name} 
-                className={`w-full h-60 object-cover object-center ${isOpenPosition ? 'opacity-80' : ''}`}
-              />
+              <svg
+                width="120"
+                height="120"
+                viewBox="0 0 120 120"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+                className="text-gray-300"
+              >
+                {/* Person silhouette */}
+                <circle cx="60" cy="40" r="25" fill="currentColor" />
+                <path
+                  d="M30 100C30 83.4315 43.4315 70 60 70C76.5685 70 90 83.4315 90 100"
+                  fill="currentColor"
+                />
+              </svg>
             </div>
           ) : (
             <div className={`w-full h-60 flex items-center justify-center bg-gray-100 ${isOpenPosition ? 'opacity-80' : ''}`}>

src/components/TeamMember.tsx

@@ -32,7 +32,7 @@ export interface Event {
   title: string;
   description: string;
   date: string; // Format: YYYY-MM-DD
-  image: string;
+  image?: string;
   link: {
     url: string;
     type: "instagram" | "signup" | "linkedin" | "luma" | "other";
@@ -53,7 +53,6 @@ export const eventsData: Event[] = [
     title: "ASIP Hackathon 2025",
     description: "A hackathon focused on Application-Specific Instruction Set Processors using the ASIP Designer Tool from Synopsys. Participants developed ML inference accelerators with guidance from industry experts.",
     date: "2025-03-15",
-    image: "/media/events/asip-hackathon-2025.png",
     link: {
       url: "https://www.linkedin.com/events/asiphackathon2025/",
       type: "linkedin"
@@ -67,15 +66,14 @@ export const eventsData: Event[] = [
       { name: "AI Processor Design Chair at TUM", type: "chair" },
       { name: "Synopsys", type: "company" }
     ],
-    location: "Technical University of Munich",
+    location: "TUM",
     isArchived: true
   },
   {
     id: "2",
     title: "Munich Neuromorphic Hackathon 2024",
     description: "An immersive hackathon on neuromorphic computing technologies with collaboration from fortiss, neurobus, and IBM, featuring expert talks and hands-on challenges.",
     date: "2024-04-20",
-    image: "/media/events/neuromorphic-hackathon-2024.png",
     link: {
       url: "https://www.instagram.com/p/munich-neuromorphic-hackathon/",
       type: "instagram"
@@ -91,15 +89,14 @@ export const eventsData: Event[] = [
       { name: "neurobus", type: "organization" },
       { name: "IBM", type: "company" }
     ],
-    location: "Munich, Germany",
+    location: "Munich",
     isArchived: true
   },
   {
     id: "3",
     title: "Neuromorphic Hackathon 2023",
     description: "Four-day hackathon focused on neuromorphic technologies, hosted in collaboration with Fortiss Neuromorphic Labs and Intel, featuring team challenges based on state-of-the-art research.",
     date: "2023-11-06",
-    image: "/media/events/neuromorphic-hackathon-2023.png",
     link: {
       url: "https://luma.com/events/neuromorphic-hackathon-2023",
       type: "luma"
@@ -112,7 +109,7 @@ export const eventsData: Event[] = [
       { name: "Fortiss Neuromorphic Labs", type: "organization" },
       { name: "Intel", type: "company" }
     ],
-    location: "Fortiss offices, Munich",
+    location: "Fortiss offices",
     isArchived: true
   }
 ];

src/data/eventsData.ts

@@ -159,7 +159,6 @@ export const peopleData: Person[] = [
     name: "Alyona Starikova",
     role: "Former Co-Director",
     image: "/media/alumni/alyona-starikova.png",
-    linkedIn: "https://linkedin.com",
     isActive: false,
     joinDate: "2021-06",
     endDate: "2023-01",
@@ -174,7 +173,6 @@ export const peopleData: Person[] = [
     name: "Fabio Veneto",
     role: "Former Team Lead",
     image: "/media/alumni/fabio-veneto.png",
-    linkedIn: "https://linkedin.com",
     isActive: false,
     joinDate: "2021-09",
     endDate: "2023-05",
@@ -189,7 +187,6 @@ export const peopleData: Person[] = [
     name: "Ingo Fritz",
     role: "Former Team Member",
     image: "/media/alumni/ingo-fritz.png",
-    linkedIn: "https://linkedin.com",
     isActive: false,
     joinDate: "2022-01",
     endDate: "2023-04",
@@ -203,7 +200,6 @@ export const peopleData: Person[] = [
     name: "Benedikt Witteler",
     role: "Former Team Member",
     image: "/media/alumni/benedikt-witteler.png",
-    linkedIn: "https://linkedin.com",
     education: "TUM, Master Electrical Engineering and Information Technology",
     isActive: false,
     joinDate: "2023-11",
@@ -218,7 +214,6 @@ export const peopleData: Person[] = [
     name: "Ashik Chalakariyil Jayamon",
     role: "Former Team Member",
     image: "/media/alumni/ashik-jayamon.png",
-    linkedIn: "https://linkedin.com",
     education: "M.Sc. Communications and Electronics",
     isActive: false,
     joinDate: "2023-12",
@@ -233,7 +228,6 @@ export const peopleData: Person[] = [
     name: "Michael Neumeier",
     role: "Former Advisor",
     image: "/media/alumni/michael-neumeier.png",
-    linkedIn: "https://linkedin.com",
     education: "Neuromorphic Computing Researcher at Fortiss",
     isActive: false,
     joinDate: "2023-02",
@@ -248,7 +242,6 @@ export const peopleData: Person[] = [
     name: "Elvin Hajizada",
     role: "Former Advisor",
     image: "/media/alumni/elvin-hajizada.png",
-    linkedIn: "https://linkedin.com",
     education: "Neuromorphic & Continual AI Researcher at Intel Labs",
     isActive: false,
     joinDate: "2023-03",

src/data/peopleData.ts

@@ -213,15 +213,17 @@ const Alumni = () => {
                         {formatDate(member.joinDate)} - {member.endDate ? formatDate(member.endDate) : "Present"}
                       </TableCell>
                       <TableCell>
-                        <a 
-                          href={member.linkedIn} 
-                          target="_blank" 
-                          rel="noopener noreferrer"
-                          className="flex items-center justify-center p-2 text-primary-blue hover:text-primary-blue/70 transition-colors"
-                          aria-label={`${member.name}'s LinkedIn profile`}
-                        >
-                          <Linkedin size={20} />
-                        </a>
+                        {member.linkedIn && (
+                          <a 
+                            href={member.linkedIn} 
+                            target="_blank" 
+                            rel="noopener noreferrer"
+                            className="flex items-center justify-center p-2 text-primary-blue hover:text-primary-blue/70 transition-colors"
+                            aria-label={`${member.name}'s LinkedIn profile`}
+                          >
+                            <Linkedin size={20} />
+                          </a>
+                        )}
                       </TableCell>
                     </TableRow>
                   ))
@@ -252,15 +254,17 @@ const Alumni = () => {
                   <div key={member.id} className="bg-white p-4 rounded-lg shadow">
                     <div className="flex justify-between items-start mb-2">
                       <h4 className="font-bold">{member.name}</h4>
-                      <a 
-                        href={member.linkedIn} 
-                        target="_blank" 
-                        rel="noopener noreferrer"
-                        className="p-1 text-primary-blue hover:text-primary-blue/70"
-                        aria-label={`${member.name}'s LinkedIn profile`}
-                      >
-                        <Linkedin size={18} />
-                      </a>
+                      {member.linkedIn && (
+                        <a 
+                          href={member.linkedIn} 
+                          target="_blank" 
+                          rel="noopener noreferrer"
+                          className="p-1 text-primary-blue hover:text-primary-blue/70"
+                          aria-label={`${member.name}'s LinkedIn profile`}
+                        >
+                          <Linkedin size={18} />
+                        </a>
+                      )}
                     </div>
 
                     <p className="text-gray-600 text-sm mb-2">{member.role || "Member"}</p>