refactor: Remove BackgroundImageDiv component
Component is redundant, move style to CSS class and allows to set the image via CSS variables
This commit is contained in:
parent
6e84ff1ec3
commit
3bd2b6a4b6
1 changed files with 0 additions and 35 deletions
|
|
@ -1,35 +0,0 @@
|
|||
---
|
||||
import { getImage } from 'astro:assets';
|
||||
|
||||
interface Props {
|
||||
src: string;
|
||||
width: number;
|
||||
height: number;
|
||||
}
|
||||
|
||||
const { src, width, height } = Astro.props;
|
||||
|
||||
const optimizedBackground = await getImage({
|
||||
src,
|
||||
width,
|
||||
height,
|
||||
format: 'webp',
|
||||
});
|
||||
---
|
||||
|
||||
<div id="bg">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<style define:vars={{ bgImage: `url(${optimizedBackground.src})` }}>
|
||||
#bg {
|
||||
background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
|
||||
var(--bgImage);
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
color: var(--prj-bg);
|
||||
|
||||
padding-top: var(--prj-spacing-3);
|
||||
padding-bottom: var(--prj-spacing-3);
|
||||
}
|
||||
</style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue