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

simplifying css

Browse source
This commit is contained in:
Set Hallstrom 2019-08-29 18:04:27 +02:00
parent 87c6c7183c
commit 7a901d353e
1 changed files with 39 additions and 122 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

161
_sass/main.scss
View file

@ -2,32 +2,30 @@ html {
font-family: "Helvetica", Sans-serif; font-family: "Helvetica", Sans-serif;
} }
@-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%}
}
body{ body{
margin: 0;
padding: 0;
background: linear-gradient(230deg, #ff00ff7f, #426a007f); background: linear-gradient(230deg, #ff00ff7f, #426a007f);
background-position: center; background-position: center;
background-repeat: repeat; background-repeat: repeat;
-webkit-animation: AnimationName 60s ease infinite; -webkit-animation: AnimationName 60s ease infinite;
-moz-animation: AnimationName 60s ease infinite; -moz-animation: AnimationName 60s ease infinite;
animation: AnimationName 60s ease infinite; animation: AnimationName 60s 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%}
}
} }
a { a {
color: #0000009f; color: #0000009f;
@ -50,26 +48,10 @@ a:hover {
width: 100%; width: 100%;
// background: linear-gradient(230deg, rgba(218, 159, 142, 0.8), rgba(236, 0, 228, 0.8), rgba(0, 212, 236, 0.8), rgba(0, 236, 173, 0.8), rgba(110, 0, 236, 0.8)); // background: linear-gradient(230deg, rgba(218, 159, 142, 0.8), rgba(236, 0, 228, 0.8), rgba(0, 212, 236, 0.8), rgba(0, 236, 173, 0.8), rgba(110, 0, 236, 0.8));
// background-size: 1000% 1000%; // background-size: 1000% 1000%;
background-image: url('/assets/img/world.svg'); background-image: url('/assets/img/world.svg');
-webkit-animation: AnimationName 30s ease infinite; -webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite; -moz-animation: AnimationName 30s ease infinite;
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%}
}
div { div {
@ -121,9 +103,11 @@ background-image: url('/assets/img/world.svg');
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100vw;
height: 100%; height: 100%;
background: linear-gradient(230deg, #ff00ffe6, #416a00e6); background: linear-gradient(230deg, #ff00ffe6, #416a00e6);
margin:0;
padding: 0;
} }
@media (min-aspect-ratio: 16/9) { @media (min-aspect-ratio: 16/9) {
@ -181,47 +165,14 @@ background-image: url('/assets/img/world.svg');
-webkit-animation: AnimationName 30s ease infinite; -webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite; -moz-animation: AnimationName 30s ease infinite;
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%}
}
h1, h2, h3, p { h1, h2, h3, p {
padding: 5px; padding: 5px;
background: linear-gradient(230deg, rgba(255, 0, 255, 0.9), rgba(65, 106, 0, 0.9)); background: linear-gradient(230deg, rgba(255, 0, 255, 0.9), rgba(65, 106, 0, 0.9));
background-size: 1000% 1000%; background-size: 1000% 1000%;
-webkit-animation: AnimationName 30s ease infinite; -webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite; -moz-animation: AnimationName 30s ease infinite;
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%}
}
padding: 10px; padding: 10px;
border-radius: 3px; border-radius: 3px;
@ -276,25 +227,9 @@ background: linear-gradient(230deg, #ff00ff7f, #426a007f);
background-size: 1000% 1000%; background-size: 1000% 1000%;
-webkit-animation: AnimationName 30s ease infinite; -webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite; -moz-animation: AnimationName 30s ease infinite;
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%}
}
margin: 0 auto 0 0; margin: 0 auto 0 0;
text-align: center; text-align: center;
@ -309,22 +244,6 @@ button {
-webkit-animation: AnimationName 30s ease infinite; -webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite; -moz-animation: AnimationName 30s ease infinite;
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%}
}
width: 100px; width: 100px;
height: 100px; height: 100px;
border-radius: 100px; border-radius: 100px;
@ -350,22 +269,6 @@ min-height: 80vh;
-webkit-animation: AnimationName 30s ease infinite; -webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite; -moz-animation: AnimationName 30s ease infinite;
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%}
}
padding: 15px; padding: 15px;
p { p {
@ -412,3 +315,17 @@ min-height: 80vh;
max-height: 300px; max-height: 300px;
} }
#privacy {
position: fixed;
bottom:0;
left:0;
z-index:77777;
margin: 0;
padding: 0;
img {
margin: 0;
padding: 0;
position: fixed;
bottom: 0;
}
}