diff options
author | =Corey Hulen <corey@hulen.com> | 2015-07-05 09:02:23 -0800 |
---|---|---|
committer | =Corey Hulen <corey@hulen.com> | 2015-07-05 09:02:23 -0800 |
commit | 592d68cf4134b668e3ff962d17f8aa75b1bc055f (patch) | |
tree | 6e743b07487caf5fe350439aefdf0355a7e80d9b /web/sass-files/sass/partials/_loading.scss | |
parent | 72bfc1ee2afd2fa4a34186b62f144f8f6c50d693 (diff) | |
parent | 4a3003c0dcf7d642f233493e32b07beed5d08327 (diff) | |
download | chat-592d68cf4134b668e3ff962d17f8aa75b1bc055f.tar.gz chat-592d68cf4134b668e3ff962d17f8aa75b1bc055f.tar.bz2 chat-592d68cf4134b668e3ff962d17f8aa75b1bc055f.zip |
Merge branch 'master' into mm-1391
Diffstat (limited to 'web/sass-files/sass/partials/_loading.scss')
-rw-r--r-- | web/sass-files/sass/partials/_loading.scss | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/web/sass-files/sass/partials/_loading.scss b/web/sass-files/sass/partials/_loading.scss new file mode 100644 index 000000000..185a42180 --- /dev/null +++ b/web/sass-files/sass/partials/_loading.scss @@ -0,0 +1,68 @@ +.loading-screen { + display: table; + width: 100%; + height: 100%; + position: absolute; + @include box-sizing(border-box); + text-align: center; + .loading__content { + display: table-cell; + vertical-align: middle; + h3 { + font-weight: 400; + margin: 0 0.2em 0; + display: inline-block; + } + } +} + +.loading-screen { + .loading__content { + .round { + background-color: #444; + width: 4px; + height: 4px; + display: inline-block; + margin: 0 1px; + opacity: 0.1; + @include border-radius(10px); + -moz-animation: move 0.75s infinite linear; + -webkit-animation: move 0.75s infinite linear; + } + + #round_1 { + -moz-animation-delay: .2s; + -webkit-animation-delay: .2s; + } + + #round_2 { + -moz-animation-delay: .4s; + -webkit-animation-delay: .4s; + } + + #round_3 { + -moz-animation-delay: .6s; + -webkit-animation-delay: .6s; + } + + @-moz-keyframes move { + 0% { + opacity: 1; + } + + 100% { + opacity: 0.1; + }; + } + + @-webkit-keyframes move { + 0% { + opacity: 1; + } + + 100% { + opacity: 0.1; + }; + } + } +} |