Commit 860fff40 authored by Yashu Mittal's avatar Yashu Mittal 👍🏻

Prettify the file

parent 58c32657
<template>
<article :class=articleClass>
<a v-if="cardData.fields.image" class="post-card-image-link" :href="cardData.path">
<div class="post-card-image" :style="'background-image: url(' + cardData.fields.image.src + ')'"></div>
<article :class="articleClass">
<a v-if="cardData.image" class="post-card-image-link" :href="cardData.path">
<!-- FIXME Background size cover -->
<div class="post-card-image" :style="'background-image: url(' + cardData.image + ')'"></div>
</a>
<div class="post-card-content">
<a class="post-card-content-link" :href="cardData.path">
<header class="post-card-header">
<span v-if="cardData.tags" class="post-card-tags">
{{ cardData.tags.replace('-', ' ') }}
</span>
<h2 class="post-card-title">
{{ cardData.title }}
</h2>
<span
v-if="cardData.tags"
class="post-card-tags"
>{{ cardData.tags.title.replace('-', ' ') }}</span>
<h2 class="post-card-title">{{ cardData.title }}</h2>
</header>
<section class="post-card-excerpt">
<p>{{ cardData.content | stripHTML() | truncate(190, '...') }}</p>
......@@ -30,58 +30,42 @@
</li>
</ul>
<span class="reading-time">
{{ cardData.timeToRead }} MIN READ
</span>
<span class="reading-time">{{ cardData.timeToRead }} MIN READ</span>
</footer>
</div>
</article>
</template>
<script>
import AuthorData from '../../data/author.yml';
import Avatar from './icons/Avatar';
export default {
components: {
Avatar
},
props: {
cardData: Object
},
computed: {
articleClass() {
let classes = ['post-card', 'post'];
if (this.cardData.fields === null) {
classes.push('no-image')
}
const cardTagClass = 'post-' + this.cardData.tags;
classes.push(cardTagClass);
return classes
}
},
methods: {
getAuthorData: authorName => {
const authorList = AuthorData;
for (var i = 0; i < authorList.length; i++) {
const currentAuthorUsername = authorList[i].username;
if (authorName === currentAuthorUsername) {
return authorList[i]
}
}
import Avatar from "./icons/Avatar";
export default {
components: {
Avatar
},
props: {
cardData: Object
},
computed: {
articleClass() {
let classes = ["post-card", "post"];
if (this.cardData.fields === null) {
classes.push("no-image");
}
const cardTagClass = "post-" + this.cardData.tags;
classes.push(cardTagClass);
return classes;
}
},
filters: {
truncate: (text, length, suffix) => {
return text.substring(0, length) + suffix;
},
filters: {
truncate: (text, length, suffix) => {
return text.substring(0, length) + suffix;
},
stripHTML: text => {
// FIXME document is not defined
// Showing error while deploying on netlify.
var tmp = document.createElement("DIV");
tmp.innerHTML = text;
return tmp.textContent || tmp.innerText || "";
}
stripHTML: text => {
var tmp = document.createElement("DIV");
tmp.innerHTML = text;
return tmp.textContent || tmp.innerText || "";
}
}
};
</script>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment