make accordion more reactive

This commit is contained in:
Troy 2025-01-30 19:54:31 +00:00
parent d5538e740b
commit a5209b618d
Signed by: troy
GPG key ID: DFC06C02ED3B4711
4 changed files with 11 additions and 8 deletions

View file

@ -16,13 +16,15 @@ const { institution, qualification, grades, isOpen = false } = Astro.props;
<summary
class="flex cursor-pointer items-center justify-between py-3 font-bold"
>
<p class="text-secondary m-0 font-semibold text-balance">
<p
class="text-tertiary group-hover:text-secondary group-open:text-secondary group-open:group-hover:text-tertiary m-0 font-semibold text-balance transition-colors"
>
{qualification}
</p>
<span class="transition group-open:rotate-180">
<Icon
name="mdi:chevron-down"
class="text-secondary group-open:text-tertiary h-6 w-auto transition-colors"
class="text-tertiary group-open:text-secondary group-hover:text-secondary group-open:group-hover:text-tertiary h-6 w-auto transition-colors"
/>
</span>
</summary>

View file

@ -70,7 +70,7 @@ import Link from "@components/Link.astro";
</section>
<section class="animate-reveal opacity-0 [animation-delay:0.3s]">
<h2 class="mb-4 text-2xl font-semibold break-words capitalize">Skills</h2>
<p class="mb-2">
<p class="mb-4">
My specific chosen area of focus is design, lighting, and rendering
focusing on 3D environments within software such as Blender and Unreal
Engine. Using either real-time or offline rendering techniques. In