<div class="container">
  <div class="control" v-show="menuState" @click="toggleMenu">
    S/H MENU
  </div>
  <nav class="menu">
    <ul>
      <li>About</li>
      <li>Services</li>
      <li>Contact us</li>
    </ul>
  </nav>
  <div class="content">
    CONTENT
  </div>
</div>

body{
  margin: 0;
  padding: 0;
}

ul, li{
  list-style: none;
  margin: 0;
  padding: 0;
}
.container{
  display: flex;
  color: #ffffff;
  height: 100vh;
  .control{
    padding: 10px;
    background-color:  #3882aa;
    cursor: pointer;
    
    &__noactive {
      display: none;
    }
  }
  .menu{
    padding: 10px;
    background-color:  #3ccfd3;
    cursor: pointer;
  }
  .content{
    padding: 10px;
    background-color:  #aaefd9;
    cursor: pointer;
    width: 25%;
  }
}

new Vue({
  el: ".container",
  data: {
    menuState: true
  },
  methods: {
    toggleMenu() {    
      this.menuState = !this.menuState
    }
  }
})