28 lines
955 B
Vue
28 lines
955 B
Vue
<template>
|
|
<div class="mini-timer flex items-center justify-center h-screen bg-bg-base select-none" style="-webkit-app-region: drag">
|
|
<div class="text-center">
|
|
<p class="text-[2rem] font-medium font-[family-name:var(--font-heading)] tracking-tighter text-text-primary">
|
|
{{ timerStore.formattedTime }}
|
|
</p>
|
|
<p v-if="projectName" class="text-[0.6875rem] text-text-tertiary mt-1 truncate max-w-[180px]">
|
|
{{ projectName }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { useTimerStore } from '../stores/timer'
|
|
import { useProjectsStore } from '../stores/projects'
|
|
|
|
const timerStore = useTimerStore()
|
|
const projectsStore = useProjectsStore()
|
|
|
|
const projectName = computed(() => {
|
|
if (!timerStore.selectedProjectId) return ''
|
|
const project = projectsStore.projects.find(p => p.id === timerStore.selectedProjectId)
|
|
return project?.name || ''
|
|
})
|
|
</script>
|