Home > Blockchain >  how to capitalize first letter of translated v-date-picker in vuetify?
how to capitalize first letter of translated v-date-picker in vuetify?

Time:07-19

I need to know if there is any way to capitalize internalization of v-date-picker. I have managed to translate the days of week and months in v-date-picker in vuetify but I need to make the first letter capital. Any help would be appriciated. What I have made so far:

<v-date-picker :locale="translateDate"
        v-model="date"
        :max="new Date().toISOString().substr(0, 10)"
        @input="getDate"  />

...

translateDate() {
   let lang = this.$i18n.locale = this.$cookies.get('language')
   return lang
}

I have also this functions to capitalize that I can use:

capitalize(str) {
   return capitalizeFirstLetter(str);
}

function capitalizeFirstLetter(string) {
   return string.charAt(0).toUpperCase()   string.slice(1);
}

enter image description here

CodePudding user response:

You can achieve this using pure css. Take a loot at text-transform:

.v-date-picker-title__date,
.v-date-picker-header__value button {
   text-transform: capitalize;
}
  • Related