diff --git a/src/client/app/admin/views/dashboard.vue b/src/client/app/admin/views/dashboard.vue index d3a5f97c8..8cd57831a 100644 --- a/src/client/app/admin/views/dashboard.vue +++ b/src/client/app/admin/views/dashboard.vue @@ -8,6 +8,12 @@

{{ $t('@.ai-chan-kawaii') }}

+ + + {{ instance.host }}{{ instance.notesCount | number }} / {{ instance.usersCount | number }} + + +
@@ -84,6 +90,8 @@ import XCpuMemory from "./cpu-memory.vue"; import XCharts from "./charts.vue"; import XApLog from "./ap-log.vue"; import { faDatabase } from '@fortawesome/free-solid-svg-icons'; +import MarqueeText from 'vue-marquee-text-component'; +import randomColor from 'randomcolor'; export default Vue.extend({ i18n: i18n('admin/views/dashboard.vue'), @@ -91,7 +99,8 @@ export default Vue.extend({ components: { XCpuMemory, XCharts, - XApLog + XApLog, + MarqueeText }, data() { @@ -99,6 +108,7 @@ export default Vue.extend({ stats: null, connection: null, meta: null, + instances: [], faDatabase }; }, @@ -113,6 +123,18 @@ export default Vue.extend({ this.$root.api('stats').then(stats => { this.stats = stats; }); + + this.$root.api('instances', { + sort: '+notes' + }).then(instances => { + instances.forEach(i => { + i.bg = randomColor({ + seed: i.host, + luminosity: 'dark' + }); + }); + this.instances = instances; + }); }, beforeDestroy() { @@ -136,7 +158,6 @@ export default Vue.extend({ > header display flex - margin-bottom 16px padding-bottom 16px border-bottom solid 1px var(--adminDashboardHeaderBorder) color var(--adminDashboardHeaderFg) @@ -161,6 +182,20 @@ export default Vue.extend({ margin-left auto margin-right 0 + > .instances + padding 16px + color var(--adminDashboardHeaderFg) + font-size 13px + + >>> .instance + margin 0 10px + + > b + padding 2px 6px + margin-right 4px + border-radius 4px + color #fff + > .stats display flex justify-content space-between diff --git a/src/client/app/admin/views/index.vue b/src/client/app/admin/views/index.vue index a97148ac1..aa37cd649 100644 --- a/src/client/app/admin/views/index.vue +++ b/src/client/app/admin/views/index.vue @@ -37,11 +37,6 @@
- - - {{ instance.host }}{{ instance.notesCount | number }} / {{ instance.usersCount | number }} - -
@@ -70,8 +65,6 @@ import XHashtags from "./hashtags.vue"; import XUsers from "./users.vue"; import { faHeadset, faArrowLeft } from '@fortawesome/free-solid-svg-icons'; import { faGrin } from '@fortawesome/free-regular-svg-icons'; -import MarqueeText from 'vue-marquee-text-component'; -import randomColor from 'randomcolor'; // Detect the user agent const ua = navigator.userAgent.toLowerCase(); @@ -86,8 +79,7 @@ export default Vue.extend({ XEmoji, XAnnouncements, XHashtags, - XUsers, - MarqueeText + XUsers }, provide: { isMobile @@ -98,25 +90,11 @@ export default Vue.extend({ version, isMobile, navOpend: !isMobile, - instances: [], faGrin, faArrowLeft, faHeadset }; }, - created() { - this.$root.api('instances', { - sort: '+notes' - }).then(instances => { - instances.forEach(i => { - i.bg = randomColor({ - seed: i.host, - luminosity: 'dark' - }); - }); - this.instances = instances; - }); - }, methods: { nav(page: string) { this.page = page; @@ -287,22 +265,8 @@ export default Vue.extend({ width 100% padding 0 0 0 250px - > .instances - padding 10px - background #000 - color #fff - font-size 13px - - >>> .instance - margin 0 10px - - > b - padding 0px 6px - margin-right 4px - border-radius 4px - > .page - max-width 1300px + max-width 1150px &.isMobile > main