Egor fureunoir Gorbunov
cc11da01f9
Updated the SVG logo file in storefront to replace evibes branding with schon. Includes enhanced styling and additional view properties for resolution compatibility.
47 lines
No EOL
977 B
Vue
47 lines
No EOL
977 B
Vue
<template>
|
|
<div class="hero" :style="backgroundStyles">
|
|
<div class="container">
|
|
<div class="hero__wrapper">
|
|
<nuxt-img format="webp" densities="x1" src="/images/schon-big.png" alt="logo" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const img = useImage();
|
|
|
|
const backgroundStyles = computed(() => {
|
|
const imgUrl = img('/images/homeBg.png', { format: 'webp', densities: 'x1 x2' });
|
|
|
|
return { backgroundImage: `url('${imgUrl}')` };
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.hero {
|
|
background-repeat: no-repeat;
|
|
-webkit-background-size: cover;
|
|
background-size: cover;
|
|
position: relative;
|
|
|
|
&:after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba($black, 0.5);
|
|
backdrop-filter: blur(5px);
|
|
}
|
|
|
|
&__wrapper {
|
|
position: relative;
|
|
z-index: 1;
|
|
padding-block: 100px;
|
|
display: grid;
|
|
place-items: center;
|
|
}
|
|
}
|
|
</style> |