From 556f3f8cb92b56c850e1dd56b965ee982ec4831d Mon Sep 17 00:00:00 2001
From: Thomas Camlong <thomas@ajnart.fr>
Date: Fri, 28 Nov 2025 10:47:43 +0100
Subject: [PATCH] feat(web): increase recently added icons display count and
 adjust marquee speed

---
 web/src/app/page.tsx                        | 2 +-
 web/src/components/icon-details.tsx         | 6 ++----
 web/src/components/recently-added-icons.tsx | 4 ++--
 3 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx
index 3b57bf5f..cf46ba5e 100644
--- a/web/src/app/page.tsx
+++ b/web/src/app/page.tsx
@@ -14,7 +14,7 @@ async function getGitHubStars() {
 
 export default async function Home() {
 	const { totalIcons } = await getTotalIcons()
-	const recentIcons = await getRecentlyAddedIcons(10)
+	const recentIcons = await getRecentlyAddedIcons(20)
 	const stars = await getGitHubStars()
 
 	return (
diff --git a/web/src/components/icon-details.tsx b/web/src/components/icon-details.tsx
index d7d9f087..3047022d 100644
--- a/web/src/components/icon-details.tsx
+++ b/web/src/components/icon-details.tsx
@@ -512,15 +512,13 @@ export function IconDetails({ icon, iconData, authorData, allIcons, status, stat
 										<div className="flex items-center gap-2">
 											<div className="flex items-center gap-2">
 												<p className="text-sm font-medium">By:</p>
-												<Avatar className="h-5 w-5 border">
+												<Avatar className="h-6 w-6 border">
 													<AvatarImage
 														src={authorData.avatar_url}
 														alt={`${authorName}'s avatar`}
 													/>
 													<AvatarFallback>
-														{authorName
-															? authorName.slice(0, 2).toUpperCase()
-															: "??"}
+														{authorName?.slice(0, 1).toUpperCase()}
 													</AvatarFallback>
 												</Avatar>
 												{authorData.html_url && (
diff --git a/web/src/components/recently-added-icons.tsx b/web/src/components/recently-added-icons.tsx
index 8f699cec..9bc61836 100644
--- a/web/src/components/recently-added-icons.tsx
+++ b/web/src/components/recently-added-icons.tsx
@@ -38,7 +38,7 @@ export function RecentlyAddedIcons({ icons }: { icons: IconWithName[] }) {
 				</div>
 
 				<div className="relative flex w-full flex-col items-center justify-center overflow-hidden">
-					<Marquee pauseOnHover className="[--duration:60s] [--gap:1em] motion-safe:motion-preset-slide-left-sm motion-duration-1000">
+					<Marquee pauseOnHover className="[--duration:90s] [--gap:1em] motion-safe:motion-preset-slide-left-sm motion-duration-1000">
 						{firstRow.map(({ name, data }) => (
 							<RecentIconCard key={name} name={name} data={data} />
 						))}
@@ -46,7 +46,7 @@ export function RecentlyAddedIcons({ icons }: { icons: IconWithName[] }) {
 					<Marquee
 						reverse
 						pauseOnHover
-						className="[--duration:60s] [--gap:1rem] motion-safe:motion-preset-slide-right-sm motion-duration-1000"
+						className="[--duration:90s] [--gap:1rem] motion-safe:motion-preset-slide-right-sm motion-duration-1000"
 					>
 						{secondRow.map(({ name, data }) => (
 							<RecentIconCard key={name} name={name} data={data} />