Fixed project card images being covered on mobile

LucasSteer · Jul 30, 2023 · 165bb26 · 165bb26
1 parent c3f6228
commit 165bb26
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/components/ProjectCard.vue b/components/ProjectCard.vue
@@ -4,11 +4,11 @@
   >
     <ExternalLink
       :url="link"
-      class="group text-grey dark:text-white hover:text-grey dark:hover:text-white hover:no-underline focus:text-grey dark:focus:text-white focus:no-underline"
+      class="group text-grey no-underline dark:text-white hover:text-grey dark:hover:text-white focus:text-grey dark:focus:text-white"
     >
-      <img :src="imgSrc" :alt="imgAlt" class="h-full w-full" />
+      <img :src="imgSrc" :alt="imgAlt" class="tablet:h-full w-full" />
       <div
-        class="min-h-1/6 w-full absolute bottom-0 flex flex-col justify-center gap-2 bg-white dark:bg-zinc-800 forced-colors:group-hover:text-systemColors-SelectedItemText forced-colors:group-focus:text-systemColors-SelectedItemText forced-colors:group-active:text-systemColors-SelectedItemText forced-colors:group-hover:bg-systemColors-SelectedItem forced-colors:group-focus:bg-systemColors-SelectedItem forced-colors:group-active:bg-systemColors-SelectedItem group-hover:bg-grey-50 group-focus:bg-grey-50 group-active:bg-grey-100 dark:group-hover:bg-zinc-700 dark:group-focus:bg-zinc-700 dark:group-active:bg-zinc-600 px-4 pt-2 pb-8 tablet:px-8 tablet:pt-3 tablet:pb-10"
+        class="min-h-1/6 w-full tablet:absolute tablet:bottom-0 flex flex-col justify-center gap-2 bg-white dark:bg-zinc-800 forced-colors:group-hover:text-systemColors-SelectedItemText forced-colors:group-focus:text-systemColors-SelectedItemText forced-colors:group-active:text-systemColors-SelectedItemText forced-colors:group-hover:bg-systemColors-SelectedItem forced-colors:group-focus:bg-systemColors-SelectedItem forced-colors:group-active:bg-systemColors-SelectedItem group-hover:bg-grey-50 group-focus:bg-grey-50 group-active:bg-grey-100 dark:group-hover:bg-zinc-700 dark:group-focus:bg-zinc-700 dark:group-active:bg-zinc-600 px-4 pt-2 pb-8 tablet:px-8 tablet:pt-3 tablet:pb-10"
       >
         <h2
           class="text-xl decoration-2 underline-offset-4 underline group-hover:decoration-4 group-focus:decoration-4 tracking-widest text-green-baseLarge dark:text-greenDarkMode-baseLarge tablet:text-2xl desktop:text-4xl"