mirror of https://github.com/4xmen/xshop.git
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
1.0 KiB
SCSS
51 lines
1.0 KiB
SCSS
5 months ago
|
.WaveFooter {
|
||
|
|
margin-top: 3rem;
|
||
|
|
min-height: 300px;
|
||
|
|
position: relative;
|
||
|
|
.waves {
|
||
|
|
>use {
|
||
|
|
fill: var(--xshop-primary);
|
||
|
|
animation: move-forever var(--speed) -2s linear infinite;
|
||
|
|
&:nth-child(2) {
|
||
|
|
animation-delay: -3s;
|
||
|
|
animation-duration: var(--speed2);
|
||
|
|
}
|
||
|
|
&:nth-child(3) {
|
||
|
|
animation-delay: -4s;
|
||
|
|
animation-duration: var(--speed3);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
svg {
|
||
|
|
position: absolute;
|
||
|
|
left: 0;
|
||
|
|
bottom: 5rem;
|
||
|
|
width: 100%;
|
||
|
|
height: 30vw;
|
||
|
|
max-height: 200px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content{
|
||
|
|
padding: 1rem;
|
||
|
|
background: var(--xshop-primary);
|
||
|
|
opacity: .96;
|
||
|
|
color: var(--xshop-diff);
|
||
|
|
height: 5rem;
|
||
|
|
position: absolute;
|
||
|
|
bottom: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes move-forever {
|
||
|
|
0% {
|
||
|
|
transform: translate(-90px, 0%);
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
transform: translate(85px, 0%);
|
||
|
|
}
|
||
|
|
}
|