<template>
  <!--顶部栏-->
  <el-header
    class="layout-header font-color main-color-bg wow animate__animated animate__fadeInDownBig"
    data-wow-duration=".5s"
    data-wow-delay=".3s"
  >
    <!--折叠按钮-->
    <HeaderCollapse />
    <!--面包屑-->
    <HeaderBreadcrumb />
    <!--顶部导航栏-->
    <HeaderNavBar />
  </el-header>
</template>

<script lang="ts" setup>
import HeaderCollapse from './components/HeaderCollapse.vue'
import HeaderBreadcrumb from './components/HeaderBreadcrumb.vue'
import HeaderNavBar from './components/HeaderNavbar/index.vue'
// import { useThemeStore } from '@/store/theme'
// import { storeToRefs } from 'pinia'

// const themeStore = useThemeStore()
// const { mainColor, fontColor } = storeToRefs(themeStore)
</script>

<style scoped lang="scss">
.layout-header {
  padding-left: 0;

  //background: v-bind(mainColor);
  //color: v-bind(fontColor);
  @include flexRow;
}
</style>
