troy/troylusty.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

fix: always show project title over hero image on mobile
All checks were successful
Docker / build-and-push-image (push) Successful in 1m58s
Details

Browse source
This commit is contained in:
Troy 2025-07-25 19:15:46 +01:00
parent c7be9f3aba
commit db23c4aee4
Signed by: troy
GPG key ID: DFC06C02ED3B4711
3 changed files with 10 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/AboutList.astro
View file

@ -41,7 +41,9 @@ const { information } = Astro.props;
)} )}
</div> </div>
<div class="grow text-right"> <div class="grow text-right">
<p class="text-tertiary font-mono text-sm text-nowrap">{item.date}</p> <p class="text-secondary/70 font-mono text-sm font-light text-nowrap">
{item.date}
</p>
{item.date_opt ? ( {item.date_opt ? (
<p class="text-secondary/70 text-sm">{item.date_opt}</p> <p class="text-secondary/70 text-sm">{item.date_opt}</p>
) : null} ) : null}

8
src/components/ShowcaseProject.astro
View file

@ -22,9 +22,11 @@ const { collection } = Astro.props;
/> />
</div> </div>
<div <div
class="relative opacity-0 transition-all delay-100 duration-300 ease-in-out group-hover:opacity-100" class="relative opacity-100 transition-all delay-100 duration-300 ease-in-out group-hover:opacity-100 md:opacity-0"
>
<p
class="bg-primary/50 absolute right-5 bottom-5 rounded-sm px-1 py-0.5 font-medium text-white md:bg-transparent"
> >
<p class="absolute right-5 bottom-5 font-medium text-white">
{ {
collection.data.collection ? ( collection.data.collection ? (
<span> <span>
@ -39,7 +41,7 @@ const { collection } = Astro.props;
</div> </div>
{ {
collection.data.highlight ? ( collection.data.highlight ? (
<div class="relative transition-all duration-300 ease-in-out group-hover:opacity-0"> <div class="relative transition-all duration-150 ease-in-out group-hover:opacity-0">
<div class="absolute bottom-5 left-5 flex w-fit items-center gap-0.5 rounded-full p-1 transition-transform duration-300 hover:scale-102 hover:-rotate-2"> <div class="absolute bottom-5 left-5 flex w-fit items-center gap-0.5 rounded-full p-1 transition-transform duration-300 hover:scale-102 hover:-rotate-2">
<span class="mr-1 h-1.5 w-1.5 rounded-full bg-green-600 dark:bg-green-400" /> <span class="mr-1 h-1.5 w-1.5 rounded-full bg-green-600 dark:bg-green-400" />
<p class="font-medium text-white">New</p> <p class="font-medium text-white">New</p>

4
src/components/Slideshow.astro
View file

@ -31,8 +31,8 @@ const { interval = 3000, images } = Astro.props;
loading="eager" loading="eager"
{...(index === 0 && { priority: true })} {...(index === 0 && { priority: true })}
/> />
<div class="relative opacity-0 transition-all delay-100 duration-300 ease-in-out group-hover:opacity-100"> <div class="relative opacity-100 transition-all delay-100 duration-300 ease-in-out group-hover:opacity-100 md:opacity-0">
<p class="absolute right-5 bottom-5 font-medium text-white"> <p class="bg-primary/50 absolute right-5 bottom-5 rounded-sm px-1 py-0.5 font-medium text-white md:bg-transparent">
{image.data.title} {image.data.title}
</p> </p>
</div> </div>