chore: use tabular nums
This commit is contained in:
+2
-2
@@ -37,13 +37,13 @@ const bars = computed(() => {
|
||||
{{ $t('CAPTAIN.OVERVIEW.CREDITS.TITLE') }}
|
||||
</h3>
|
||||
<div class="flex items-baseline gap-2">
|
||||
<span class="text-2xl font-semibold text-n-slate-12">
|
||||
<span class="text-2xl font-semibold tabular-nums text-n-slate-12">
|
||||
{{ creditUsage.total }}
|
||||
</span>
|
||||
<span class="text-sm text-n-slate-11">
|
||||
{{ $t('CAPTAIN.OVERVIEW.CREDITS.UNIT') }}
|
||||
</span>
|
||||
<span class="text-sm font-medium text-n-slate-11">
|
||||
<span class="text-sm font-medium tabular-nums text-n-slate-11">
|
||||
{{ creditUsage.trend }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
+4
-4
@@ -22,7 +22,7 @@ const approvedPct = computed(() => {
|
||||
<span class="text-sm font-medium text-n-slate-12">
|
||||
{{ $t('CAPTAIN.OVERVIEW.KNOWLEDGE.TITLE') }}
|
||||
</span>
|
||||
<span class="text-sm text-n-slate-11">
|
||||
<span class="text-sm tabular-nums text-n-slate-11">
|
||||
{{ $t('CAPTAIN.OVERVIEW.KNOWLEDGE.COVERAGE', { pct: approvedPct }) }}
|
||||
</span>
|
||||
</div>
|
||||
@@ -34,7 +34,7 @@ const approvedPct = computed(() => {
|
||||
</div>
|
||||
<div class="grid grid-cols-3 gap-3">
|
||||
<div class="flex flex-col gap-1">
|
||||
<span class="text-xl font-semibold text-n-slate-12">
|
||||
<span class="text-xl font-semibold tabular-nums text-n-slate-12">
|
||||
{{ knowledge.approved }}
|
||||
</span>
|
||||
<span class="text-xs text-n-slate-11">
|
||||
@@ -42,7 +42,7 @@ const approvedPct = computed(() => {
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<span class="text-xl font-semibold text-n-slate-12">
|
||||
<span class="text-xl font-semibold tabular-nums text-n-slate-12">
|
||||
{{ knowledge.pending }}
|
||||
</span>
|
||||
<span class="text-xs text-n-slate-11">
|
||||
@@ -50,7 +50,7 @@ const approvedPct = computed(() => {
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<span class="text-xl font-semibold text-n-slate-12">
|
||||
<span class="text-xl font-semibold tabular-nums text-n-slate-12">
|
||||
{{ knowledge.documents }}
|
||||
</span>
|
||||
<span class="text-xs text-n-slate-11">
|
||||
|
||||
+6
-2
@@ -27,10 +27,14 @@ const trendClass = computed(() => {
|
||||
/>
|
||||
</div>
|
||||
<div class="flex items-end justify-between gap-2">
|
||||
<span class="text-3xl font-semibold tracking-tight text-n-slate-12">
|
||||
<span
|
||||
class="text-3xl font-semibold tracking-tight tabular-nums text-n-slate-12"
|
||||
>
|
||||
{{ value }}
|
||||
</span>
|
||||
<span class="text-sm font-medium" :class="trendClass">{{ trend }}</span>
|
||||
<span class="text-sm font-medium tabular-nums" :class="trendClass">
|
||||
{{ trend }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
+4
-2
@@ -46,7 +46,7 @@ const rate = '1.3%';
|
||||
<span class="text-sm font-medium text-n-slate-12">
|
||||
{{ $t('CAPTAIN.OVERVIEW.FLAGGED.TITLE') }}
|
||||
</span>
|
||||
<span class="text-sm text-n-slate-11">
|
||||
<span class="text-sm tabular-nums text-n-slate-11">
|
||||
{{ $t('CAPTAIN.OVERVIEW.FLAGGED.TOTAL', { count: total, rate }) }}
|
||||
</span>
|
||||
</div>
|
||||
@@ -65,7 +65,9 @@ const rate = '1.3%';
|
||||
:style="{ width: `${Math.round((reason.count / total) * 100)}%` }"
|
||||
/>
|
||||
</div>
|
||||
<span class="w-6 text-xs font-medium text-right text-n-slate-12">
|
||||
<span
|
||||
class="w-6 text-xs font-medium text-right tabular-nums text-n-slate-12"
|
||||
>
|
||||
{{ reason.count }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user