fixed rounded corners bug for blur

This commit is contained in:
chark1es 2025-01-18 03:43:28 -08:00
parent 79212b52e3
commit ef151ddfcd

View file

@ -5,20 +5,12 @@ const { title, list } = Astro.props;
---
<div
class="px-[10%] relative flex flex-col justify-center items-center w-[20vw] h-[43vh] bg-gradient-to-b from-ieee-blue-100/25 to-ieee-black backdrop-blur rounded-[2vw] border-white/40 border-[0.1vw]"
class="px-[10%] flex flex-col justify-center items-center w-[20vw] h-[38vh] bg-gradient-to-b from-ieee-blue-100/25 to-ieee-black backdrop-blur rounded-[2vw] border-white/40 border-[0.1vw]"
>
<p class="text-[1.5vw] mb-[10%] font-semibold pt-[10%]">
{title}
</p>
<ul class="text-[1vw] font-light">
{list.map((item) => <li>&#8226; {item}</li>)}
{list.map((item: string) => <li>&#8226; {item}</li>)}
</ul>
<div
class="-top-[10%] w-fit p-[5%] shadow-ieee-blue-300 text-[3.2vw] bg-gradient-to-b from-ieee-blue-100 to-ieee-blue-300 rounded-full absolute"
>
{title === "Mechanical" && <FaGear />}
{title === "Electrical" && <FaMicrochip />}
{title === "AI" && <LuBrainCircuit />}
{title === "Embedded" && <FaCode />}
</div>
</div>