icons for dashboard
This commit is contained in:
parent
688368e4e1
commit
79f3052907
|
@ -16,7 +16,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div v-if="!fetching" class="items">
|
<div v-if="!fetching" class="items">
|
||||||
<div class="item _panel sub">
|
<div class="item _panel sub">
|
||||||
<div class="icon"><i class="ti ti-world-download"></i></div>
|
<div class="icon"><i class="ph-download-bold ph-xl"></i></div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="value">
|
<div class="value">
|
||||||
{{ number(federationSubActive) }}
|
{{ number(federationSubActive) }}
|
||||||
|
@ -26,7 +26,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item _panel pub">
|
<div class="item _panel pub">
|
||||||
<div class="icon"><i class="ti ti-world-upload"></i></div>
|
<div class="icon"><i class="ph-upload-bold ph-xl"></i></div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="value">
|
<div class="value">
|
||||||
{{ number(federationPubActive) }}
|
{{ number(federationPubActive) }}
|
||||||
|
@ -147,15 +147,15 @@ onMounted(async () => {
|
||||||
|
|
||||||
&.sub {
|
&.sub {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #d5ba0026;
|
background: #907aa9;
|
||||||
color: #dfc300;
|
color: #c4a7e7;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.pub {
|
&.pub {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #00cf2326;
|
background: #56949f;
|
||||||
color: #00cd5b;
|
color: #9ccfd8;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
<MkLoading v-if="fetching"/>
|
<MkLoading v-if="fetching"/>
|
||||||
<div v-else :class="$style.root">
|
<div v-else :class="$style.root">
|
||||||
<div class="item _panel users">
|
<div class="item _panel users">
|
||||||
<div class="icon"><i class="ti ti-users"></i></div>
|
<div class="icon"><i class="ph-users-bold ph-xl"></i></div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="value">
|
<div class="value">
|
||||||
<MkNumber :value="stats.originalUsersCount" style="margin-right: 0.5em;"/>
|
<MkNumber :value="stats.originalUsersCount" style="margin-right: 0.5em;"/>
|
||||||
|
@ -14,17 +14,17 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item _panel notes">
|
<div class="item _panel notes">
|
||||||
<div class="icon"><i class="ti ti-pencil"></i></div>
|
<div class="icon"><i class="ph-pencil-bold ph-xl"></i></div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="value">
|
<div class="value">
|
||||||
<MkNumber :value="stats.originalNotesCount" style="margin-right: 0.5em;"/>
|
<MkNumber :value="stats.originalNotesCount" style="margin-right: 0.5em;"/>
|
||||||
<MkNumberDiff v-tooltip="i18n.ts.dayOverDayChanges" class="diff" :value="notesComparedToThePrevDay"></MkNumberDiff>
|
<MkNumberDiff v-tooltip="i18n.ts.dayOverDayChanges" class="diff" :value="notesComparedToThePrevDay"></MkNumberDiff>
|
||||||
</div>
|
</div>
|
||||||
<div class="label">Notes</div>
|
<div class="label">Posts</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item _panel instances">
|
<div class="item _panel instances">
|
||||||
<div class="icon"><i class="ti ti-planet"></i></div>
|
<div class="icon"><i class="ph-planet-bold ph-xl"></i></div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="value">
|
<div class="value">
|
||||||
<MkNumber :value="stats.instances" style="margin-right: 0.5em;"/>
|
<MkNumber :value="stats.instances" style="margin-right: 0.5em;"/>
|
||||||
|
@ -33,7 +33,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item _panel online">
|
<div class="item _panel online">
|
||||||
<div class="icon"><i class="ti ti-access-point"></i></div>
|
<div class="icon"><i class="ph-broadcast-bold ph-xl"></i></div>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="value">
|
<div class="value">
|
||||||
<MkNumber :value="onlineUsersCount" style="margin-right: 0.5em;"/>
|
<MkNumber :value="onlineUsersCount" style="margin-right: 0.5em;"/>
|
||||||
|
@ -106,36 +106,36 @@ onMounted(async () => {
|
||||||
|
|
||||||
&.users {
|
&.users {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #0088d726;
|
background: #56949f;
|
||||||
color: #3d96c1;
|
color: #9ccfd8;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.notes {
|
&.notes {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #86b30026;
|
background: #286983;
|
||||||
color: #86b300;
|
color: #31748f;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.instances {
|
&.instances {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #e96b0026;
|
background: #d7827e;
|
||||||
color: #d76d00;
|
color: #ebbcba;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.emojis {
|
&.emojis {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #d5ba0026;
|
background: #ea9d34;
|
||||||
color: #dfc300;
|
color: #f6c177;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.online {
|
&.online {
|
||||||
> .icon {
|
> .icon {
|
||||||
background: #8a00d126;
|
background: #907aa9;
|
||||||
color: #c01ac3;
|
color: #c4a7e7;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -170,7 +170,7 @@ const headerTabs = $computed(() => []);
|
||||||
|
|
||||||
definePageMetadata({
|
definePageMetadata({
|
||||||
title: i18n.ts.dashboard,
|
title: i18n.ts.dashboard,
|
||||||
icon: 'ti ti-dashboard',
|
icon: 'ph-gauge-bold ph-lg',
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue