diff options
| author | Roger Braun <roger@rogerbraun.net> | 2017-04-09 22:23:14 +0200 |
|---|---|---|
| committer | Roger Braun <roger@rogerbraun.net> | 2017-04-09 22:23:14 +0200 |
| commit | 36655002d062183a577f5b8fd66628d56670ec1f (patch) | |
| tree | cda03a02b10fd8958a69927fee2fb272e5c66fb3 /src/components/attachment/attachment.vue | |
| parent | 112adcf8f83e1bd8dd347ef8ee4de46060b53341 (diff) | |
| parent | 7ee87c7618bfba986ec7a04581273629a1db9983 (diff) | |
Merge branch 'develop' into feature/hash-routed
Diffstat (limited to 'src/components/attachment/attachment.vue')
| -rw-r--r-- | src/components/attachment/attachment.vue | 21 |
1 files changed, 11 insertions, 10 deletions
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue index 8f51b891..1ba1c02a 100644 --- a/src/components/attachment/attachment.vue +++ b/src/components/attachment/attachment.vue @@ -1,5 +1,5 @@ <template> - <div class="attachment" :class="{[type]: true, loading}" :style="autoHeight"> + <div class="attachment base03-border" :class="{[type]: true, loading}" :style="autoHeight"> <a class="image-attachment" v-if="hidden" @click.prevent="toggleHidden()"> <img :key="nsfwImage" :src="nsfwImage"/> </a> @@ -8,7 +8,7 @@ </div> <a v-if="type === 'image' && !hidden" class="image-attachment" :href="attachment.url" target="_blank"> - <img class="base05-border" referrerpolicy="no-referrer" :src="attachment.large_thumb_url || attachment.url"/> + <img class="base03-border" referrerpolicy="no-referrer" :src="attachment.large_thumb_url || attachment.url"/> </a> <video v-if="type === 'video' && !hidden" :src="attachment.url" controls></video> @@ -76,19 +76,18 @@ border-radius: 5px; } - .oembed { + border: 1px solid; + border-radius: 5px; + border-color: inherit; + width: 100%; + margin-right: 15px; + display: flex; + img { width: 100%; } - margin-right: 15px; - } - .oembed { - border: 1px solid; - width: 100%; - - display: flex; .image { flex: 1; img { @@ -117,8 +116,10 @@ border-style: solid; border-width: 1px; border-radius: 5px; + object-fit: contain; width: 100%; height: 100%; /* If this isn't here, chrome will stretch the images */ + max-height: 500px; } } } |