diff --git a/src/components/BusinessCard.tsx b/src/components/BusinessCard.tsx
index d27ffd9..fa61c28 100644
--- a/src/components/BusinessCard.tsx
+++ b/src/components/BusinessCard.tsx
@@ -30,7 +30,7 @@ export function BusinessCard() {
-
+
);
diff --git a/src/components/Card/CardFooter.module.css b/src/components/Card/CardFooter.module.css
index 071e005..32d1f85 100644
--- a/src/components/Card/CardFooter.module.css
+++ b/src/components/Card/CardFooter.module.css
@@ -2,17 +2,27 @@
padding: 15px 20px;
text-align: center;
background: #f7fafc;
- font-size: 11px;
- color: #a0aec0;
- text-transform: uppercase;
+ font-size: 12px;
+ color: #4a5568;
letter-spacing: 0.5px;
}
+.legalLink {
+ color: #2d3748;
+ text-decoration: underline;
+ transition: color 0.2s;
+}
+
+.legalLink:hover {
+ color: #000;
+ text-decoration: underline;
+}
+
/* Extra Small Screens (320px - 479px) */
@media (max-width: 479px) {
.footer {
padding: 12px 16px;
- font-size: 10px;
+ font-size: 12px;
}
}
@@ -20,7 +30,7 @@
@media (min-width: 480px) and (max-width: 767px) {
.footer {
padding: 13px 18px;
- font-size: 10px;
+ font-size: 12px;
}
}
@@ -28,7 +38,7 @@
@media (min-width: 768px) and (max-width: 1023px) {
.footer {
padding: 14px 22px;
- font-size: 11px;
+ font-size: 12px;
}
}
@@ -36,6 +46,6 @@
@media (min-width: 1024px) {
.footer {
padding: 15px 20px;
- font-size: 11px;
+ font-size: 12px;
}
}
diff --git a/src/components/Card/CardFooter.tsx b/src/components/Card/CardFooter.tsx
index 2b83d67..8442865 100644
--- a/src/components/Card/CardFooter.tsx
+++ b/src/components/Card/CardFooter.tsx
@@ -3,12 +3,20 @@ import styles from './CardFooter.module.css';
interface CardFooterProps {
companyName: string;
personName: string;
+ imprintUrl?: string;
}
-export function CardFooter({ personName }: Readonly) {
+export function CardFooter({ personName, imprintUrl }: Readonly) {
return (
);
}
diff --git a/src/components/Card/CardProfile.module.css b/src/components/Card/CardProfile.module.css
index 7001750..16d07b6 100644
--- a/src/components/Card/CardProfile.module.css
+++ b/src/components/Card/CardProfile.module.css
@@ -33,8 +33,7 @@
font-weight: 600;
color: #667eea;
margin: 5px 0;
- text-transform: uppercase;
- letter-spacing: 1px;
+ letter-spacing: 0.5px;
word-break: break-word;
}
diff --git a/src/components/QRCodeDisplay.module.css b/src/components/QRCodeDisplay.module.css
index 78bb8fd..6d3a59b 100644
--- a/src/components/QRCodeDisplay.module.css
+++ b/src/components/QRCodeDisplay.module.css
@@ -47,7 +47,6 @@
color: #718096;
margin: 0;
text-align: center;
- text-transform: uppercase;
letter-spacing: 0.5px;
font-weight: 500;
}
@@ -67,7 +66,6 @@
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
- text-transform: uppercase;
letter-spacing: 0.5px;
}
diff --git a/src/components/SaveContactButton.module.css b/src/components/SaveContactButton.module.css
index cb30445..0e8f564 100644
--- a/src/components/SaveContactButton.module.css
+++ b/src/components/SaveContactButton.module.css
@@ -13,7 +13,6 @@
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
- text-transform: uppercase;
letter-spacing: 0.5px;
min-height: 44px;
}
diff --git a/src/config/businessCard.config.local.example.ts b/src/config/businessCard.config.local.example.ts
index 803de20..64353e2 100644
--- a/src/config/businessCard.config.local.example.ts
+++ b/src/config/businessCard.config.local.example.ts
@@ -27,4 +27,5 @@ export const localBusinessCard: BusinessCard = {
{ platform: 'GitHub', url: 'https://github.com/yourprofile', icon: 'Github' },
{ platform: 'Portfolio', url: 'https://yourwebsite.com', icon: 'Globe' },
],
+ // imprintUrl: 'https://yourwebsite.com/imprint',
};
diff --git a/src/config/businessCard.config.local.ts b/src/config/businessCard.config.local.ts
new file mode 100644
index 0000000..257d14b
--- /dev/null
+++ b/src/config/businessCard.config.local.ts
@@ -0,0 +1,22 @@
+import type { BusinessCard } from '../store/types';
+import businessCardImage from '../assets/sascha.png';
+
+// Default business card configuration
+// To customize locally without pushing to git, copy businessCard.config.local.example.ts
+// to businessCard.config.local.ts and modify it
+
+export const localBusinessCard: BusinessCard = {
+ name: 'Sascha Bach',
+ title: 'Web-Developer | Accessibility Advocate',
+ company: '',
+ email: 'freelancer@sascha-bach.de',
+ phone: '+49 179 9364867',
+ website: 'https://sascha-bach.de',
+ image: businessCardImage,
+ bio: 'Passionate about creating accessible and user-friendly web experiences.',
+ socialLinks: [
+ { platform: 'LinkedIn', url: 'https://linkedin.com/in/saschabach', icon: 'Linkedin' },
+ { platform: 'Codeberg', url: 'https://codeberg.org/saschab', icon: 'Github' },
+ ],
+ imprintUrl: 'https://sascha-bach.de/imprint',
+};
diff --git a/src/config/businessCard.config.ts b/src/config/businessCard.config.ts
index 3abad8f..0b2053d 100644
--- a/src/config/businessCard.config.ts
+++ b/src/config/businessCard.config.ts
@@ -19,4 +19,5 @@ export const defaultBusinessCard: BusinessCard = {
{ platform: 'GitHub', url: 'https://github.com/johndoe', icon: 'Github' },
{ platform: 'Portfolio', url: 'https://johndoe.design', icon: 'Globe' },
],
+ // imprintUrl: 'https://yourwebsite.com/imprint',
};
diff --git a/src/store/types.ts b/src/store/types.ts
index 04dd051..3cfe127 100644
--- a/src/store/types.ts
+++ b/src/store/types.ts
@@ -14,6 +14,7 @@ export interface BusinessCard {
image: string;
bio: string;
socialLinks: SocialLink[];
+ imprintUrl?: string;
}
export interface BusinessCardContextType {