improve reporting page responsive layout; standardize button sizing;

prevent mobile input zoom; increase CI playwright shards
This commit is contained in:
Gregor Vostrak
2026-02-12 13:30:11 +01:00
parent 685cc29282
commit b258717211
14 changed files with 226 additions and 29 deletions

View File

@@ -21,7 +21,7 @@ const props = withDefaults(
<button
:type="type"
:disabled="loading"
class="inline-flex items-center px-3 py-2 bg-button-primary-background border border-button-primary-border rounded-md font-medium text-xs sm:text-sm text-button-primary-text hover:bg-button-primary-background-hover active:bg-button-primary-background-hover focus:outline-none focus-visible:ring-2 focus-visible:border-transparent focus-visible:ring-ring transition ease-in-out duration-150">
class="inline-flex items-center h-9 px-3 text-sm bg-button-primary-background border border-button-primary-border rounded-md font-medium text-button-primary-text hover:bg-button-primary-background-hover active:bg-button-primary-background-hover focus:outline-none focus-visible:ring-2 focus-visible:border-transparent focus-visible:ring-ring transition ease-in-out duration-150">
<span :class="twMerge('flex items-center ', props.icon ? 'space-x-1.5' : '')">
<LoadingSpinner v-if="loading"></LoadingSpinner>
<component

View File

@@ -22,7 +22,7 @@ const props = withDefaults(
const sizeClasses = {
small: 'text-xs px-2.5 py-1.5',
base: 'text-xs sm:text-sm px-3 py-2',
base: 'h-9 px-3 text-sm',
};
</script>

View File

@@ -25,7 +25,7 @@ const model = defineModel();
v-model="model"
:class="
twMerge(
'h-9 px-3 py-1 text-sm border-input-border border bg-input-background text-text-primary focus-visible:ring-2 focus-visible:ring-ring focus-visible:border-transparent rounded-md shadow-sm',
'h-9 px-3 py-1 text-base sm:text-sm border-input-border border bg-input-background text-text-primary focus-visible:ring-2 focus-visible:ring-ring focus-visible:border-transparent rounded-md shadow-sm',
props.class
)
"

View File

@@ -262,7 +262,7 @@ useSelectEvents(
:enable-estimated-time="enableEstimatedTime"
@changed="updateProject"></TimeTrackerProjectTaskDropdown>
</div>
<div class="flex items-center @2xl:space-x-2 px-2 @2xl:px-4">
<div class="flex items-center space-x-1 @2xl:space-x-2 px-2 @2xl:px-4 shrink-0">
<TimeTrackerTagDropdown
v-model="currentTimeEntry.tags"
:create-tag

View File

@@ -498,16 +498,16 @@ const showCreateProject = ref(false);
</script>
<template>
<div v-if="projects.length === 0 && canCreateProject">
<template v-if="projects.length === 0 && canCreateProject">
<Button
:variant="props.variant"
:size="props.size"
:class="twMerge('w-full justify-start', props.class)"
@click="showCreateProject = true">
<PlusIcon class="w-4" />
<span>Add new project</span>
<span class="truncate">Add new project</span>
</Button>
</div>
</template>
<Dropdown v-else v-model="open" :close-on-content-click="false" :align="props.align">
<template #trigger>
<div class="flex items-center gap-1">