<template lang="html">
  <div id="{{id}}" data-cpt-type="cpt-navtab" class="cpt-navtab pure-menu-item pure-menu-selected">
    <a href="{{href}}" target="{{target}}" class="link pure-menu-link">
      <slot></slot>
    </a>
  </div>
</template>

<style lang="sass">
   @import "../../styles/core/base.scss";

  .cpt-navtab {
    display:inline-block;

    a.link.pure-menu-link{
      color:#fff;
      text-decoration:none;
      font-size:16px;

      &:hover{
        color:$navColor;
      }
    }
  }

</style>

<script>

export default {
  props:{
    id:String,
    href:{
      type:String,
      default:'javascript:void 0',
    },
    target:{
      type:String,
      default:'_blank'
    }
  },
  data: function () {
    return {
    }
  },
  computed: {},
  ready: function () {},
  attached: function () {},
  methods: {},
  components: {}
}
</script>
