Cacher is the code snippet organizer for pro developers

// Boolean in your template would look like this - <nav class="navigation__inner" :class="{'navigation__inner--sticky': sticky}">

export default {
  name: 'Navigation',
  data() {
    return {
      sticky: false
    };
  },
  methods: {
    stickyNav() {
      const stickNav = document.getElementById('navigation');
      const stickNavY = stickNav.getBoundingClientRect().y;

      window.addEventListener('scroll', () => {
        const currentPos = document.documentElement.scrollTop || document.body.scrollTop;
        if (currentPos > stickNavY) {
          this.sticky = true;
        } else {
          this.sticky = false;
        }
      });
    }
  },
  mounted() {
    this.stickyNav();
  }
};