adrianbonpin/deckyvault
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

style: add rounded corners to card images and hide scrollbars

Browse Source 
- Add rounded-xl to card images so corners match the card border radius
- Replace scrollbar-thin with scrollbar-none on horizontal scroll containers
This commit is contained in:
adrianbonpin
2026-06-26 21:57:13 +08:00
parent 236f293879
commit 38c58cdbd2
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/page.tsx
+4 -4
View File
@@ -121,7 +121,7 @@ function GameSection({
</div> </div>
</div> </div>
<div className='flex gap-3 overflow-x-auto pb-2 -mx-1 px-1 scrollbar-thin'> <div className='flex gap-3 overflow-x-auto pb-2 -mx-1 px-1 scrollbar-none'>
{games.map((game, idx) => ( {games.map((game, idx) => (
<motion.div <motion.div
key={game.id} key={game.id}
@@ -138,7 +138,7 @@ function GameSection({
src={game.capsule_image} src={game.capsule_image}
alt={game.title} alt={game.title}
fill fill
className='object-cover group-hover:scale-[0.97] transition-transform duration-300' className='object-cover rounded-xl group-hover:scale-[0.97] transition-transform duration-300'
sizes='(max-width: 640px) 144px, 176px' sizes='(max-width: 640px) 144px, 176px'
/> />
) : ( ) : (
@@ -228,7 +228,7 @@ function SaleSection({
</div> </div>
</div> </div>
<div className='flex gap-3 overflow-x-auto pb-2 -mx-1 px-1 scrollbar-thin'> <div className='flex gap-3 overflow-x-auto pb-2 -mx-1 px-1 scrollbar-none'>
{games.map((game, idx) => { {games.map((game, idx) => {
const discountPct = game.price_initial && game.price_current const discountPct = game.price_initial && game.price_current
? Math.round((1 - game.price_current / game.price_initial) * 100) ? Math.round((1 - game.price_current / game.price_initial) * 100)
@@ -250,7 +250,7 @@ function SaleSection({
src={game.capsule_image} src={game.capsule_image}
alt={game.title} alt={game.title}
fill fill
className='object-cover group-hover:scale-[0.97] transition-transform duration-300' className='object-cover rounded-xl group-hover:scale-[0.97] transition-transform duration-300'
sizes='(max-width: 640px) 144px, 176px' sizes='(max-width: 640px) 144px, 176px'
/> />
) : ( ) : (