hq/sakrecoer-mother-web
hq/sakrecoer-mother-web
4
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity

weird anim

Browse source
This commit is contained in:
Set Sakrecoer 2019-07-10 01:22:54 +02:00
parent b1a5523885
commit d2beca0c43
3 changed files with 82 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

41
_sass/main.scss
View file

@ -3,7 +3,27 @@ html {
}
body{
background: url(/assets/img/pattern.png);
background: linear-gradient(230deg, rgba(218, 159, 142, 0.9), rgba(236, 0, 228, 0.9), rgba(0, 212, 236, 0.9), rgba(0, 236, 173, 0.9), rgba(110, 0, 236, 0.9));
background-size: 1000% 1000%;
-webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite;
animation: AnimationName 30s ease infinite;
@-webkit-keyframes AnimationName {
0%{background-position:0% 91%}
50%{background-position:100% 10%}
100%{background-position:0% 91%}
}
@-moz-keyframes AnimationName {
0%{background-position:0% 91%}
50%{background-position:100% 10%}
100%{background-position:0% 91%}
}
@keyframes AnimationName {
0%{background-position:0% 91%}
50%{background-position:100% 10%}
100%{background-position:0% 91%}
}
}
@ -11,12 +31,25 @@ a {
font-weight: normal;
}
#hero {
display: flex;
flex-wrap: wrap;
background-color: transparent;
position: relative;
height: 100vh;
width: 100%;
-webkit-transition: background .5s ease-in-out;
transition: background .5s ease-in-out;
background-image: url({{}});
div {
background: rgba(252, 252, 252, 0.541);
padding: 10px;
border-radius: 3px;
flex: 1 1 300px;
flex-direction: column;
display: flex;
flex-wrap: wrap;
}
}
/* MUSIC INDEX */