Centering grid images - removing unnecesary css
This commit is contained in:
parent
2979d507a7
commit
04f86aee9a
|
|
@ -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>
|
||||
)}
|
||||
Loading…
Reference in New Issue