Vue Router support for v-toolbar-title

The majority of websites allow the user to click on the website title / logo to navigate to the homepage. I tried to implement this with Vuetify but <v-toolbar-title> doesn’t seem to support the Vue Router attribute to="<path>" as other components do. I’ve noticed that the Vuetify website also implements this behavior, however, its only possible to click the logo.

An example Codepen of this I’ve tried nesting another component in v-toolbar-title which can hold a to attribute but that causes the title to loose its CSS properties.

[drew-royster]

Johns solution is awesome just add toolbar-title as the class for the router-link and the following css

.toolbar-title {
  color: inherit;
  text-decoration: inherit;
}

[tobias74]

as it seems the classname has changed to

.v-toolbar__title {
   color: black;
   text-decoration: none;
 }

I do have to apply the color and the text-decoration explicitly though. ‘Inherit’ will keep the blueish-link-color of the router-link

Maybe this could be more elegantly solved within the framework by offering a “:to” on the v-toolbar-title as suggested by the original poster?