arti
/
22
1
0
Fork 0
Code Pull Requests Releases Activity

IT DOESNT WORK!

This commit is contained in:
Arti Zirk 2017-07-20 21:15:03 +03:00
commit 707dbd1787
3 changed files with 102 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
index.html Normal file
View 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
View 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
View 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;
}
}