HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

feat: show alt button even when content hidden

Browse source
This commit is contained in:
freeplay 2023-07-03 00:02:36 -04:00
parent ac51ce0051
commit b37ba33c12
1 changed files with 60 additions and 55 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
packages/client/src/components/MkMedia.vue
View file

@ -1,5 +1,6 @@
<template> <template>
<button v-if="hide" class="qjewsnkg" @click="hide = false"> <div class="media" :class="{ mini: plyrMini }">
<button v-if="hide" class="hidden" @click="hide = false">
<ImgWithBlurhash <ImgWithBlurhash
:hash="media.blurhash" :hash="media.blurhash"
:title="media.comment" :title="media.comment"
@ -15,7 +16,7 @@
</div> </div>
</div> </div>
</button> </button>
<div v-else class="gqnyydlz media" :class="{ mini: plyrMini }"> <template v-else>
<a <a
v-if="media.type.startsWith('image')" v-if="media.type.startsWith('image')"
:href="media.url" :href="media.url"
@ -57,6 +58,7 @@
<source :src="media.url" :type="media.type" /> <source :src="media.url" :type="media.type" />
</video> </video>
</VuePlyr> </VuePlyr>
</template>
<div class="buttons"> <div class="buttons">
<button <button
v-if="media.comment" v-if="media.comment"
@ -67,9 +69,10 @@
<i class="ph-subtitles ph-bold ph-lg"></i> <i class="ph-subtitles ph-bold ph-lg"></i>
</button> </button>
<button <button
v-if="!hide"
v-tooltip="i18n.ts.hide" v-tooltip="i18n.ts.hide"
class="_button" class="_button"
@click="hide = true" @click.stop="hide = true"
> >
<i class="ph-eye-slash ph-bold ph-lg"></i> <i class="ph-eye-slash ph-bold ph-lg"></i>
</button> </button>
@ -141,9 +144,11 @@ onMounted(() => {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.qjewsnkg { .hidden {
all: unset; all: unset;
position: relative; position: relative;
width: 100%;
height: 100%;
> .text { > .text {
position: relative; position: relative;