Vuetify: [Bug Report] text-xs-center not working properly

[FabioZanchi]

Environment

Vuetify Version: 2.0.11
Vue Version: 2.6.9
Browsers: Chrome 76.0.3809.132
OS: Windows 10

Steps to reproduce

The class text-xs-center is not working properly and the text-align:left is applied instead of center.

Expected Behavior

Text aligned to the center

Actual Behavior

Text aligned to the left

Reproduction Link

https://codepen.io/fabiozanchi/pen/ZEzKRNQ

[ibrahimBeladi]

text-xs-center changed into text-center.
It is written in v2.0.0.

Most "breakpointed" and "non-breakpointed" helpers have been normalised, eg. .text-xs-center is now text-center as it applies to all screen widths unless overridden

[FabioZanchi]

text-xs-center changed into text-center.
It is written in v2.0.0.

Most "breakpointed" and "non-breakpointed" helpers have been normalised, eg. .text-xs-center is now text-center as it applies to all screen widths unless overridden

Thank you for your reply.

I saw that but it's also written that There are also available alignment classes that support responsive displays. but it looks like the xs is missing:

<template>
  <div>
    <p class="text-left">Left aligned text on all viewport sizes.</p>
    <p class="text-center">Center aligned text on all viewport sizes.</p>
    <p class="text-right">Right aligned text on all viewport sizes.</p>

    <p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p>
    <p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p>
    <p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p>
    <p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>
  </div>
</template>

https://vuetifyjs.com/en/styles/text

[Bbansjkl]

I saw that but it's also written that There are also available alignment classes that support responsive displays. but it looks like the xs is missing:

That is because you don't really need it.

the breakpointed helpers are applied when the viewport is larger than the minimum as defined at https://vuetifyjs.com/en/customization/breakpoints.

Since the minimum of xs is 0, it would apply to everything 0 and greater, or "all viewport sizes" unless overridden by one of the other classes, when the viewport is at least as large as that breakpoint.

So text-center and text-xs-center would do the same thing, so one of them was omitted.

[FabioZanchi]

Got it...

It would make more sense to keep the text-xs-center and remove the text-center if everything else is using the responsive sizes (sm, md, lg and xl) but I understood what you are saying.

Thank you @jacekkarczmarczyk