tyler.durden
/
dashy
mirror of https://github.com/Lissy93/dashy.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

🚨 ⚰️ remove unused css, fix linting issues in HN

This commit is contained in:
Josua Blejeru 2023-05-24 12:25:03 +02:00
parent 503d662065
commit 7e1057d059
1 changed files with 12 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/components/Widgets/HackernewsTrending.vue
View File

@ -6,12 +6,10 @@
<a class="post-top" :href="trendingPosts.originURL"> <a class="post-top" :href="trendingPosts.originURL">
<div class="post-title-wrap"> <div class="post-title-wrap">
<p class="post-title">{{ trendingPosts.title }}</p> <p class="post-title">{{ trendingPosts.title }}</p>
<div class="score-wrap">
<p class="post-date"> <p class="post-date">
{{ formatDate(trendingPosts.time) }} {{ formatDate(trendingPosts.time) }}
</p> </p>
<p class="post-date" v-if="trendingPosts.score">score: {{ trendingPosts.score }}</p> <p class="post-score" v-if="trendingPosts.score">score: {{ trendingPosts.score }}</p>
</div>
</div> </div>
</a> </a>
</div> </div>
@ -53,20 +51,19 @@ export default {
const allData = topPosts.map((post) => { const allData = topPosts.map((post) => {
const url = `${widgetApiEndpoints.hackernewsTrending}/item/${post}.json`; const url = `${widgetApiEndpoints.hackernewsTrending}/item/${post}.json`;
return this.makeRequest(url); return this.makeRequest(url);
}) });
Promise.all(allData).then((resolvedPostValues) => { Promise.all(allData).then((resolvedPostValues) => {
this.trendingPosts = resolvedPostValues.map((element, index) => { this.trendingPosts = resolvedPostValues.map((element, index) => {
element.originURL = `https://news.ycombinator.com/item?id=${topPosts.at(index)}` const trendingPost = { ...element, originURL: `https://news.ycombinator.com/item?id=${topPosts.at(index)}` };
return element return trendingPost;
}); });
console.log(this.trendingPosts)
}); });
}, },
formatDate(unixTime) { formatDate(unixTime) {
const date = new Date(unixTime * 1000); const date = new Date(unixTime * 1000);
// Then specify how you want your dates to be formatted // Then specify how you want your dates to be formatted
return new Intl.DateTimeFormat('default', {dateStyle: 'long'}).format(date); return new Intl.DateTimeFormat('default', { dateStyle: 'long' }).format(date);
} },
}, },
}; };
</script> </script>
@ -117,39 +114,12 @@ export default {
opacity: var(--dimming-factor); opacity: var(--dimming-factor);
color: var(--widget-text-color); color: var(--widget-text-color);
} }
img.post-img { p.post-score {
border-radius: var(--curve-factor); font-size: 0.8rem;
width: 2rem; margin: 0;
height: 2rem; opacity: var(--dimming-factor);
margin-right: 0.5rem;
}
}
.post-body {
font-size: 0.85rem;
color: var(--widget-text-color);
max-height: 400px;
overflow: hidden;
::v-deep p {
margin: 0.5rem 0;
}
::v-deep img {
max-width: 80%;
display: flex;
margin: 0 auto;
border-radius: var(--curve-factor);
}
::v-deep a {
color: var(--widget-text-color); color: var(--widget-text-color);
} }
::v-deep svg path {
fill: var(--widget-text-color);
}
::v-deep blockquote {
margin-left: 0.5rem;
padding-left: 0.5rem;
border-left: 4px solid var(--widget-text-color);
}
::v-deep .avatar.avatar-user { display: none; }
} }
} }
} }