feat(front) : ajustements layout maquette (sidebar, marges, titres)

- sidebar deplie a 232px (repli 72px conserve)
- marge horizontale du contenu responsive, 170px des xl (1280px)
- gap navbar -> contenu de 47px
- composant partage PageHeader (titre 32px/600, marge basse 44px, slot actions)
- migration des 6 pages vers PageHeader, suppression des marges hautes redondantes
This commit is contained in:
2026-05-27 17:41:12 +02:00
parent 7c2e570fa0
commit 0a5ac61957
8 changed files with 46 additions and 47 deletions
@@ -1,13 +1,9 @@
<template>
<div>
<div class="flex items-center justify-between">
<h1 class="text-xl font-bold text-primary-500 sm:text-2xl">
{{ t('admin.auditLog.title') }}
</h1>
</div>
<PageHeader>{{ t('admin.auditLog.title') }}</PageHeader>
<!-- Filtres -->
<section class="mt-4 rounded border border-gray-200 bg-white p-4">
<section class="rounded border border-gray-200 bg-white p-4">
<!-- Labels uniformes au-dessus : les composants Malio sont utilises sans
leur `label` flottant interne pour ne pas mixer deux patterns de label.
A revoir une fois le composant calendar Malio développé -->
+12 -14
View File
@@ -1,22 +1,20 @@
<template>
<div>
<!-- En-tete -->
<div class="flex items-center justify-between">
<h1 class="text-xl font-bold text-primary-500 sm:text-2xl">
{{ t('admin.roles.title') }}
</h1>
<MalioButton
v-if="can('core.roles.manage')"
:label="t('admin.roles.newRole')"
icon-name="mdi:add-bold"
icon-position="left"
@click="openCreateDrawer"
/>
</div>
<PageHeader>
{{ t('admin.roles.title') }}
<template #actions>
<MalioButton
v-if="can('core.roles.manage')"
:label="t('admin.roles.newRole')"
icon-name="mdi:add-bold"
icon-position="left"
@click="openCreateDrawer"
/>
</template>
</PageHeader>
<!-- Table des roles -->
<MalioDataTable
class="mt-6"
:columns="columns"
:items="roleItems"
:total-items="roles.length"
+1 -7
View File
@@ -1,15 +1,9 @@
<template>
<div>
<!-- En-tete -->
<div class="flex items-center justify-between">
<h1 class="text-xl font-bold text-primary-500 sm:text-2xl">
{{ t('admin.users.title') }}
</h1>
</div>
<PageHeader>{{ t('admin.users.title') }}</PageHeader>
<!-- Table des utilisateurs -->
<MalioDataTable
class="mt-6"
:columns="columns"
:items="userItems"
:total-items="users.length"