Sinewave animation for pending requests

Tryin it on for size.

// FREEBIE
This commit is contained in:
lilia
2015-10-28 13:57:32 -07:00
parent 1065502770
commit c77391b3f2
5 changed files with 45 additions and 0 deletions
+17
View File
@@ -189,6 +189,15 @@
margin-right: 3px;
}
.sinewave {
background: url('/images/sinewave.png') repeat-x;
animation: backgroundScroll 0.5s linear infinite;
}
@keyframes backgroundScroll {
from {background-position: 0 0;}
to {background-position: -18px 0;}
}
.entry.sent .checkmark {
display: inline-block;
width: 18px;
@@ -204,6 +213,14 @@
height: 1em;
}
}
.entry.pending {
.sinewave {
display: inline-block;
width: 18px;
height: 1em;
}
.double-checkmark, .checkmark { display: none; }
}
.message-list {
margin: 0;
+16
View File
@@ -673,6 +673,15 @@ input.search {
font-size: smaller;
margin-right: 3px; }
.sinewave {
background: url("/images/sinewave.png") repeat-x;
animation: backgroundScroll 0.5s linear infinite; }
@keyframes backgroundScroll {
from {
background-position: 0 0; }
to {
background-position: -18px 0; } }
.entry.sent .checkmark {
display: inline-block;
width: 18px;
@@ -687,6 +696,13 @@ input.search {
width: 18px;
height: 1em; }
.entry.pending .sinewave {
display: inline-block;
width: 18px;
height: 1em; }
.entry.pending .double-checkmark, .entry.pending .checkmark {
display: none; }
.message-list {
margin: 0;
padding: 1em 0;