joachim/me-joachimhummel-de
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add a second email address to the contact section

Browse Source 
Update contact.tsx to include `kontakt@joachimhummel.de` alongside the existing `jh@unixweb.de` in the email contact options.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 9c03a06c-fe4f-4361-ba05-dbe78ca9024b
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/e678fe28-87ab-4437-945b-7a15e872a292/6f3329ae-2dcc-46cc-bf2e-f58b7a5fa805/YmfGtQf
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
joachimhummel
2026-05-15 15:56:10 +00:00
parent 6840b32713
commit 8a5041ff6e
1 changed files with 37 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
artifacts/joachim-portfolio/src/components/contact.tsx
View File

@@ -1,6 +1,11 @@
import { motion } from "framer-motion"; import { motion } from "framer-motion";
import { Mail, ExternalLink, ArrowRight } from "lucide-react"; import { Mail, ExternalLink, ArrowRight } from "lucide-react";
const emailAddresses = [
{ address: "jh@unixweb.de", label: "jh@unixweb.de" },
{ address: "kontakt@joachimhummel.de", label: "kontakt@joachimhummel.de" },
];
const links = [ const links = [
{ {
label: "Tech-Blog", label: "Tech-Blog",
@@ -40,21 +45,38 @@ export function Contact() {
</div> </div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<motion.a <div className="flex flex-col gap-3">
href="mailto:jh@unixweb.de" {emailAddresses.map((email, i) => (
whileHover={{ scale: 1.01 }} <motion.a
className="flex items-center gap-5 p-6 rounded-2xl bg-primary text-white border border-primary card-hover group" key={email.address}
data-testid="link-contact-email" href={`mailto:${email.address}`}
> whileHover={{ scale: 1.01 }}
<div className="w-12 h-12 rounded-xl bg-white/20 flex items-center justify-center shrink-0"> className={`flex items-center gap-5 p-5 rounded-2xl border card-hover group ${
<Mail className="w-6 h-6" /> i === 0
</div> ? "bg-primary text-white border-primary"
<div className="flex-grow"> : "bg-white text-foreground border-border"
<p className="font-semibold text-white">E-Mail schreiben</p> }`}
<p className="text-sm text-white/70">jh@unixweb.de</p> data-testid={`link-contact-email-${i}`}
</div> >
<ArrowRight className="w-5 h-5 text-white/60 group-hover:translate-x-1 transition-transform" /> <div className={`w-11 h-11 rounded-xl flex items-center justify-center shrink-0 ${
</motion.a> i === 0 ? "bg-white/20" : "bg-secondary"
}`}>
<Mail className={`w-5 h-5 ${i === 0 ? "text-white" : "text-primary"}`} />
</div>
<div className="flex-grow min-w-0">
<p className={`text-xs font-medium mb-0.5 ${i === 0 ? "text-white/70" : "text-muted-foreground"}`}>
{i === 0 ? "Hauptadresse" : "Alternativ"}
</p>
<p className={`text-sm font-semibold truncate ${i === 0 ? "text-white" : "text-foreground"}`}>
{email.label}
</p>
</div>
<ArrowRight className={`w-4 h-4 shrink-0 group-hover:translate-x-1 transition-all ${
i === 0 ? "text-white/60" : "text-muted-foreground/40 group-hover:text-primary"
}`} />
</motion.a>
))}
</div>
<div className="flex flex-col gap-3"> <div className="flex flex-col gap-3">
{links.map((link) => ( {links.map((link) => (