Added logos to tag photos.

This commit is contained in:
DebaucheryLibrarian
2021-03-07 04:05:25 +01:00
parent 7522404abb
commit 3389dddd08
14 changed files with 516 additions and 367 deletions

View File

@@ -32,6 +32,8 @@
class="item image"
>
<Logo :photo="item" />
<span
v-if="comments && item.title"
class="item-comment"
@@ -44,6 +46,8 @@
</template>
<script>
import Logo from './logo.vue';
function albumItems() {
return this.items
.filter(Boolean)
@@ -54,6 +58,9 @@ function albumItems() {
}
export default {
components: {
Logo,
},
props: {
items: {
type: Array,
@@ -156,8 +163,14 @@ export default {
margin: 0 0 .5rem 0;
overflow: hidden;
&:hover .item-comment {
transform: translateY(0);
&:hover {
.item-comment {
transform: translateY(0);
}
.album-logo {
opacity: 0;
}
}
}

View File

@@ -0,0 +1,58 @@
<template>
<router-link
v-if="photo.entity"
:to="`/${photo.entity.type}/${photo.entity.slug}`"
>
<img
v-if="favicon && photo.entity.type !== 'network' && !photo.entity.independent && photo.entity.parent"
:src="`/img/logos/${photo.entity.parent.slug}/favicon.png`"
class="album-logo"
>
<img
v-else-if="favicon"
:src="`/img/logos/${photo.entity.slug}/favicon.png`"
class="album-logo"
>
<img
v-else-if="photo.entity.type !== 'network' && !photo.entity.independent && photo.entity.parent"
:src="`/img/logos/${photo.entity.parent.slug}/${photo.entity.slug}.png`"
class="album-logo"
>
<img
v-else
:src="`/img/logos/${photo.entity.slug}/network.png`"
class="album-logo"
>
</router-link>
</template>
<script>
module.exports = {
props: {
photo: {
type: Object,
default: null,
},
favicon: {
type: Boolean,
default: false,
},
},
};
</script>
<style lang="scss" scoped>
.album-logo {
max-height: .75rem;
max-width: 5rem;
position: absolute;
right: 0;
bottom: 0;
padding: .5rem;
transition: transform .25s ease, opacity .25s ease;
filter: drop-shadow(0 0 2px var(--shadow-weak));
}
</style>