50 lines
853 B
Vue
50 lines
853 B
Vue
<!-- Bouton hamburger (panneau latéral droit, 35 px) -->
|
|
<template>
|
|
<div class="menu-toggle">
|
|
<button class="hamburger" aria-label="Menu" @click="$emit('toggle')">
|
|
<span />
|
|
<span />
|
|
<span />
|
|
</button>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineEmits<{ toggle: [] }>();
|
|
</script>
|
|
|
|
<style scoped>
|
|
.menu-toggle {
|
|
width: 35px;
|
|
flex-shrink: 0;
|
|
background: #0c0c10;
|
|
border-left: 1px solid #1a1a22;
|
|
display: flex;
|
|
justify-content: center;
|
|
padding-top: 12px;
|
|
}
|
|
|
|
.hamburger {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 6px;
|
|
background: none;
|
|
border: none;
|
|
cursor: pointer;
|
|
padding: 4px;
|
|
}
|
|
|
|
.hamburger span {
|
|
display: block;
|
|
width: 18px;
|
|
height: 2px;
|
|
background: #3a3a55;
|
|
border-radius: 1px;
|
|
transition: background 0.15s;
|
|
}
|
|
|
|
.hamburger:hover span {
|
|
background: #6666aa;
|
|
}
|
|
</style>
|