Centering grid images - removing unnecesary css

This commit is contained in:
Julio Ruiz 2026-02-11 23:40:41 -05:00
parent 2979d507a7
commit 04f86aee9a
1 changed files with 2 additions and 11 deletions

View File

@ -9,7 +9,7 @@ const imageUrl = props.image || ''
---
{props.type !== 'imgText' && (
<div class="aspect-square overflow-hidden">
<div class={`flex flex-col justify-between h-full bg-[${props.bgColor}]`}>
<div class={`flex flex-col justify-center h-full bg-[${props.bgColor}]`}>
{ props.type === 'text' && (
<div class="p-16 flex flex-col justify-between h-full">
<Icon name={props.icon} class={`text-8xl text-[${textColor}]`} />
@ -37,13 +37,4 @@ const imageUrl = props.image || ''
</div>
</div>
</div>
)}
<style define:vars={{ imageUrl }}>
.gridcard {
/* Use the CSS variable in the background-image property */
background-image: url(var(--imageUrl));
background-size: cover;
background-position: center;
}
</style>
)}