Пользовательские классы vue-tabs-component

Я пытаюсь использовать Vue-tabs-component с Tailwindcss.

Речь идет о компоненте https://github.com/spatie/vue-tabs-component. Я реализовал его, однако при использовании классов с Tailwind никакие стили не действуют, компонент кажется привязанным к классам, с которыми компилируется.

Вот что у меня есть:

<template>
  <section class = "flex h-screen w-screen uppercase shadow leading-loose">
    <section id = "large-header" class = "relative w-full overflow-hidden bg-cover bg-center gradient-background">
      <canvas id = "demo-canvas"></canvas>

      <section class = "flex flex-wrap w-full max-w-xs p-4 absolute m-0 bg-white shadow content">
        <tabs class = "flex justify-center inline-flex border-b w-full pt-2">
          <tab name = "signIn" class = "uppercase text-grey-darker text-lg border-b border-transparent hover:border-grey-darker pb-4" style = "outline:none">
            <SignIn />
          </tab>
          <span class = "pr-8"></span>
          <tab name = "signUp" class = "uppercase text-grey-darker text-lg border-b border-transparent hover:border-grey-darker pb-4" style = "outline:none">
            <SignUp />
          </tab>
        </tabs>

        <section v-if = "authUser">
          <h2 class = "text-5xl">Signed in as {{ authUser.email }}</h2>
          <button @click='signOut'></button>
        </section>
      </section>
    </section>
  </section>
</template>

<script>
import SignIn from '@/components/Forms/SignIn'
import SignUp from '@/components/Forms/SignUp'
import {Tabs, Tab} from 'vue-tabs-component';

export default {
  components: {
    SignIn,
    SignUp,
    Tabs,
    Tab
  },
  data: function () {
    return {
      authUser: null
    }
  },
  methods: {
    signOut () {
      firebase.auth().signOut()
    },
    created () {
      firebase.auth().onAuthStateChanged(user => { this.authUser = user })
    }
  }
}
</script>


<style scoped>
.gradient-background {
  background: #0f0c29;
  background: -webkit-linear-gradient(to right, #24243e, #302b63, #0f0c29);
  background: linear-gradient(to right, #24243e, #302b63, #0f0c29);

  /* background: #093028;
  background: -webkit-linear-gradient(to right, #237A57, #093028);
  background: linear-gradient(to right, #237A57, #093028); */
}

.content {
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  color: #F9F1E9;
  top: 50%;
  left: 50%;
}
</style>

Вот каким я хочу, чтобы конечный результат был

и когда я добавляю вкладки (код выше), я получаю это

Любая помощь приветствуется.