@creaditor/newsletter-starterkit
Version:
Creaditor Newsletter Editor - Starterkit for creating beautiful email newsletters
227 lines (225 loc) • 6.45 kB
JavaScript
"use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[3727],{63727:(n,o,a)=>{a.r(o),a.d(o,{GlowsPreset:()=>t});var i=a(56666),r=a(21293);class t extends r.oi{constructor(){super()}render(){return r.dy`<div class="background">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>`}}(0,i.Z)(t,"properties",{}),(0,i.Z)(t,"styles",r.iv`
.background {
width: 100vw;
min-height: 100vh;
height: 100%;
background: #3e1e68;
}
.background span {
width: 20vmin;
height: 20vmin;
border-radius: 20vmin;
backface-visibility: hidden;
position: absolute;
animation-name: move;
animation-duration: 6s;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
.background span:nth-child(1) {
color: #583c87;
top: 43%;
left: 77%;
animation-duration: 14.6s;
animation-delay: -7.7s;
transform-origin: -20vw -12vh;
box-shadow: 40vmin 0 12.3577140727vmin currentColor;
}
.background span:nth-child(2) {
color: #e45a84;
top: 44%;
left: 1%;
animation-duration: 10.7s;
animation-delay: -13.1s;
transform-origin: -23vw -9vh;
box-shadow: 40vmin 0 13.2998389183vmin currentColor;
}
.background span:nth-child(3) {
color: #583c87;
top: 63%;
left: 61%;
animation-duration: 13.2s;
animation-delay: -15.2s;
transform-origin: 14vw -19vh;
box-shadow: 40vmin 0 12.6254667274vmin currentColor;
}
.background span:nth-child(4) {
color: #583c87;
top: 84%;
left: 27%;
animation-duration: 11.1s;
animation-delay: -5.6s;
transform-origin: -20vw -8vh;
box-shadow: 40vmin 0 14.5555135073vmin currentColor;
}
.background span:nth-child(5) {
color: #583c87;
top: 72%;
left: 92%;
animation-duration: 13.7s;
animation-delay: -15.2s;
transform-origin: 8vw 23vh;
box-shadow: 40vmin 0 8.3232510119vmin currentColor;
}
.background span:nth-child(6) {
color: #ffacac;
top: 8%;
left: 99%;
animation-duration: 15.7s;
animation-delay: -6s;
transform-origin: 1vw 16vh;
box-shadow: 40vmin 0 11.8228398266vmin currentColor;
}
.background span:nth-child(7) {
color: #e45a84;
top: 39%;
left: 47%;
animation-duration: 14.1s;
animation-delay: -7.7s;
transform-origin: 9vw 20vh;
box-shadow: 40vmin 0 7.0216733189vmin currentColor;
}
.background span:nth-child(8) {
color: #583c87;
top: 68%;
left: 97%;
animation-duration: 15.9s;
animation-delay: -2.7s;
transform-origin: -9vw 7vh;
box-shadow: -40vmin 0 9.1155416902vmin currentColor;
}
.background span:nth-child(9) {
color: #583c87;
top: 75%;
left: 53%;
animation-duration: 12.7s;
animation-delay: -2.9s;
transform-origin: 9vw 19vh;
box-shadow: 40vmin 0 12.627886194vmin currentColor;
}
.background span:nth-child(10) {
color: #583c87;
top: 58%;
left: 6%;
animation-duration: 16s;
animation-delay: -5s;
transform-origin: -8vw -13vh;
box-shadow: 40vmin 0 14.2170673884vmin currentColor;
}
.background span:nth-child(11) {
color: #ffacac;
top: 49%;
left: 12%;
animation-duration: 13s;
animation-delay: -11.8s;
transform-origin: 20vw -13vh;
box-shadow: -40vmin 0 14.2093994599vmin currentColor;
}
.background span:nth-child(12) {
color: #e45a84;
top: 70%;
left: 48%;
animation-duration: 15.3s;
animation-delay: -8.6s;
transform-origin: 11vw -10vh;
box-shadow: -40vmin 0 13.5439302076vmin currentColor;
}
.background span:nth-child(13) {
color: #e45a84;
top: 31%;
left: 24%;
animation-duration: 10.9s;
animation-delay: -14.1s;
transform-origin: -6vw -4vh;
box-shadow: 40vmin 0 11.6554756322vmin currentColor;
}
.background span:nth-child(14) {
color: #e45a84;
top: 66%;
left: 10%;
animation-duration: 15.4s;
animation-delay: -15.2s;
transform-origin: 24vw 18vh;
box-shadow: 40vmin 0 14.8858462229vmin currentColor;
}
.background span:nth-child(15) {
color: #583c87;
top: 11%;
left: 48%;
animation-duration: 13.8s;
animation-delay: -16s;
transform-origin: 6vw -21vh;
box-shadow: 40vmin 0 6.0719067878vmin currentColor;
}
.background span:nth-child(16) {
color: #583c87;
top: 52%;
left: 91%;
animation-duration: 14.6s;
animation-delay: -13s;
transform-origin: 7vw -5vh;
box-shadow: -40vmin 0 14.1634394904vmin currentColor;
}
.background span:nth-child(17) {
color: #e45a84;
top: 74%;
left: 22%;
animation-duration: 10.5s;
animation-delay: -0.3s;
transform-origin: -10vw 0vh;
box-shadow: 40vmin 0 12.4959225049vmin currentColor;
}
.background span:nth-child(18) {
color: #e45a84;
top: 47%;
left: 99%;
animation-duration: 10.9s;
animation-delay: -16s;
transform-origin: 10vw -21vh;
box-shadow: -40vmin 0 14.3520013405vmin currentColor;
}
.background span:nth-child(19) {
color: #583c87;
top: 45%;
left: 42%;
animation-duration: 10.4s;
animation-delay: -7.3s;
transform-origin: -20vw 25vh;
box-shadow: 40vmin 0 5.5225228285vmin currentColor;
}
.background span:nth-child(20) {
color: #583c87;
top: 45%;
left: 3%;
animation-duration: 15.6s;
animation-delay: -1.9s;
transform-origin: -8vw -17vh;
box-shadow: -40vmin 0 6.0440569088vmin currentColor;
}
@keyframes move {
100% {
transform: translate3d(0, 0, 1px) rotate(360deg);
}
}
`),customElements.define("cdtr-glows-preset",t)}}]);