wieerwill/wieerwill.github.io
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

add new nuxt build

Browse Source
This commit is contained in:
WieErWill
2021-07-04 16:56:48 +02:00
parent 5b9db458ac
commit 2fbbabe45c
142 changed files with 12354 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

274
nuxt/layouts/default.vue Normal file
View File

@@ -0,0 +1,274 @@
<template>
<div>
<div
class="background-80s animated-clouds stars"
style="--background-height: 100vh"
>
<div class="sun"></div>
<div
class="grid"
style="
--grid-color: rgba(115, 59, 139, 0.7);
--grid-size: 50px;
--grid-blur: 1px;
"
></div>
<!--big left mountain-->
<div
class="mountain"
style="
--mountain-tilt: -32deg;
--mountain-color1: #a684cb;
--mountain-color2: #150030;
--mountain-base: 10vw;
--mountain-height: 20vw;
--mountain-offset: -50vw;
"
></div>
<div
class="mountain"
style="
--mountain-tilt:0deg
--mountain-color1:#a684cb;
--mountain-color2:#2a025d;
--mountain-base:15vw;
--mountain-height:20vw;
--mountain-offset:-40vw;"
></div>
<div
class="mountain"
style="
--mountain-tilt: 32.5deg;
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 10vw;
--mountain-height: 20vw;
--mountain-offset: -25vw;
"
></div>
<!--big right mountain 2-->
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 12vw;
--mountain-height: 10vw;
--mountain-tilt: -56deg;
--mountain-offset: 15vw;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #2a025d;
--mountain-base: 10vw;
--mountain-height: 10vw;
--mountain-tilt: -20deg;
--mountain-offset: 27vw;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #150030;
--mountain-base: 10vw;
--mountain-height: 10vw;
--mountain-tilt: 32.5deg;
--mountain-offset: 37vw;
"
></div>
<!--small right mountain 1-->
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #b533b3;
--mountain-base: 10vw;
--mountain-height: 5vw;
--mountain-offset: 10vw;
--mountain-tilt: -20deg;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 10vw;
--mountain-height: 5vw;
--mountain-tilt: 59deg;
--mountain-offset: 20vw;
"
></div>
<!--small right mountain 2-->
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #b533b3;
--mountain-base: 8vw;
--mountain-height: 4vw;
--mountain-offset: 20vw;
--mountain-tilt: -20deg;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 3vw;
--mountain-height: 4vw;
--mountain-tilt: 45deg;
--mountain-offset: 28vw;
"
></div>
<!--small left mountain 1-->
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 5vw;
--mountain-height: 5vw;
--mountain-offset: -40vw;
--mountain-tilt: -20deg;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #b533b3;
--mountain-base: 5vw;
--mountain-height: 5vw;
--mountain-tilt: 33deg;
--mountain-offset: -35vw;
"
></div>
<!--small left mountain 2-->
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #b533b3;
--mountain-base: 10vw;
--mountain-height: 5vw;
--mountain-offset: -20vw;
--mountain-tilt: -20deg;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 10vw;
--mountain-height: 5vw;
--mountain-tilt: 59deg;
--mountain-offset: -10vw;
"
></div>
<!--big right mountain 1-->
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #b533b3;
--mountain-base: 5vw;
--mountain-height: 5vw;
--mountain-tilt: -62deg;
--mountain-offset: -5vw;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #681e6b;
--mountain-base: 10vw;
--mountain-height: 5vw;
--mountain-tilt: -20deg;
"
></div>
<div
class="mountain"
style="
--mountain-color1: #a684cb;
--mountain-color2: #150030;
--mountain-base: 10vw;
--mountain-height: 5vw;
--mountain-tilt: 59deg;
--mountain-offset: 10vw;
"
></div>
<div class="road-off"></div>
</div>
<div class="overlay"></div>
<Nuxt />
<svg width="0" height="0">
<filter id="synth-filter">
<feTurbulence
type="fractalNoise"
baseFrequency=".01"
numOctaves="10"
id="fractalNoise"
/>
<feDisplacementMap
id="displacementMap"
in="SourceGraphic"
scale="120"
/>
</filter>
<animate
xlink:href="#displacementMap"
id="animclouds1"
begin="0; animclouds2.end"
attributeName="scale"
from="50"
to="180"
dur="3s"
fill="freeze"
/>
<animate
xlink:href="#displacementMap"
id="animclouds2"
begin="animclouds1.end"
attributeName="scale"
from="180"
to="50"
dur="3s"
fill="freeze"
/>
<animate
xlink:href="#fractalNoise"
id="animclouds3"
begin="0;animclouds4.end"
attributeName="baseFrequency"
from="0.03"
to="0.01"
dur="30s"
fill="freeze"
/>
<animate
xlink:href="#fractalNoise"
id="animclouds4"
begin="animclouds3.end"
attributeName="baseFrequency"
from="0.01"
to="0.03"
dur="30s"
fill="freeze"
/>
</svg>
</div>
</template>
<script>
export default {};
</script>