<template>
  <v-app>
    <v-main>
      <TitleBar>
        <div v-html="title_html" />
      </TitleBar>
      <HelloWorld />
    </v-main>
  </v-app>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import HelloWorld from "./components/HelloWorld.vue";
import TitleBar from "./components/TitleBar.vue";

@Component({
  components: {
    HelloWorld,
    TitleBar,
  },
})
export default class App extends Vue {
  private title_html = "<h1>changeme</h1>";
}
</script>

<style lang="scss">
@import "@/assets/fonts.css";

// THW Logo font
.thw-logo-font {
  font-family: "Lubalin Graph", serif !important;
  font-weight: bold !important;
}

// THW Heading font
.thw-heading-font {
  font-family: "Neue Praxis", "Roboto", sans-serif !important;
}

// THW Text font
.thw-text-font {
  font-family: "Neue Demos", serif !important;
}

// THW Citation font
.thw-citation-font {
  font-family: "Neue Demos", serif !important;
  font-style: italic !important;
}
</style>
