From b07cd37a16974aa1bf3154cd92266c029d7dc089 Mon Sep 17 00:00:00 2001 From: syuilo <syuilotan@yahoo.co.jp> Date: Mon, 18 Feb 2019 20:48:39 +0900 Subject: [PATCH] :art: --- locales/ja-JP.yml | 2 + src/client/app/common/views/pages/explore.vue | 47 +++++++++++++++++++ 2 files changed, 49 insertions(+) diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index b0ad7f496..7cd1f4d3c 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -231,6 +231,8 @@ common/views/pages/explore.vue: recently-registered-users: "新規ユーザー" popular-tags: "人気のタグ" federated: "連合" + explore: "{host}を探索" + users-info: "現在{users}ユーザーが登録されています" common/views/components/user-list.vue: no-users: "ユーザーがいません" diff --git a/src/client/app/common/views/pages/explore.vue b/src/client/app/common/views/pages/explore.vue index 63a9a4703..c627c0a6d 100644 --- a/src/client/app/common/views/pages/explore.vue +++ b/src/client/app/common/views/pages/explore.vue @@ -1,5 +1,14 @@ <template> <div> + <ui-container :show-header="false"> + <div class="kpdsmpnk" :style="{ backgroundImage: meta.bannerUrl ? `url(${meta.bannerUrl})` : null }"> + <div> + <b>{{ $t('explore', { host: meta.name }) }}</b> + <span>{{ $t('users-info', { users: num(stats.originalUsersCount) }) }}</span> + </div> + </div> + </ui-container> + <mk-user-list v-if="tag != null" :make-promise="tagUsers" :key="`${tag}-local`"> <fa :icon="faHashtag" fixed-width/>{{ tag }} </mk-user-list> @@ -76,6 +85,9 @@ export default Vue.extend({ }), tagsLocal: [], tagsRemote: [], + stats: null, + meta: null, + num: Vue.filter('number'), faBookmark, faChartLine, faCommentAlt, faPlus, faHashtag }; }, @@ -117,6 +129,12 @@ export default Vue.extend({ }).then(tags => { this.tagsRemote = tags; }); + this.$root.api('stats').then(stats => { + this.stats = stats; + }); + this.$root.getMeta().then(meta => { + this.meta = meta; + }); } }); </script> @@ -131,4 +149,33 @@ export default Vue.extend({ &.local font-weight bold +.kpdsmpnk + min-height 100px + padding 16px + background-position center + background-size cover + + &:before + content "" + display block + position absolute + top 0 + left 0 + width 100% + height 100% + background rgba(0, 0, 0, 0.3) + + > div + color #fff + text-shadow 0 0 8px #00 + + > b + display block + font-size 20px + font-weight bold + + > span + font-size 14px + opacity 0.8 + </style>