refactor(front) : composant PageHeader unifié + standardisation des titres
- Nouveau composant ui/PageHeader.vue : source unique du style des titres (30px / semi-bold / bleu malio), sticky avec masquage du scroll, slots #actions et #subheader (barres de filtres/onglets collées au titre) - Layout : marges <main> réduites (sm:px-6 lg:px-12 xl:px-11) + suppression du bloc-spacer sticky devenu inutile - ~17 pages migrées vers <PageHeader>, un seul pattern partout - Espacement titre -> contenu uniforme (30px), porté par le composant Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,15 +1,18 @@
|
||||
<template>
|
||||
<div class="flex flex-col gap-6">
|
||||
<div class="flex items-center justify-between">
|
||||
<h1 class="text-2xl font-bold text-neutral-900">{{ $t('absences.title') }}</h1>
|
||||
<MalioButton
|
||||
:label="$t('absences.newRequest')"
|
||||
icon-name="mdi:plus"
|
||||
icon-position="left"
|
||||
@click="requestDrawerOpen = true"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<PageHeader>
|
||||
{{ $t('absences.title') }}
|
||||
<template #actions>
|
||||
<MalioButton
|
||||
:label="$t('absences.newRequest')"
|
||||
icon-name="mdi:plus"
|
||||
icon-position="left"
|
||||
@click="requestDrawerOpen = true"
|
||||
/>
|
||||
</template>
|
||||
</PageHeader>
|
||||
|
||||
<div class="flex flex-col gap-6">
|
||||
<AbsenceBalanceCards :balances="balances" />
|
||||
|
||||
<!-- Filters -->
|
||||
@@ -65,6 +68,7 @@
|
||||
:can-cancel="selected?.status === 'pending'"
|
||||
@cancelled="reload"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
<template>
|
||||
<div class="flex flex-col gap-6">
|
||||
<h1 class="text-2xl font-bold text-neutral-900">
|
||||
<div>
|
||||
<PageHeader>
|
||||
{{ $t("absences.teamTitle") }}
|
||||
</h1>
|
||||
</PageHeader>
|
||||
|
||||
<div class="flex flex-col gap-6">
|
||||
<!-- KPIs -->
|
||||
<div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
|
||||
<div class="rounded-lg border border-neutral-200 bg-white p-4">
|
||||
@@ -189,6 +190,7 @@
|
||||
:user="selectedEmployee"
|
||||
@saved="loadEmployees"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user