diff --git a/src/client/pages/welcome.entrance.vue b/src/client/pages/welcome.entrance.vue index 2ce357e205..550d9fe6ec 100644 --- a/src/client/pages/welcome.entrance.vue +++ b/src/client/pages/welcome.entrance.vue @@ -1,9 +1,27 @@ @@ -17,6 +35,7 @@ import XNote from '@/components/note.vue'; import MkPagination from '@/components/ui/pagination.vue'; import { host, instanceName } from '@/config'; import * as os from '@/os'; +import number from '@/filters/number'; export default defineComponent({ components: { @@ -30,13 +49,20 @@ export default defineComponent({ host: toUnicode(host), instanceName, meta: null, - pagination: { + stats: null, + tags: [], + clipPagination: { endpoint: 'clips/notes', limit: 10, params: () => ({ clipId: this.meta.pinnedClipId, }) }, + featuredPagination: { + endpoint: 'notes/featured', + limit: 10, + offsetMode: true + }, }; }, @@ -48,6 +74,13 @@ export default defineComponent({ os.api('stats').then(stats => { this.stats = stats; }); + + os.api('hashtags/list', { + sort: '+mentionedLocalUsers', + limit: 8 + }).then(tags => { + this.tags = tags; + }); }, methods: { @@ -61,7 +94,9 @@ export default defineComponent({ os.popup(XSignupDialog, { autoSet: true }, {}, 'closed'); - } + }, + + number } }); @@ -77,15 +112,64 @@ export default defineComponent({ padding: 8px 12px; background: rgba(0, 0, 0, 0.5); } + + > .overview { + > .stats, > .tags { + display: inline-block; + vertical-align: top; + width: 530px; + padding: 32px; + margin: 16px; + box-sizing: border-box; + + @media (max-width: 800px) { + display: block; + width: 100%; + margin: 12px 0; + } + } + + > .stats { + background: var(--accent); + border-radius: 12px; + color: #fff; + font-size: 1.5em; + + > div { + display: flex; + + > span:first-child { + opacity: 0.7; + font-weight: bold; + } + + > span:last-child { + margin-left: auto; + } + } + } + + > .tags { + background: var(--panel); + border-radius: 12px; + color: var(--fg); + font-size: 1.5em; + + > .tag { + margin-right: 1em; + } + } + } } .kmkqjgkl { display: inline-block; vertical-align: middle; - width: 600px; + width: 530px; margin: 16px; + box-sizing: border-box; text-align: left; - box-shadow: 0 6px 46px rgb(0 0 0 / 30%); + box-shadow: 0 6px 46px rgb(0 0 0 / 25%); border-radius: 12px; @media (max-width: 800px) { diff --git a/src/client/ui/visitor/b.vue b/src/client/ui/visitor/b.vue index 4f7a7f8956..efef2ade3c 100644 --- a/src/client/ui/visitor/b.vue +++ b/src/client/ui/visitor/b.vue @@ -1,5 +1,7 @@