Vuetify: hidden-{size}-only classes are not working

[tdmichaelis]

Steps to reproduce

Use any of the hidden-{size}-only classes on DOM elements to hide the elements on specific viewport sizes

Versions

Vue 2.3.3
Vuetify 13.1
MacOS Sierra version:10.12.5 (16F73)
Chrome 59.0.3071.115 (Official Build) (64-bit)

What is expected ?

Elements should be hidden based on the hidden-{size}-only classes

What is actually happening ?

Only the xsmall and xlarge hidden classes are working

Reproduction Link

https://codepen.io/tdmichaelis/pen/qjQoVL
Resize the browser to the different viewport sizes and notice that only the xsmall and xlarge classes work...

[johnleider]

I see your PR, I'm not sure I agree with having these extra classes.

edit. It appears this exists within the documentation, I was not aware. Looks like someone is about to be in trouble!

[tdmichaelis]

What do you mean?? https://vuetifyjs.com/layout/display
You already have them they just don't work. I only added the hidden-sm-only class. I thought it made sense because the others were already there and that was the first one I needed in my code and it did not exist which made me try the others

[johnleider]

Yea, I just realized that it is in the documentation, I was not aware honestly, probably my fault.

[tdmichaelis]

haha, np

[johnleider]

Yup, blame says it was me, gotta stop drinking at night...

[johnleider]

Merged in your PR, tyvm, sorry for the confusion.

[tdmichaelis]

np, thanks for the quick response and for vuetify!

[benmcm1994]

I believe this is still bugged. Getting weird/no displays at certain breakpoints. I believe class="hidden-lg-and-down" should only show my element when the device is xtra large i.e. hide on xs,sm,md and lg but its displayed at every size.

[johnleider]

@benmcm1994 If you have a reproduction please create a new issue at https://issues.vuetifyjs.com . Thank you!