<template>
  <header class="bg-green-600 h-16 flex items-center fixed w-full z-50">
    <button 
      @click="$emit('menu-click')"
      class="ml-4 text-white p-2 md:hidden"
    >
      <Bars3Icon class="h-6 w-6" />
    </button>
    <div class="flex items-center flex-1">
      <router-link to="/" class="text-white text-2xl font-bold ml-4">
        Mangarr
      </router-link>
      <SearchBar />
    </div>
  </header>
</template>

<script setup>
import { Bars3Icon } from '@heroicons/vue/24/outline';
import SearchBar from './SearchBar.vue';

defineEmits(['menu-click']);
</script> 