App.vue
<template>
<div :class="{ 'full-height': $route.name == 'Home' || openDropdown }" id="app">
<div ref="progress" v-if="progress" class="progress"></div>
<header class="header">
<div class="container">
<div class="header__row">
<router-link to="/">
<img src="@/assets/img/logo.svg" alt="Triangle" />
</router-link>
<nav class="menu hidden">
<li class="menu__item">
<router-link to="/" class="menu__link" active-class="active" exact>Home</router-link>
</li>
<li class="menu__item">
<router-link to="/news" class="menu__link" active-class="active">News</router-link>
</li>
<li class="menu__item">
<router-link to="/musics" class="menu__link" active-class="active">Musics</router-link>
</li>
<li class="menu__item">
<router-link to="/media" class="menu__link" active-class="active">Media</router-link>
</li>
</nav>
</div>
</template>
<script>
export default {
data() {
return {
animSpectrs: true,
openDropdown: false,
userStopBgAudio: false,
showScrollBtn: false,
progress: true
};
}
};
</script>
Средний
