Changes
Co-authored-by: Damaj301damaj-lol <90093996+Damaj301damaj-lol@users.noreply.github.com>
This commit is contained in:
parent
bd762556c7
commit
7a6ba998fc
1 changed files with 33 additions and 24 deletions
|
|
@ -1,10 +1,11 @@
|
||||||
import { useRef, useState, useEffect, useCallback } from 'react';
|
import { useRef, useState, useEffect, useCallback } from 'react';
|
||||||
|
import { Link } from 'react-router-dom';
|
||||||
import { GlassCard } from '@/components/GlassCard';
|
import { GlassCard } from '@/components/GlassCard';
|
||||||
import avatar from '@/assets/avatar.png';
|
import avatar from '@/assets/avatar.png';
|
||||||
import { Home, MessageCircle, Rss, GitBranch, Search, ExternalLink } from 'lucide-react';
|
import { MessageCircle, Rss, GitBranch, Search, ExternalLink, ArrowUpRight } from 'lucide-react';
|
||||||
|
|
||||||
const items = [
|
const items = [
|
||||||
{ icon: MessageCircle, label: 'Who Am I?', href: 'https://damaj.tech/site/whoami', desc: 'About me' },
|
{ icon: MessageCircle, label: 'Who Am I?', href: '/whoami', desc: 'About me', internal: true },
|
||||||
{ icon: Rss, label: 'Blog', href: 'https://damaj.tech/site/blog', desc: 'My writings' },
|
{ icon: Rss, label: 'Blog', href: 'https://damaj.tech/site/blog', desc: 'My writings' },
|
||||||
{ icon: GitBranch, label: 'Git Server', href: 'https://git.damaj.tech/', desc: 'Self-hosted Forgejo' },
|
{ icon: GitBranch, label: 'Git Server', href: 'https://git.damaj.tech/', desc: 'Self-hosted Forgejo' },
|
||||||
{ icon: Search, label: 'SearXNG', href: 'https://searxng.damaj.tech/', desc: 'Private search' },
|
{ icon: Search, label: 'SearXNG', href: 'https://searxng.damaj.tech/', desc: 'Private search' },
|
||||||
|
|
@ -151,28 +152,36 @@ const Index = () => {
|
||||||
const cardW = isMobile ? 110 : 130;
|
const cardW = isMobile ? 110 : 130;
|
||||||
const cardH = isMobile ? 80 : 90;
|
const cardH = isMobile ? 80 : 90;
|
||||||
|
|
||||||
return (
|
const cardContent = (
|
||||||
<a
|
<GlassCard className="p-3 md:p-4 link-arrow-parent cursor-pointer">
|
||||||
key={item.label}
|
<div className="flex items-start justify-between">
|
||||||
ref={(el) => { cardRefs.current[i] = el; }}
|
<item.icon className="w-4 h-4 text-primary mb-1.5" />
|
||||||
href={item.href}
|
{item.internal
|
||||||
target="_blank"
|
? <ArrowUpRight className="w-3 h-3 text-muted-foreground link-arrow" />
|
||||||
rel="noopener noreferrer"
|
: <ExternalLink className="w-3 h-3 text-muted-foreground link-arrow" />}
|
||||||
className="absolute"
|
</div>
|
||||||
style={{
|
<p className="font-heading font-semibold text-foreground text-xs md:text-sm leading-tight">{item.label}</p>
|
||||||
left: `calc(50% + ${x}px - ${cardW / 2}px)`,
|
<p className="text-[10px] text-muted-foreground mt-0.5 leading-tight">{item.desc}</p>
|
||||||
top: `calc(50% + ${y}px - ${cardH / 2}px)`,
|
</GlassCard>
|
||||||
width: cardW,
|
);
|
||||||
}}
|
|
||||||
>
|
const commonProps = {
|
||||||
<GlassCard className="p-3 md:p-4 link-arrow-parent cursor-pointer">
|
ref: (el: HTMLAnchorElement | null) => { cardRefs.current[i] = el; },
|
||||||
<div className="flex items-start justify-between">
|
className: 'absolute',
|
||||||
<item.icon className="w-4 h-4 text-primary mb-1.5" />
|
style: {
|
||||||
<ExternalLink className="w-3 h-3 text-muted-foreground link-arrow" />
|
left: `calc(50% + ${x}px - ${cardW / 2}px)`,
|
||||||
</div>
|
top: `calc(50% + ${y}px - ${cardH / 2}px)`,
|
||||||
<p className="font-heading font-semibold text-foreground text-xs md:text-sm leading-tight">{item.label}</p>
|
width: cardW,
|
||||||
<p className="text-[10px] text-muted-foreground mt-0.5 leading-tight">{item.desc}</p>
|
},
|
||||||
</GlassCard>
|
};
|
||||||
|
|
||||||
|
return item.internal ? (
|
||||||
|
<Link key={item.label} to={item.href} {...commonProps}>
|
||||||
|
{cardContent}
|
||||||
|
</Link>
|
||||||
|
) : (
|
||||||
|
<a key={item.label} href={item.href} target="_blank" rel="noopener noreferrer" {...commonProps}>
|
||||||
|
{cardContent}
|
||||||
</a>
|
</a>
|
||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue