Center q-toolbar-title on beta v0.14.0

[coxy121]

On the beta v0.14.0 version of the framework is there is similar function to using :padding=“1” to center the q-toolbar-title if there is only 1 button on 1 side of the menu?

Currently the title is displayed off center.

The code I am using is:

<q-toolbar slot="header">
     <q-btn flat @click="goBack()">
         <q-icon name="arrow_back" />
     </q-btn>
     <q-toolbar-title>
         {{ this.$route.name }}
     </q-toolbar-title>
 </q-toolbar>

[benoitranque]

Have you tried

<q-toolbar slot="header">
     <q-btn flat @click="goBack()">
         <q-icon name="arrow_back" />
     </q-btn>
     <q-toolbar-title class="text-center">
         {{ this.$route.name }}
     </q-toolbar-title>
 </q-toolbar>

[coxy121]

@benoitranque yes, tried that, unfortunately it just centers the text to that element and doesn’t take in to consideration the space take from the button on the left, so the text is off center, see below.

On the previous version you could use :padding=“1” to resolve this on IOS, but I cannot find anything similar int he beta documentation currently.

[coxy121]

@rstoenescu is this possible to do anyway in v0.14 beta

[rstoenescu]

Put an invisible button after QToolbarTitle.

[coxy121]

Perfect thanks!