simplifying css
This commit is contained in:
Set Hallstrom
parent
87c6c7183c
commit
7a901d353e
161
_sass/main.scss
161
_sass/main.scss
|
|
@ -2,32 +2,30 @@ html {
|
|||
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{
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: linear-gradient(230deg, #ff00ff7f, #426a007f);
|
||||
background-position: center;
|
||||
background-repeat: repeat;
|
||||
-webkit-animation: AnimationName 60s ease infinite;
|
||||
-moz-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 {
|
||||
color: #0000009f;
|
||||
|
|
@ -50,26 +48,10 @@ a:hover {
|
|||
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-size: 1000% 1000%;
|
||||
background-image: url('/assets/img/world.svg');
|
||||
background-image: url('/assets/img/world.svg');
|
||||
-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%}
|
||||
}
|
||||
|
||||
div {
|
||||
|
||||
|
|
@ -121,9 +103,11 @@ background-image: url('/assets/img/world.svg');
|
|||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
width: 100vw;
|
||||
height: 100%;
|
||||
background: linear-gradient(230deg, #ff00ffe6, #416a00e6);
|
||||
margin:0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@media (min-aspect-ratio: 16/9) {
|
||||
|
|
@ -181,47 +165,14 @@ background-image: url('/assets/img/world.svg');
|
|||
-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%}
|
||||
}
|
||||
|
||||
h1, h2, h3, p {
|
||||
padding: 5px;
|
||||
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;
|
||||
-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%}
|
||||
}
|
||||
padding: 10px;
|
||||
border-radius: 3px;
|
||||
|
||||
|
|
@ -276,25 +227,9 @@ background: linear-gradient(230deg, #ff00ff7f, #426a007f);
|
|||
|
||||
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%}
|
||||
}
|
||||
-webkit-animation: AnimationName 30s ease infinite;
|
||||
-moz-animation: AnimationName 30s ease infinite;
|
||||
animation: AnimationName 30s ease infinite;
|
||||
margin: 0 auto 0 0;
|
||||
|
||||
text-align: center;
|
||||
|
|
@ -309,22 +244,6 @@ button {
|
|||
-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%}
|
||||
}
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 100px;
|
||||
|
|
@ -350,22 +269,6 @@ min-height: 80vh;
|
|||
-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%}
|
||||
}
|
||||
padding: 15px;
|
||||
|
||||
p {
|
||||
|
|
@ -412,3 +315,17 @@ min-height: 80vh;
|
|||
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;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue