<script lang="ts">
import SearchBar from './SearchBar.vue'
import LanguageSwitcher from './LanguageSwitcher.vue'
export default {
  components: {
    SearchBar,
    LanguageSwitcher
  }
}
</script>

<template>
  <div class="p-4 flex items-center justify-between bg-ctp-base text-white">
    <router-link to="/">
      <h1 class="font-bold text-2xl">Safe<color class="text-purple-500">Twitch</color></h1>
    </router-link>

    <div>
      <search-bar></search-bar>
    </div>

    <ul class="inline-flex space-x-6 font-medium">
      <a href="https://codeberg.org/dragongoose/safetwitch">{{ $t('nav.code') }}</a>
      <router-link to="/privacy">{{ $t('nav.privacy') }}</router-link>
      <language-switcher></language-switcher>
    </ul>
  </div>
</template>
