Fix: Hero Icons wie im Footer (lucide-react, nicht sticky)
- Linkedin und Github Icons aus lucide-react importiert - fixed zu absolute geändert (nicht mehr sticky) - Styling wie im Footer (text-zinc-400, hover-Effekte) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,4 +1,5 @@
|
|||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
import { Linkedin, Github } from 'lucide-react';
|
||||||
|
|
||||||
const Hero = () => {
|
const Hero = () => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
@@ -29,31 +30,31 @@ const Hero = () => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Social Links Bar */}
|
{/* Social Links Bar */}
|
||||||
<div className="fixed top-20 left-0 right-0 z-50 px-4 sm:px-8">
|
<div className="absolute top-20 left-0 right-0 px-4 sm:px-8" style={{ zIndex: 40 }}>
|
||||||
<div className="max-w-7xl mx-auto flex justify-between items-center">
|
<div className="max-w-7xl mx-auto flex justify-between items-center">
|
||||||
<div className="flex gap-3">
|
<div className="flex gap-4">
|
||||||
<a
|
<a
|
||||||
href="https://www.linkedin.com/in/damjan-savi%C4%87-720288127/"
|
href="https://www.linkedin.com/in/damjan-savi%C4%87-720288127/"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
className="w-10 h-10 flex items-center justify-center rounded-full bg-white/10 hover:bg-white/20 transition-colors text-white text-lg"
|
className="group text-zinc-400 hover:text-white transition-colors"
|
||||||
aria-label="LinkedIn"
|
aria-label="LinkedIn"
|
||||||
>
|
>
|
||||||
in
|
<Linkedin className="transform transition-transform group-hover:scale-110" size={20} />
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="https://github.com/damjan1996"
|
href="https://github.com/damjan1996"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noopener noreferrer"
|
rel="noopener noreferrer"
|
||||||
className="w-10 h-10 flex items-center justify-center rounded-full bg-white/10 hover:bg-white/20 transition-colors text-white text-lg font-mono"
|
className="group text-zinc-400 hover:text-white transition-colors"
|
||||||
aria-label="GitHub"
|
aria-label="GitHub"
|
||||||
>
|
>
|
||||||
</>
|
<Github className="transform transition-transform group-hover:scale-110" size={20} />
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<a
|
<a
|
||||||
href="mailto:info@damjan-savic.com"
|
href="mailto:info@damjan-savic.com"
|
||||||
className="text-sm text-white hover:text-zinc-300 transition-colors uppercase tracking-wider"
|
className="text-sm text-zinc-400 hover:text-white transition-colors uppercase tracking-wider"
|
||||||
>
|
>
|
||||||
{t('pages.home.hero.cta')}
|
{t('pages.home.hero.cta')}
|
||||||
</a>
|
</a>
|
||||||
|
|||||||
Reference in New Issue
Block a user