streaper2/afrov2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: force vertical sidebar on all devices and ensure it perfectly tracks the article height

Browse Source
This commit is contained in:
streaper2
2026-05-10 14:37:30 +02:00
parent 94de36e937
commit 889d3967d2
2 changed files with 29 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
components/BlogShareButtons.tsx
View File

@@ -32,41 +32,41 @@ export default function BlogShareButtons({ title }: Props) {
if (!url) return null;
return (
<div className="flex flex-row lg:flex-col gap-3 z-50">
<div className="flex flex-col gap-3 z-50">
<a
href={shareLinks.facebook}
target="_blank"
rel="noopener noreferrer"
className="w-12 h-12 lg:w-10 lg:h-10 rounded-full bg-white text-[#1877F2] shadow-xl flex items-center justify-center hover:scale-110 transition-transform"
className="w-10 h-10 rounded-full bg-white text-[#1877F2] shadow-xl flex items-center justify-center hover:scale-110 transition-transform"
title="Partager sur Facebook"
>
<Facebook className="w-6 h-6 lg:w-5 lg:h-5" />
<Facebook className="w-5 h-5" />
</a>
<a
href={shareLinks.twitter}
target="_blank"
rel="noopener noreferrer"
className="w-12 h-12 lg:w-10 lg:h-10 rounded-full bg-white text-black shadow-xl flex items-center justify-center hover:scale-110 transition-transform border border-gray-100"
className="w-10 h-10 rounded-full bg-white text-black shadow-xl flex items-center justify-center hover:scale-110 transition-transform border border-gray-100"
title="Partager sur X (Twitter)"
>
<Twitter className="w-6 h-6 lg:w-5 lg:h-5" />
<Twitter className="w-5 h-5" />
</a>
<button
onClick={() => handleCopy('Lien copié ! Vous pouvez le coller sur Instagram.')}
className="w-12 h-12 lg:w-10 lg:h-10 rounded-full bg-gradient-to-tr from-[#f9ce34] via-[#ee2a7b] to-[#6228d7] text-white shadow-xl flex items-center justify-center hover:scale-110 transition-transform"
className="w-10 h-10 rounded-full bg-gradient-to-tr from-[#f9ce34] via-[#ee2a7b] to-[#6228d7] text-white shadow-xl flex items-center justify-center hover:scale-110 transition-transform"
title="Copier le lien pour Instagram"
>
<Instagram className="w-6 h-6 lg:w-5 lg:h-5" />
<Instagram className="w-5 h-5" />
</button>
<button
onClick={() => handleCopy()}
className="w-12 h-12 lg:w-10 lg:h-10 rounded-full bg-gray-800 text-white shadow-xl flex items-center justify-center hover:scale-110 transition-transform"
className="w-10 h-10 rounded-full bg-gray-800 text-white shadow-xl flex items-center justify-center hover:scale-110 transition-transform"
title="Copier le lien"
>
{copied ? <Check className="w-6 h-6 lg:w-5 lg:h-5 text-green-400" /> : <LinkIcon className="w-6 h-6 lg:w-5 lg:h-5" />}
{copied ? <Check className="w-5 h-5 text-green-400" /> : <LinkIcon className="w-5 h-5" />}
</button>
</div>
);