mirror of
https://github.com/Fabio286/antares.git
synced 2025-02-07 23:38:54 +01:00
refactor: Improved pulse animation code
This commit is contained in:
parent
a41cf1ab56
commit
0d77aee3eb
@ -111,17 +111,19 @@ export default {
|
||||
el.querySelector('.ex-tooltip-content').style.top = `${fromTop}px`;
|
||||
},
|
||||
getStatusBadge (uid) {
|
||||
const status = this.getWorkspace(uid).connection_status;
|
||||
if (this.getWorkspace(uid)) {
|
||||
const status = this.getWorkspace(uid).connection_status;
|
||||
|
||||
switch (status) {
|
||||
case 'connected':
|
||||
return 'badge badge-connected';
|
||||
case 'connecting':
|
||||
return 'badge badge-connecting';
|
||||
case 'failed':
|
||||
return 'badge badge-failed';
|
||||
default:
|
||||
return '';
|
||||
switch (status) {
|
||||
case 'connected':
|
||||
return 'badge badge-connected';
|
||||
case 'connecting':
|
||||
return 'badge badge-connecting';
|
||||
case 'failed':
|
||||
return 'badge badge-failed';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -30,6 +30,12 @@
|
||||
animation: jump-down-in 0.2s reverse;
|
||||
}
|
||||
|
||||
.pulse {
|
||||
animation-name: pulse;
|
||||
animation-duration: 2s;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes jump-down-in {
|
||||
0% {
|
||||
transform: scale(0);
|
||||
@ -40,16 +46,16 @@
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes connecting {
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
background-color: transparent;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
50% {
|
||||
background-color: $warning-color;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
100% {
|
||||
background-color: transparent;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
@ -142,7 +142,8 @@ body {
|
||||
}
|
||||
|
||||
&.badge-connecting::after {
|
||||
animation-name: connecting;
|
||||
background: $warning-color;
|
||||
animation-name: pulse;
|
||||
animation-duration: 2s;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user