Добрый день. Есть компонент:
<template>
<div>
<div id="fone" style="z-index: -1" />
<div id="cursor" />
<div id="aura" />
<!-- <PreLoader /> -->
<SiteHeader />
<div class="content" />
<section class="logo-section">
<div id="logo__svg" />
</section>
<Nuxt />
<MainFooter />
<BottomFooter />
</div>
</template>
И стили:
<style scoped>
.logo-section {
position: relative;
z-index: 10;
}
.logo-section svg {
width: 30%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
#logo__svg {
position: relative;
width: 100%;
height: 100%;
}
#logo__svg>canvas {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
</style>
Как переместить logo__svg на задний план, на fone?