Dockery/Pinry
1
0
Fork 0
mirror of https://github.com/pinry/pinry.git synced 2025-11-17 10:20:39 +01:00
Code Issues Packages Projects Releases Activity

Feature: Add meta-info for pin-preview

Browse Source
This commit is contained in:
winkidney
2019-11-27 22:59:02 +08:00
committed by Isaac Bythewood
parent 64660f7a65
commit 84cdd68a60
2 changed files with 44 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
pinry-spa/src/components/PinPreview.vue
View File

@@ -9,7 +9,7 @@
</div> </div>
<div class="card-content"> <div class="card-content">
<div class="content"> <div class="content">
<p class="description subtitle">{{ pinItem.description }}</p> <p class="description title">{{ pinItem.description }}</p>
</div> </div>
<div class="media"> <div class="media">
<div class="media-left"> <div class="media-left">
@@ -18,13 +18,35 @@
</figure> </figure>
</div> </div>
<div class="media-content"> <div class="media-content">
<p class="title is-4">{{ pinItem.author }}</p> <div class="is-pulled-left">
<p class="subtitle is-6"> <p class="title is-4 pin-meta-info"><span class="dim">pined by </span><span class="author">{{ pinItem.author }}</span></p>
<span class="subtitle-font">in</span> <p class="subtitle is-6" v-show="pinItem.tags.length > 0">
<template v-for="tag in pinItem.tags"> <span class="subtitle dim">in&nbsp;</span>
<b-tag v-bind:key="tag" type="is-info" class="pin-preview-tag">{{ tag }}</b-tag> <template v-for="tag in pinItem.tags">
</template> <b-tag v-bind:key="tag" type="is-info" class="pin-preview-tag">{{ tag }}</b-tag>
</p> </template>
</p>
</div>
<div class="is-pulled-right">
<b-button tag="router-link"
to="/"
class="meta-link"
type="is-warning">
Referer
</b-button>
<b-button tag="router-link"
to="/"
class="meta-link"
type="is-link">
Original URL
</b-button>
<b-button tag="router-link"
to="/"
class="meta-link"
type="is-success">
Pin URL
</b-button>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -43,12 +65,24 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
@import './utils/fonts.scss'; @import './utils/fonts.scss';
.meta-link {
margin-left: 0.3rem;
}
.dim {
@include secondary-font-color-in-dark;
}
.pin-meta-info {
line-height: 16px;
}
.card { .card {
background-color: #0C110D; background-color: rgba(0, 0, 0, 0.6);
.content { .content {
border-bottom: 1px solid #333; border-bottom: 1px solid #333;
} }
.card-content { .card-content {
.author {
@include title-font-color-in-dark;
}
padding: 0; padding: 0;
.content { .content {
padding: 0.3rem; padding: 0.3rem;

2
pinry-spa/src/components/Pins.vue
View File

@@ -62,7 +62,7 @@ function createImageItem(pin) {
image.tags = pin.tags; image.tags = pin.tags;
image.author = pin.submitter.username; image.author = pin.submitter.username;
image.avatar = `//gravatar.com/avatar/${pin.submitter.gravatar}`; image.avatar = `//gravatar.com/avatar/${pin.submitter.gravatar}`;
image.original_url = pin.image.image; image.original_url = pinHandler.escapeUrl(pin.image.image);
image.orgianl_width = pin.image.width; image.orgianl_width = pin.image.width;
return image; return image;
} }