From 8d165035419989a37dd8fb637cdad06c6db3a6ea Mon Sep 17 00:00:00 2001
From: Gregor Vostrak <gregor@solidtime.io>
Date: Tue, 10 Mar 2026 14:32:41 +0100
Subject: [PATCH] Adjust UI sizing and spacing

---
 resources/js/Components/Common/StatCard.vue                     | 2 +-
 resources/js/Pages/Time.vue                                     | 2 +-
 resources/js/packages/ui/src/GroupedItemsCountButton.vue        | 2 +-
 .../js/packages/ui/src/TimeTracker/TimeTrackerControls.vue      | 2 +-
 .../ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue       | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/resources/js/Components/Common/StatCard.vue b/resources/js/Components/Common/StatCard.vue
index da209b50..757d86eb 100644
--- a/resources/js/Components/Common/StatCard.vue
+++ b/resources/js/Components/Common/StatCard.vue
@@ -8,7 +8,7 @@ defineProps<{
 <template>
     <div class="rounded-lg bg-card-background border-card-border shadow-card border px-3.5 py-2.5">
         <dt class="font-semibold text-sm text-text-secondary">{{ title }}</dt>
-        <dd class="text-2xl text-text-primary pt-1 font-semibold">
+        <dd class="text-xl text-text-primary pt-1 font-semibold">
             {{ value ?? '--' }}
         </dd>
     </div>
diff --git a/resources/js/Pages/Time.vue b/resources/js/Pages/Time.vue
index c6638afc..cdfb2a65 100644
--- a/resources/js/Pages/Time.vue
+++ b/resources/js/Pages/Time.vue
@@ -157,7 +157,7 @@ function deleteSelected() {
         <div ref="loadMoreContainer">
             <div
                 v-if="isFetchingNextPage"
-                class="flex justify-center items-center py-5 text-text-primary font-medium">
+                class="flex justify-center items-center py-5 text-sm text-text-primary font-medium">
                 <LoadingSpinner></LoadingSpinner>
                 <span> Loading more time entries... </span>
             </div>
diff --git a/resources/js/packages/ui/src/GroupedItemsCountButton.vue b/resources/js/packages/ui/src/GroupedItemsCountButton.vue
index 72d5111b..23a1d965 100644
--- a/resources/js/packages/ui/src/GroupedItemsCountButton.vue
+++ b/resources/js/packages/ui/src/GroupedItemsCountButton.vue
@@ -25,7 +25,7 @@ const expandedStatusClasses = computed(() => {
     <button
         :class="
             twMerge(
-                'font-medium rounded flex items-center transition justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:border-transparent',
+                'font-medium text-base rounded flex items-center transition justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:border-transparent',
                 expandedStatusClasses,
                 props.size
             )
diff --git a/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue b/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue
index d789ae26..be3ec5a8 100644
--- a/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue
+++ b/resources/js/packages/ui/src/TimeTracker/TimeTrackerControls.vue
@@ -267,7 +267,7 @@ useSelectEvents(
                         :enable-estimated-time="enableEstimatedTime"
                         @changed="updateProject"></TimeTrackerProjectTaskDropdown>
                 </div>
-                <div class="flex items-center space-x-1 @2xl:space-x-2 px-2 @2xl:px-4 shrink-0">
+                <div class="flex items-center space-x-0 @4xl:space-x-2 px-2 @4xl:px-4 shrink-0">
                     <TimeTrackerTagDropdown
                         v-model="currentTimeEntry.tags"
                         :create-tag
diff --git a/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue b/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
index cd00db33..6c17ec2d 100644
--- a/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
+++ b/resources/js/packages/ui/src/TimeTracker/TimeTrackerProjectTaskDropdown.vue
@@ -642,7 +642,7 @@ const showCreateProject = ref(false);
                 </div>
                 <div v-if="canCreateProject" class="hover:bg-card-background-active rounded-b-lg">
                     <button
-                        class="text-text-primary flex space-x-3 items-center px-4 py-3 text-xs font-semibold border-t border-card-background-separator"
+                        class="text-text-primary w-full flex space-x-3 items-center px-4 py-3 text-xs font-semibold border-t border-card-background-separator"
                         @click="
                             open = false;
                             showCreateProject = true;