diff --git a/src/components/AboutList.astro b/src/components/AboutList.astro
index 31fc047..f38dc97 100644
--- a/src/components/AboutList.astro
+++ b/src/components/AboutList.astro
@@ -41,7 +41,9 @@ const { information } = Astro.props;
         )}
       </div>
       <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 ? (
           <p class="text-secondary/70 text-sm">{item.date_opt}</p>
         ) : null}
diff --git a/src/components/ShowcaseProject.astro b/src/components/ShowcaseProject.astro
index d4727a0..1a1788c 100644
--- a/src/components/ShowcaseProject.astro
+++ b/src/components/ShowcaseProject.astro
@@ -22,9 +22,11 @@ const { collection } = Astro.props;
         />
       </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="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"
+        >
           {
             collection.data.collection ? (
               <span>
@@ -39,7 +41,7 @@ const { collection } = Astro.props;
       </div>
       {
         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">
               <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>
diff --git a/src/components/Slideshow.astro b/src/components/Slideshow.astro
index c42fd49..f11a069 100644
--- a/src/components/Slideshow.astro
+++ b/src/components/Slideshow.astro
@@ -31,8 +31,8 @@ const { interval = 3000, images } = Astro.props;
             loading="eager"
             {...(index === 0 && { priority: true })}
           />
-          <div class="relative opacity-0 transition-all delay-100 duration-300 ease-in-out group-hover:opacity-100">
-            <p class="absolute right-5 bottom-5 font-medium text-white">
+          <div 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">
               {image.data.title}
             </p>
           </div>