IT DOESNT WORK!
This commit is contained in:
commit
707dbd1787
10
index.html
Normal file
10
index.html
Normal file
@ -0,0 +1,10 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="UTF-8">
|
||||
<meta name=viewport content="width=device-width, initial-scale=1">
|
||||
<meta http-equiv="Refresh" content="0; url=invite">
|
||||
|
||||
<h1>Loading</h1>
|
||||
|
||||
</html>
|
||||
|
19
invite/index.html
Normal file
19
invite/index.html
Normal file
@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="UTF-8">
|
||||
<meta name=viewport content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="style.css">
|
||||
<div class="container">
|
||||
<div class="slide">
|
||||
<h1>Loading</h1>
|
||||
</div>
|
||||
|
||||
<div class="slide">
|
||||
<h1>1</h1>
|
||||
</div>
|
||||
|
||||
<div class="slide">
|
||||
<h1>2</h1>
|
||||
</div>
|
||||
</div>
|
||||
</html>
|
73
invite/style.scss
Normal file
73
invite/style.scss
Normal file
@ -0,0 +1,73 @@
|
||||
$foreground: #FFFFFF;
|
||||
$background: #000000;
|
||||
$animation-delay: 2s;
|
||||
$animation-length: 10s;
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: $background;
|
||||
color: $foreground;
|
||||
font-family: Sans-Serif;
|
||||
margin:0;
|
||||
padding:0;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.container {
|
||||
height:100vh;
|
||||
width: 100vw;
|
||||
:nth-child(1) {
|
||||
animation-delay: 0s;
|
||||
animation-duration: 1s;
|
||||
animation-name: slide-in;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
:nth-child(2) {
|
||||
animation-delay: 1s;
|
||||
animation-duration: 1s;
|
||||
animation-name: slide-in;
|
||||
animation-fill-mode: both;
|
||||
display:none;
|
||||
}
|
||||
:nth-child(3) {
|
||||
animation-delay: 2s;
|
||||
animation-duration: 1s;
|
||||
animation-name: slide-in;
|
||||
animation-fill-mode: both;
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
||||
.slide {
|
||||
position: absolute;
|
||||
height:100vh;
|
||||
width: 100vw;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.scale-in-center {
|
||||
}
|
||||
|
||||
@keyframes side-in {
|
||||
0% {
|
||||
transform: translate(0, -50vh);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
50% {
|
||||
transform: translate(0, 0);
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
transform: translate(0, 10vh);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user