mirror of
https://github.com/jech/galene.git
synced 2024-11-09 18:25:58 +01:00
Add media failed animation
This commit is contained in:
parent
170f510adc
commit
ec00502248
2 changed files with 27 additions and 0 deletions
|
@ -889,6 +889,7 @@ h1 {
|
|||
|
||||
.media-failed {
|
||||
opacity: 0.7;
|
||||
background: no-repeat center/50% 50% url("/media-failed.svg");
|
||||
}
|
||||
|
||||
.mirror {
|
||||
|
|
26
static/media-failed.svg
Normal file
26
static/media-failed.svg
Normal file
|
@ -0,0 +1,26 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg version="1.1" viewBox="0 0 64 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<g fill="#ececec">
|
||||
<circle cx="8" cy="8" r="8"/>
|
||||
<circle cx="32" cy="8" r="8"/>
|
||||
<circle cx="56" cy="8" r="8"/>
|
||||
</g>
|
||||
<style>
|
||||
circle {
|
||||
animation: circleScale 1.5s infinite ease-in-out;
|
||||
transform-origin: 8px 8px;
|
||||
}
|
||||
circle:nth-child(2) {
|
||||
animation-delay: -1s;
|
||||
transform-origin: 32px 8px;
|
||||
}
|
||||
circle:nth-child(3) {
|
||||
animation-delay: -0.5s;
|
||||
transform-origin: 56px 8px;
|
||||
}
|
||||
@keyframes circleScale {
|
||||
0%, 80%, 100% { transform: scale(0.8); }
|
||||
40% { transform: scale(1.0); }
|
||||
}
|
||||
</style>
|
||||
</svg>
|
After Width: | Height: | Size: 711 B |
Loading…
Reference in a new issue