natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Resolve #5928

This commit is contained in:
syuilo 2020-02-15 02:16:11 +09:00
parent 55bdf0d618
commit d5c1e7e579
1 changed files with 10 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/client/widgets/trends.vue
View File

@ -4,10 +4,11 @@
<template #header><fa :icon="faHashtag"/>{{ $t('_widgets.trends') }}</template>
<div class="wbrkwala">
<transition-group tag="div" name="chart">
<mk-loading v-if="fetching"/>
<transition-group tag="div" name="chart" class="tags" v-else>
<div v-for="stat in stats" :key="stat.tag">
<div class="tag">
<router-link :to="`/tags/${ encodeURIComponent(stat.tag) }`" :title="stat.tag">#{{ stat.tag }}</router-link>
<router-link class="a" :to="`/tags/${ encodeURIComponent(stat.tag) }`" :title="stat.tag">#{{ stat.tag }}</router-link>
<p>{{ $t('nUsersMentioned', { n: stat.usersCount }) }}</p>
</div>
<x-chart class="chart" :src="stat.chart"/>
@ -66,20 +67,10 @@ export default define({
<style lang="scss" scoped>
.wbrkwala {
> .fetching,
> .empty {
margin: 0;
padding: 16px;
text-align: center;
color: var(--text);
opacity: 0.7;
height: (62px + 1px) + (62px + 1px) + (62px + 1px) + (62px + 1px) + 62px;
overflow: hidden;
> [data-icon] {
margin-right: 4px;
}
}
> div {
> .tags {
.chart-move {
transition: transform 1s ease;
}
@ -96,22 +87,23 @@ export default define({
> .tag {
flex: 1;
overflow: hidden;
font-size: 14px;
font-size: 0.9em;
color: var(--fg);
> a {
> .a {
display: block;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: inherit;
line-height: 18px;
}
> p {
margin: 0;
font-size: 75%;
opacity: 0.7;
line-height: 16px;
}
}