forked from mirror/pixelfed
Merge pull request #1000 from pixelfed/frontend-ui-refactor
Frontend ui refactor
This commit is contained in:
commit
9a6c6941d5
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -3,10 +3,10 @@
|
|||
"/js/app.js": "/js/app.js?id=a51da95c2b9df7cf8de2",
|
||||
"/css/app.css": "/css/app.css?id=a3d1a9d5833199d019d4",
|
||||
"/css/appdark.css": "/css/appdark.css?id=241076c8fb3c47e088d2",
|
||||
"/js/components.js": "/js/components.js?id=2cc86bfe798c5a7af92b",
|
||||
"/js/components.js": "/js/components.js?id=39d45813739697ddad5c",
|
||||
"/js/discover.js": "/js/discover.js?id=75fb12b06ee23fa05186",
|
||||
"/js/micro.js": "/js/micro.js?id=178479fb6990f8806257",
|
||||
"/js/profile.js": "/js/profile.js?id=9b4b7d662fb70fb48856",
|
||||
"/js/status.js": "/js/status.js?id=fd76f38cedc711b9c634",
|
||||
"/js/timeline.js": "/js/timeline.js?id=3d3a0103fc53c6b03769"
|
||||
"/js/status.js": "/js/status.js?id=0013d7a91c8d0080f3ca",
|
||||
"/js/timeline.js": "/js/timeline.js?id=84ae2d0b7f36936d8f68"
|
||||
}
|
||||
|
|
|
@ -63,7 +63,7 @@
|
|||
</div>
|
||||
|
||||
<div v-else-if="status.pf_type === 'photo:album'" class="w-100">
|
||||
<photo-album-presenter :status="status"></photo-album-presenter>
|
||||
<photo-album-presenter :status="status" v-on:lightbox="lightbox"></photo-album-presenter>
|
||||
</div>
|
||||
|
||||
<div v-else-if="status.pf_type === 'video:album'" class="w-100">
|
||||
|
@ -71,7 +71,7 @@
|
|||
</div>
|
||||
|
||||
<div v-else-if="status.pf_type === 'photo:video:album'" class="w-100">
|
||||
<mixed-album-presenter :status="status"></mixed-album-presenter>
|
||||
<mixed-album-presenter :status="status" v-on:lightbox="lightbox"></mixed-album-presenter>
|
||||
</div>
|
||||
|
||||
<div v-else class="w-100">
|
||||
|
|
|
@ -66,7 +66,7 @@
|
|||
</div>
|
||||
|
||||
<div v-else-if="status.pf_type === 'photo:album'" class="w-100">
|
||||
<photo-album-presenter :status="status"></photo-album-presenter>
|
||||
<photo-album-presenter :status="status" v-on:lightbox="lightbox"></photo-album-presenter>
|
||||
</div>
|
||||
|
||||
<div v-else-if="status.pf_type === 'video:album'" class="w-100">
|
||||
|
@ -74,7 +74,7 @@
|
|||
</div>
|
||||
|
||||
<div v-else-if="status.pf_type === 'photo:video:album'" class="w-100">
|
||||
<mixed-album-presenter :status="status"></mixed-album-presenter>
|
||||
<mixed-album-presenter :status="status" v-on:lightbox="lightbox"></mixed-album-presenter>
|
||||
</div>
|
||||
|
||||
<div v-else class="w-100">
|
||||
|
|
|
@ -18,7 +18,7 @@
|
|||
<source :src="media.url" :type="media.mime">
|
||||
</video>
|
||||
|
||||
<div v-else-if="media.type == 'Image'" slot="img" :class="media.filter_class">
|
||||
<div v-else-if="media.type == 'Image'" slot="img" :class="media.filter_class" v-on:click="$emit('lightbox', media)">
|
||||
<img class="d-block img-fluid w-100" :src="media.url" :alt="media.description" :title="media.description">
|
||||
</div>
|
||||
|
||||
|
@ -42,7 +42,7 @@
|
|||
<source :src="media.url" :type="media.mime">
|
||||
</video>
|
||||
|
||||
<div v-else-if="media.type == 'Image'" slot="img" :class="media.filter_class">
|
||||
<div v-else-if="media.type == 'Image'" slot="img" :class="media.filter_class" v-on:click="$emit('lightbox', media)">
|
||||
<img class="d-block img-fluid w-100" :src="media.url" :alt="media.description" :title="media.description">
|
||||
</div>
|
||||
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
:interval="0"
|
||||
>
|
||||
<b-carousel-slide v-for="(img, index) in status.media_attachments" :key="img.id">
|
||||
<div slot="img" :class="img.filter_class + ' d-block mx-auto text-center'" style="max-height: 600px;">
|
||||
<div slot="img" :class="img.filter_class + ' d-block mx-auto text-center'" style="max-height: 600px;" v-on:click="$emit('lightbox', img)">
|
||||
<img class="img-fluid" style="max-height: 600px;" :src="img.url" :alt="img.description" :title="img.description">
|
||||
</div>
|
||||
</b-carousel-slide>
|
||||
|
@ -32,7 +32,7 @@
|
|||
:interval="0"
|
||||
>
|
||||
<b-carousel-slide v-for="(img, index) in status.media_attachments" :key="img.id">
|
||||
<div slot="img" :class="img.filter_class + ' d-block mx-auto text-center'" style="max-height: 600px;">
|
||||
<div slot="img" :class="img.filter_class + ' d-block mx-auto text-center'" style="max-height: 600px;" v-on:click="$emit('lightbox', img)">
|
||||
<img class="img-fluid" style="max-height: 600px;" :src="img.url" :alt="img.description" :title="img.description">
|
||||
</div>
|
||||
</b-carousel-slide>
|
||||
|
|
|
@ -5,13 +5,13 @@
|
|||
<p class="mb-0 lead font-weight-bold">{{ status.spoiler_text ? status.spoiler_text : 'CW / NSFW / Hidden Media'}}</p>
|
||||
<p class="font-weight-light">(click to show)</p>
|
||||
</summary>
|
||||
<a class="max-hide-overflow" :href="status.url" :class="status.media_attachments[0].filter_class">
|
||||
<div class="max-hide-overflow" v-on:click="$emit('lightbox', status.media_attachments[0])" :class="status.media_attachments[0].filter_class">
|
||||
<img class="card-img-top" :src="status.media_attachments[0].url" :alt="status.media_attachments[0].description" :title="status.media_attachments[0].description">
|
||||
</a>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div :class="status.media_attachments[0].filter_class" v-on:click="showLightbox(status.media_attachments[0])">
|
||||
<div :class="status.media_attachments[0].filter_class" v-on:click="$emit('lightbox', status.media_attachments[0])">
|
||||
<img class="card-img-top" :src="status.media_attachments[0].url" :alt="status.media_attachments[0].description" :title="status.media_attachments[0].description">
|
||||
</div>
|
||||
</div>
|
||||
|
@ -19,12 +19,6 @@
|
|||
|
||||
<script type="text/javascript">
|
||||
export default {
|
||||
props: ['status'],
|
||||
|
||||
methods: {
|
||||
showLightbox(src) {
|
||||
this.$emit('lightbox', src);
|
||||
}
|
||||
}
|
||||
props: ['status']
|
||||
}
|
||||
</script>
|
Loading…
Reference in New Issue