CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: integrate animation loader (#67)

Browse Source 
Integrate animation loader to be shown while application is
bootstrapped.

Fixes #58
This commit is contained in:
Abhay Chawla
2018-06-26 18:06:50 +05:30
committed by GitHub
parent 32b94503dd
commit 3d6a4bbc2d
4 changed files with 424 additions and 421 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/styles/_helper.scss
+401 -401
View File
File diff suppressed because it is too large Load Diff
src/assets/styles/_loader.scss
+16 -18
View File
@@ -1,43 +1,41 @@
.wrapper {
margin: 50px auto;
height: 250px;
width: 240px;
position: relative;
.loader-wrapper {
height: 100vh;
width: 100vw;
.triangle {
width: 0;
height: 0;
border-style: solid;
position: absolute;
animation: rotate 0.7s infinite 1s;
animation: rotate 0.8s infinite 0.2s;
}
.bottom {
border-width: 0 100px 100px 100px;
border-width: 0 90px 90px 90px;
border-color: transparent transparent #1fb050 transparent;
bottom: 10px;
left: calc(50% - 100px);
bottom: calc(50% - 100px);
left: calc(50% - 90px);
}
.top {
border-width: 100px 100px 0 100px;
border-width: 90px 90px 0 90px;
border-color: #b4d575 transparent transparent transparent;
top: 10px;
left: calc(50% - 100px);
top: calc(50% - 100px);
left: calc(50% - 90px);
}
.left {
border-width: 100px 0 100px 100px;
border-width: 90px 0 90px 90px;
border-color: transparent transparent transparent #1074b9;
top: calc(50% - 100px);
left: 10px;
top: calc(50% - 90px);
left: calc(50% - 100px);
}
.right {
border-width: 100px 100px 100px 0;
border-width: 90px 90px 90px 0;
border-color: transparent #1daeec transparent transparent;
top: calc(50% - 100px);
right: 10px;
top: calc(50% - 90px);
right: calc(50% - 100px);
}
@keyframes rotate {