diff options
| author | Shpuld Shpludson <shp@cock.li> | 2020-11-06 17:27:25 +0000 |
|---|---|---|
| committer | Shpuld Shpludson <shp@cock.li> | 2020-11-06 17:27:25 +0000 |
| commit | 23232e1c8f35d7ddc8adb7a6dbf813b2831c90ec (patch) | |
| tree | b0c8c409d3af0901cb47de648ccbea53da89c16d /src/components/still-image | |
| parent | b225c3578f3c89af5ed3a0be3f8f3a6bbcedcc7d (diff) | |
| parent | 60983ae42b584694de0211ca67ef72d492a293c9 (diff) | |
Merge branch 'develop' into 'master'
Merge develop into master for 2.2.0
See merge request pleroma/pleroma-fe!1278
Diffstat (limited to 'src/components/still-image')
| -rw-r--r-- | src/components/still-image/still-image.js | 10 | ||||
| -rw-r--r-- | src/components/still-image/still-image.vue | 11 |
2 files changed, 13 insertions, 8 deletions
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() 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 { |