deblan-mirror/thelounge
deblan-mirror/thelounge
1
0
Fork 0
mirror of https://github.com/thelounge/thelounge.git synced 2024-05-21 07:36:38 +02:00
Code Issues Projects Releases Wiki Activity

Minor fix for previews

Browse source
This commit is contained in:
Pavel Djundik 2018-07-10 17:44:50 +03:00 committed by Pavel Djundik
parent 2ab3518c52
commit 0654a4373f
2 changed files with 25 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
client/components/LinkPreview.vue
View file

@ -1,6 +1,8 @@
<template>
<div class="preview">
<div :class="['toggle-content', 'toggle-type-' + link.type, {show: link.shown}]">
<div
v-if="link.shown && link.canDisplay"
class="preview">
<div :class="['toggle-content', 'toggle-type-' + link.type]">
<template v-if="link.type === 'link'">
<a
v-if="link.thumb"
@ -12,7 +14,8 @@
:src="link.thumb"
decoding="async"
alt=""
class="thumb">
class="thumb"
@load="onPreviewReady">
</a>
<div class="toggle-text">
<div class="head">
@ -53,13 +56,15 @@
<img
:src="link.thumb"
decoding="async"
alt="">
alt=""
@load="onPreviewReady">
</a>
</template>
<template v-else-if="link.type === 'video'">
<video
preload="metadata"
controls>
controls
@canplay="onPreviewReady">
<source
:src="link.media"
:type="link.mediaType">
@ -68,7 +73,8 @@
<template v-else-if="link.type === 'audio'">
<audio
controls
preload="metadata">
preload="metadata"
@canplay="onPreviewReady">
<source
:src="link.media"
:type="link.mediaType">
@ -117,5 +123,16 @@ export default {
props: {
link: Object,
},
mounted() {
if (this.link.shown) {
const options = require("../js/options");
this.$set(this.link, "canDisplay", options.shouldOpenMessagePreview(this.link.type));
}
},
methods: {
onPreviewReady() {
},
},
};
</script>

8
client/css/style.css
View file

@ -1382,12 +1382,13 @@ background on hover (unless active) */
#chat .toggle-content {
background: #f6f6f6;
border-radius: 5px;
display: none;
max-width: 100%;
margin: 0;
margin-top: 6px;
overflow: hidden;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
display: inline-flex !important;
align-items: flex-start;
}
/* This applies to images of preview-type-image and thumbnails of preview-type-link */
@ -1478,11 +1479,6 @@ background on hover (unless active) */
content: "\f0da"; /* https://fontawesome.com/icons/caret-right?style=solid */
}
#chat .toggle-content.show {
display: inline-flex !important;
align-items: flex-start;
}
#chat audio {
width: 600px;
max-width: 100%;