talent_map/pc/components/layout/main-nav.vue

<template>
    <nav>
        <div class="header-nav ">
            <div class="nav-wrap flex">
            </div>
        </div>
    </nav>
</template>

<script>
import { mapState } from 'vuex'
export default {
    components: {
    },
    created() {},
    computed: {
        // ...mapState(['publicData']),
    },
}
</script>

<style lang="scss" scoped>
.header-nav {
    border-top: 1px solid $--background-color-base;
    .nav-wrap {
        // width: 1180px;
        margin: 0 auto;
    }
    .nav {
        overflow-x: auto;
        overflow-y: hidden;
        .item {
            a {
                padding: 12px 15px;
                margin: 0 10px;
                color: #101010;
                font-size: 16px;
                white-space: nowrap;
                &:hover {
                    color: $--color-primary;
                }
                &.nuxt-link-exact-active {
                    color: $--color-primary;
                }
            }
        }
    }
}
</style>