Improve small details

This commit is contained in:
2024-02-26 20:14:40 +01:00
parent c69bcc3643
commit 82d0391ee0
2 changed files with 9 additions and 9 deletions

View File

@@ -64,7 +64,7 @@ useIntervalFn(async () => await refresh(), 5000)
<div class="flex items-center justify-end w-full"> <div class="flex items-center justify-end w-full">
<ClientOnly> <ClientOnly>
<p v-if="codingActivity" class="text-subtitle text-xs w-1/2"> <p v-if="codingActivity" class="text-subtitle text-xs w-1/2">
Started the {{ formatDate(codingActivity.timestamps.start) }} Started {{ useTimeAgo(codingActivity.timestamps.start).value }}, the {{ formatDate(codingActivity.timestamps.start) }}
</p> </p>
</ClientOnly> </ClientOnly>
<div class="flex items-center space-x-1 w-1/2 justify-end"> <div class="flex items-center space-x-1 w-1/2 justify-end">

View File

@@ -21,23 +21,23 @@ const CardUi = {
<div v-if="stats"> <div v-if="stats">
<div class="flex gap-4 items-center"> <div class="flex gap-4 items-center">
<div class="text-md"> <div class="text-md">
<div class="flex items-center gap-1"> <div class="flex items-center gap-x-1">
<h3>Total hours:</h3> <h3>Total hours:</h3>
<p>{{ usePrecision(stats.coding.data.grand_total.total_seconds_including_other_language / 3600, 0) }} hours</p> <p class="text-subtitle">{{ usePrecision(stats.coding.data.grand_total.total_seconds_including_other_language / 3600, 0) }} hours</p>
</div> </div>
<div class="flex items-start gap-1 flex-wrap"> <div class="flex items-start gap-x-1 flex-wrap">
<h3>Best Editors:</h3> <h3>Best Editors:</h3>
<p> <p class="text-subtitle">
{{ stats.editors.data.slice(0, 2).map(editor => `${editor.name} (${editor.percent}%)`).join(', ') }} {{ stats.editors.data.slice(0, 2).map(editor => `${editor.name} (${editor.percent}%)`).join(', ') }}
</p> </p>
</div> </div>
<div class="flex items-center gap-1"> <div class="flex items-center gap-x-1">
<h3>Best OS:</h3> <h3>Best OS:</h3>
<p>{{ stats.os.data[0].name }} with {{ stats.os.data[0].percent }}%</p> <p class="text-subtitle">{{ stats.os.data[0].name }} with {{ stats.os.data[0].percent }}%</p>
</div> </div>
<div class="flex items-start gap-1 flex-wrap"> <div class="flex items-start gap-x-1 flex-wrap">
<h3>Top languages:</h3> <h3>Top languages:</h3>
<p>{{ stats.languages.data.slice(0, 2).map(language => `${language.name} (${language.percent}%)`).join(', ') }}</p> <p class="text-subtitle">{{ stats.languages.data.slice(0, 2).map(language => `${language.name} (${language.percent}%)`).join(', ') }}</p>
</div> </div>
</div> </div>
</div> </div>