snowykami/meilisearch
1
0
Fork 0
mirror of https://github.com/meilisearch/meilisearch.git synced 2024-11-27 04:25:06 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

Add a fade in out animation when the server process

Browse Source
This commit is contained in:
Kerollmops 2020-07-12 11:34:48 +02:00
parent 92c2b1dd2d
commit 54afec58a3
No known key found for this signature in database
GPG Key ID: 92ADA4E935E71FA4
2 changed files with 12 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/script.js
View File

@ -16,6 +16,7 @@ $('#search').on('input', function () {
let numberOfDocuments = httpResults.data.length;
count.innerHTML = `${numberOfDocuments}`;
time.innerHTML = `${timeSpent}ms`;
time.classList.remove('fade-in-out');
for (element of httpResults.data) {
const elem = document.createElement('li');
@ -49,6 +50,7 @@ $('#search').on('input', function () {
beforeSend: function () {
if (request !== null) {
request.abort();
time.classList.add('fade-in-out');
}
},
});

10
public/style.css
View File

@ -68,3 +68,13 @@ em {
padding-left: 10px;
color: rgba(0,0,0,.9);
}
@keyframes fadeInOut {
0% { opacity: 1; }
30% { opacity: 0.3; }
100% { opacity: 1; }
}
.fade-in-out {
animation: fadeInOut ease 1s infinite;
}