From dffd6b6bbacabb97ce4af06ac91f73b4424f2922 Mon Sep 17 00:00:00 2001 From: Arthur DANJOU Date: Tue, 2 Jul 2024 00:40:43 +0200 Subject: [PATCH] Improve main page --- app/components/AppFooter.vue | 2 +- app/components/content/Activity.vue | 45 ++++++++++---------------- app/components/content/CatchPhrase.vue | 18 +++++++++++ app/components/content/HoverText.vue | 18 +++++++++++ app/components/content/Quote.vue | 21 ++++++------ app/components/content/Stats.vue | 15 ++++++--- content/index.md | 19 +++++++---- 7 files changed, 88 insertions(+), 50 deletions(-) create mode 100644 app/components/content/CatchPhrase.vue create mode 100644 app/components/content/HoverText.vue diff --git a/app/components/AppFooter.vue b/app/components/AppFooter.vue index 557d239..fb81217 100644 --- a/app/components/AppFooter.vue +++ b/app/components/AppFooter.vue @@ -34,7 +34,7 @@ const socials = [

Find me on:

-
+
('activity', () useIntervalFn(async () => await refresh(), 5000) const codingActivity = computed(() => activity.value!.data.activities.filter(activity => IDEs.some(ide => ide.name === activity.name))[0]) -// eslint-disable-next-line vue/return-in-computed-property const getActivity = computed(() => { const activity = codingActivity.value if (!activity) return - switch (activity.name) { - case 'Visual Studio Code': - return { - active: !activity.details.includes('Idling'), - name: activity.name, - project: activity.state ? activity.state.replace('Workspace:', '') : '', - state: activity.details.charAt(0).toLowerCase() + activity.details.slice(1), - start: { - ago: useTimeAgo(activity.timestamps.start).value, - formated: `${useDateFormat(activity.timestamps.start, 'DD MMM YYYY').value} at ${useDateFormat(activity.timestamps.start, 'HH:mm:ss').value}` - } - } - case 'WebStorm': - case 'IntelliJ IDEA Ultimate': - return { - active: activity.state.toLowerCase().includes('editing'), - project: activity.details, - state: activity.state.charAt(0).toLowerCase() + activity.state.slice(1), - name: activity.name, - start: { - ago: useTimeAgo(activity.timestamps.start).value, - formated: `${useDateFormat(activity.timestamps.start, 'DD MMM YYYY').value} at ${useDateFormat(activity.timestamps.start, 'HH:mm:ss').value}` - } - } + + const active = activity.name === 'Visual Studio Code' ? !activity.details.includes('Idling') : activity.state.toLowerCase().includes('editing') + const project = activity.state ? activity.state.replace('Workspace:', '') : '' + const state = activity.details.charAt(0).toLowerCase() + activity.details.slice(1) + const start = { + ago: useTimeAgo(activity.timestamps.start).value, + formated: `${useDateFormat(activity.timestamps.start, 'DD MMM YYYY').value} at ${useDateFormat(activity.timestamps.start, 'HH:mm:ss').value}` + } + + return { + active, + name: activity.name, + project, + state, + start } }) @@ -66,9 +56,8 @@ const getActivity = computed(() => { /> {{ getActivity.name }}. - I've started {{ getActivity.start.ago }}, the {{ - getActivity.start.formated - }}. + I've started {{ getActivity.start.ago }}, the + {{ getActivity.start.formated }}.
+ +
+ +

Hover some of the bold text to find out more about me.

+
+ + + + diff --git a/app/components/content/HoverText.vue b/app/components/content/HoverText.vue new file mode 100644 index 0000000..7c55dc6 --- /dev/null +++ b/app/components/content/HoverText.vue @@ -0,0 +1,18 @@ + + + diff --git a/app/components/content/Quote.vue b/app/components/content/Quote.vue index b1adde3..8b80dc3 100644 --- a/app/components/content/Quote.vue +++ b/app/components/content/Quote.vue @@ -1,13 +1,15 @@ - - diff --git a/app/components/content/Stats.vue b/app/components/content/Stats.vue index 2943efc..74c68f6 100644 --- a/app/components/content/Stats.vue +++ b/app/components/content/Stats.vue @@ -8,10 +8,17 @@ const { data: stats } = await useFetch('/api/stats')

I collect some data for {{ useTimeAgo(new Date(stats.coding.data.range.start)).value }}, started the - {{ useDateFormat(new Date(stats.coding.data.range.start), 'Do MMMM YYYY').value }}. - I've coded for a total of {{ - usePrecision(stats.coding.data.grand_total.total_seconds_including_other_language / 3600, 0) - }} hours. + + . + I've coded for a total of + + hours. My best editors are {{ stats.editors.data.slice(0, 2).map(editor => `${editor.name} (${editor.percent}%)`).join(' and ') }}.