diff --git a/resources/scss/_main.scss b/resources/scss/_main.scss index f112fa7..01ec9e7 100644 --- a/resources/scss/_main.scss +++ b/resources/scss/_main.scss @@ -1,3 +1,11 @@ +@keyframes sk-bounce { + 0%, 100% { + transform: scale(0.0); + } 50% { + transform: scale(1.0); + } +} + section.tabs { margin-bottom: 1rem; @@ -134,12 +142,48 @@ section.tabs { } } } +section.loader { + position: fixed; + z-index: 1; + bottom: 25%; + left: 50%; + transform: translate(-50%, -50%); + pointer-events: none; + + .spinner { + width: 50px; + height: 50px; + + position: relative; + margin: 100px auto; + + .double-bounce1, + .double-bounce2 { + width: 100%; + height: 100%; + border-radius: 50%; + background-color: #999; + opacity: 0.6; + position: absolute; + top: 0; + left: 0; + animation: sk-bounce 2.0s infinite ease-in-out; + } + + .double-bounce2 { + animation-delay: -1.0s; } } } main { flex: 1 1 auto; + opacity: 0; + transition: opacity 0.25s ease-in-out; + + &.active { + opacity: 1; + } .commands { margin-bottom: 1rem;