Throbber class
This commit is contained in:
parent
39dba30d14
commit
6970c62276
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div :class="{ connected, idle }" />
|
||||
<div class="throbber" :class="{ connected, idle }" />
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
div {
|
||||
div.throbber {
|
||||
position: fixed;
|
||||
top: 59px;
|
||||
right: 0;
|
||||
@ -12,7 +12,7 @@
|
||||
z-index: 1030;
|
||||
background-color: #dc3545;
|
||||
}
|
||||
div.connected {
|
||||
div.throbber.connected {
|
||||
background-color: #0d6efd;
|
||||
background-image: repeating-linear-gradient(
|
||||
-45deg,
|
||||
@ -25,7 +25,7 @@
|
||||
animation: barberpole 60s linear infinite;
|
||||
animation-direction: reverse;
|
||||
}
|
||||
div.idle {
|
||||
div.throbber.idle {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transition: visibility 0s 0.5s, opacity 0.5s linear;
|
||||
|
Loading…
Reference in New Issue
Block a user