From f174f289a93e6bef1182a2face00bb809da49d18 Mon Sep 17 00:00:00 2001
From: Shpuld Shpludson <shp@cock.li>
Date: Tue, 29 Sep 2020 10:18:37 +0000
Subject: Timeline virtual scrolling

---
 src/components/still-image/still-image.js | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

(limited to 'src/components/still-image')

diff --git a/src/components/still-image/still-image.js b/src/components/still-image/still-image.js
index ab40bbd7..8044e994 100644
--- a/src/components/still-image/still-image.js
+++ b/src/components/still-image/still-image.js
@@ -19,14 +19,16 @@ const StillImage = {
   },
   methods: {
     onLoad () {
-      this.imageLoadHandler && this.imageLoadHandler(this.$refs.src)
+      const image = this.$refs.src
+      if (!image) return
+      this.imageLoadHandler && this.imageLoadHandler(image)
       const canvas = this.$refs.canvas
       if (!canvas) return
-      const width = this.$refs.src.naturalWidth
-      const height = this.$refs.src.naturalHeight
+      const width = image.naturalWidth
+      const height = image.naturalHeight
       canvas.width = width
       canvas.height = height
-      canvas.getContext('2d').drawImage(this.$refs.src, 0, 0, width, height)
+      canvas.getContext('2d').drawImage(image, 0, 0, width, height)
     },
     onError () {
       this.imageLoadError && this.imageLoadError()
-- 
cgit v1.2.3-70-g09d2


From 0653f189946ddbd65a2455e6929927c3d721ec82 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 29 Oct 2020 21:39:36 +0200
Subject: fix play-on-hover gifs issues

---
 src/components/status/status.scss          |  5 +++--
 src/components/still-image/still-image.vue | 11 +++++++----
 src/components/user_avatar/user_avatar.vue |  2 +-
 src/components/user_card/user_card.vue     | 10 +++++-----
 4 files changed, 16 insertions(+), 12 deletions(-)

(limited to 'src/components/still-image')

diff --git a/src/components/status/status.scss b/src/components/status/status.scss
index ea9e538d..0a395086 100644
--- a/src/components/status/status.scss
+++ b/src/components/status/status.scss
@@ -7,8 +7,9 @@ $status-margin: 0.75em;
   min-width: 0;
 
   &:hover {
-    --still-image-img: visible;
-    --still-image-canvas: hidden;
+    --_still-image-img-visibility: visible;
+    --_still-image-canvas-visibility: hidden;
+    --_still-image-label-visibility: hidden;
   }
 
   &.-focused {
diff --git a/src/components/still-image/still-image.vue b/src/components/still-image/still-image.vue
index ad82210d..d3eb5925 100644
--- a/src/components/still-image/still-image.vue
+++ b/src/components/still-image/still-image.vue
@@ -42,7 +42,7 @@
     width: 100%;
     height: 100%;
     object-fit: contain;
-    visibility: var(--still-image-canvas, visible);
+    visibility: var(--_still-image-canvas-visibility, visible);
   }
 
   img {
@@ -66,16 +66,19 @@
       border-radius: $fallback--tooltipRadius;
       border-radius: var(--tooltipRadius, $fallback--tooltipRadius);
       z-index: 2;
-      visibility: var(--still-image-label-visibility, visible);
+      visibility: var(--_still-image-label-visibility, visible);
     }
 
     &:hover canvas {
       display: none;
     }
 
-    &:hover::before,
+    &:hover::before {
+      visibility: var(--_still-image-label-visibility, hidden);
+    }
+
     img {
-      visibility: var(--still-image-img, hidden);
+      visibility: var(--_still-image-img-visibility, hidden);
     }
 
     &:hover img {
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index 43947282..0f7c584b 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -23,7 +23,7 @@
   --_avatarShadowBox: var(--avatarStatusShadow);
   --_avatarShadowFilter: var(--avatarStatusShadowFilter);
   --_avatarShadowInset: var(--avatarStatusShadowInset);
-  --still-image-label-visibility: hidden;
+  --_still-image-label-visibility: hidden;
 
   width: 48px;
   height: 48px;
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 52a54fa7..f916af9d 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -282,6 +282,11 @@
 .user-card {
   position: relative;
 
+  &:hover .Avatar {
+    --_still-image-img-visibility: visible;
+    --_still-image-canvas-visibility: hidden;
+  }
+
   .panel-heading {
     padding: .5em 0;
     text-align: center;
@@ -393,11 +398,6 @@
     }
   }
 
-  &:hover .Avatar {
-    --still-image-img: visible;
-    --still-image-canvas: hidden;
-  }
-
   &-avatar-link {
     position: relative;
     cursor: pointer;
-- 
cgit v1.2.3-70-g09d2