MALIO-DEV/Lesstime
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 32 Wiki Activity

refactor(frontend) : make page headers and filters sticky across all pages

Browse Source 
Wrap title + filters in a sticky container (top-8 sm:top-12, z-20, bg-white)
on all pages for consistent scroll behavior. Also fix SidebarTimer icon
visibility when sidebar is collapsed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
THOLOT DECHENE Matthieu
2026-03-14 09:21:45 +01:00
parent b48ca10304
commit f888a29e0a
17 changed files with 429 additions and 358 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/pages/projects/index.vue
View File

@@ -1,28 +1,31 @@
<template>
<div>
<div class="flex items-center justify-between">
<h1 class="text-2xl font-bold text-primary-500">Projets</h1>
<div class="flex items-center gap-3">
<button
class="flex items-center gap-1.5 rounded-md px-3 py-2 text-sm font-medium transition"
:class="showArchived
? 'bg-amber-100 text-amber-700 hover:bg-amber-200'
: 'text-neutral-500 hover:bg-neutral-100 hover:text-neutral-700'"
@click="toggleArchived"
>
<Icon :name="showArchived ? 'mdi:archive-arrow-up-outline' : 'mdi:archive-outline'" size="18" />
{{ showArchived ? $t('projects.hideArchived') : $t('projects.showArchived') }}
</button>
<button
class="rounded-md bg-primary-500 px-4 py-2 text-sm font-semibold text-white hover:bg-secondary-500"
@click="openCreate"
>
+ Ajouter un projet
</button>
<div class="sticky top-8 z-20 bg-white pb-4 sm:top-12">
<div class="flex flex-wrap items-center justify-between gap-3">
<h1 class="text-xl font-bold text-primary-500 sm:text-2xl">Projets</h1>
<div class="flex items-center gap-2 sm:gap-3">
<button
class="flex items-center gap-1.5 rounded-md px-2 py-2 text-sm font-medium transition sm:px-3"
:class="showArchived
? 'bg-amber-100 text-amber-700 hover:bg-amber-200'
: 'text-neutral-500 hover:bg-neutral-100 hover:text-neutral-700'"
@click="toggleArchived"
>
<Icon :name="showArchived ? 'mdi:archive-arrow-up-outline' : 'mdi:archive-outline'" size="18" />
<span class="hidden sm:inline">{{ showArchived ? $t('projects.hideArchived') : $t('projects.showArchived') }}</span>
</button>
<button
class="shrink-0 rounded-md bg-primary-500 px-3 py-2 text-xs font-semibold text-white hover:bg-secondary-500 sm:px-4 sm:text-sm"
@click="openCreate"
>
<span class="hidden sm:inline">+ Ajouter un projet</span>
<span class="sm:hidden">+ Projet</span>
</button>
</div>
</div>
</div>
<div class="mt-6 grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
<div class="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
<div
v-for="project in projects"
:key="project.id"