diff options
| -rw-r--r-- | viewer/src/assets/scss/theme.scss | 2 | ||||
| -rw-r--r-- | viewer/src/views/GalleryThumbnail.vue | 8 |
2 files changed, 4 insertions, 6 deletions
diff --git a/viewer/src/assets/scss/theme.scss b/viewer/src/assets/scss/theme.scss index efd5d79..3f2b623 100644 --- a/viewer/src/assets/scss/theme.scss +++ b/viewer/src/assets/scss/theme.scss | |||
| @@ -30,4 +30,4 @@ $content-bgcolor: #1e1e1e; | |||
| 30 | 30 | ||
| 31 | $toolbar-color: #d62929; | 31 | $toolbar-color: #d62929; |
| 32 | 32 | ||
| 33 | $loader-color: #119; | 33 | $loader-color: #272727; |
diff --git a/viewer/src/views/GalleryThumbnail.vue b/viewer/src/views/GalleryThumbnail.vue index 7ceea4f..433a673 100644 --- a/viewer/src/views/GalleryThumbnail.vue +++ b/viewer/src/views/GalleryThumbnail.vue | |||
| @@ -57,16 +57,14 @@ export default class GalleryThumbnail extends Vue { | |||
| 57 | max-height: 250px; | 57 | max-height: 250px; |
| 58 | } | 58 | } |
| 59 | .preload { | 59 | .preload { |
| 60 | background: linear-gradient(to right, rgba(0, 0, 0, 0) 8%, $loader-color 18%, rgba(0, 0, 0, 0) 33%); | 60 | animation: preloadAnimation 1s infinite ease-in-out alternate; |
| 61 | background-size: 200% 50px; | ||
| 62 | animation: preloadAnimation 2s infinite linear; | ||
| 63 | } | 61 | } |
| 64 | @keyframes preloadAnimation { | 62 | @keyframes preloadAnimation { |
| 65 | from { | 63 | from { |
| 66 | background-position: -200px 0; | 64 | background-color: $content-bgcolor; |
| 67 | } | 65 | } |
| 68 | to { | 66 | to { |
| 69 | background-position: 200px 0; | 67 | background-color: $loader-color; |
| 70 | } | 68 | } |
| 71 | } | 69 | } |
| 72 | // Temporary size until we get the true thumbnail size | 70 | // Temporary size until we get the true thumbnail size |