fix: drawer footer (#57)

| Numéro du ticket | Titre du ticket |
|------------------|-----------------|
|                  |                 |

## Description de la PR

## Modification du .env

## Check list

- [x] Pas de régression
- [x] TU/TI/TF rédigée
- [x] TU/TI/TF OK
- [x] CHANGELOG modifié

---------

Co-authored-by: THOLOT DECHENE Matthieu <matthieu@yuno.malio.fr>
Co-authored-by: matthieu <matthieu@yuno.malio.fr>
Reviewed-on: #57
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

app/components/malio/drawer/Drawer.test.ts

@@ -152,12 +152,13 @@ describe('MalioDrawer', () => {
     expect(wrapper.find('[data-test="header"]').classes()).toContain('bg-m-primary')
   })
 
-  it('renders the #footer slot inside the body (scrollable zone)', () => {
+  it('renders the #footer slot in a footer pinned below the body', () => {
     const wrapper = mountComponent(
       { modelValue: true },
       { footer: '<button data-test="save">Enregistrer</button>' },
     )
-    expect(wrapper.find('[data-test="body"] [data-test="footer"] [data-test="save"]').exists()).toBe(true)
+    expect(wrapper.find('[data-test="body"] [data-test="footer"]').exists()).toBe(false)
+    expect(wrapper.find('[data-test="footer"] [data-test="save"]').exists()).toBe(true)
   })
 
   it('does not render the footer wrapper when no #footer slot', () => {
@@ -170,14 +171,12 @@ describe('MalioDrawer', () => {
     expect(wrapper.find('[data-test="body"]').classes()).toContain('px-10')
   })
 
-  it('applies footerClass to the footer wrapper', () => {
+  it('applies footerClass to the footer', () => {
     const wrapper = mountComponent(
-      { modelValue: true, footerClass: 'sticky bottom-0' },
+      { modelValue: true, footerClass: 'justify-end' },
       { footer: '<span>pied</span>' },
     )
-    const footer = wrapper.find('[data-test="footer"]')
-    expect(footer.classes()).toContain('sticky')
-    expect(footer.classes()).toContain('bottom-0')
+    expect(wrapper.find('[data-test="footer"]').classes()).toContain('justify-end')
   })
 
   it('aligns to the right by default', () => {

app/components/malio/drawer/Drawer.vue

@@ -64,13 +64,13 @@
             data-test="body"
           >
             <slot />
-            <div
-              v-if="$slots.footer"
-              :class="footerClass"
-              data-test="footer"
-            >
-              <slot name="footer" />
-            </div>
+          </div>
+          <div
+            v-if="$slots.footer"
+            :class="twMerge('flex shrink-0 items-center gap-3 px-5 py-4', footerClass)"
+            data-test="footer"
+          >
+            <slot name="footer" />
           </div>
         </div>
       </div>