NUXT_FRONTEND/components/Header/Top.vue

<template>
  <div class="header__top">
    <v-skeleton-loader v-show="!loaded" class="ad-skeleton" type="image"></v-skeleton-loader>
    <div class="header-top section" v-show="isMobile() && loaded">
      <div class="header-top__wrapper section-wrapper section-wrapper_extra">
        <div class="header-top__banner">
          <!--<AdsTopBanner/>-->
          <BannersHeader/>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data(){
    return{
      width: null,
      ismainpage: false,
      loaded: false
    }
  },
  created(){
    if (process.browser){
      this.width = window.innerWidth;
    }
  },
  mounted(){
    this.loaded = true;
  },
 methods: {
  isMobile () {
    if (this.$route.path != '/') {
      return true;
    }
    else {
      if( this.width <= 576 ) {
          return false;
      }
      else {
          return true;
      }
    }
  }
 }
};
</script>

<style>
.header-top__banner {
  display: flex;
  justify-content: center;
}
.ad-skeleton {
  max-width: 900px;
  margin: auto;
}
@media all and (max-width: 576px) {
  .ad-skeleton {
    max-width: 300px;
    height: 250px;
    display: none;
  }
}
</style>