Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug Report] Class elevation less than 2 doesn't work #6098

Closed
realtoptuk opened this issue Jan 10, 2019 · 6 comments
Closed

[Bug Report] Class elevation less than 2 doesn't work #6098

realtoptuk opened this issue Jan 10, 2019 · 6 comments
Assignees
Labels
T: enhancement Functionality that enhances existing features T: regression Something that used to work but we broke
Milestone

Comments

@realtoptuk
Copy link

Versions and Environment

Vuetify: 1.4.1
Last working version: 1.3.15
Vue: 2.5.21
Browsers: Chrome 71.0.3578.98
OS: Linux x86_64

Steps to reproduce

Use card component with class elevation-1 or elevation-0

Expected Behavior

With elevation-0 there should not be box-shadow.

Actual Behavior

With elevation-0 there box-shadow from elevation-2 class.

Reproduction Link

https://codesandbox.io/embed/pjrmp4vrp0

@KaelWD
Copy link
Member

KaelWD commented Jan 10, 2019

Seems like you have to use the elevation prop now instead, because cards use class="elevation-2" internally if it's not set. @johnleider

@KaelWD KaelWD added T: regression Something that used to work but we broke maybe Functionality that we are considering labels Jan 10, 2019
@DmytroDiachuk
Copy link

My all v-cards with class="elevation-0" (<v-card class="elevation-0">) started to show shadows after updating from 1.3.15 to 1.4.2.

@DmytroDiachuk
Copy link

DmytroDiachuk commented Jan 21, 2019

Seems like you have to use the elevation prop now instead, because cards use class="elevation-2" internally if it's not set. @johnleider

It must works according documentation https://vuetifyjs.com/en/framework/elevation (Current playground does not work correct now v1.4.2)

The elevation helpers allow you to control relative depth, or distance, between two surfaces along the z-axis. There is a total of 25 elevation levels. You can set an element's elevation by using the class elevation-{n}, where n is a integer between 0-24 corresponding to the desired elevation.

If I use "elevation-0 or elevation-1" my v-card must change shadows. It was good, but not now!

@aburai
Copy link

aburai commented Jan 21, 2019

@DmytroDiachuk

<v-card class="pa-3" elevation="0"> <HelloWorld /> </v-card>
or just
<v-card class="pa-3" flat> <HelloWorld /> </v-card>

it works this way, playground must be updated

@DmytroDiachuk
Copy link

DmytroDiachuk commented Jan 22, 2019

Helper class "elevation-n" n=[0..24] must have the same behavior for all elements same, where I can add shadows. For Example "elevation-1":
<v-btn class="elevation-1"></v-btn>
<div class="elevation-1></div>
<v-card class="elevation-1></v-card> - not working

@aburai, Why VCard must be exclusion?? I don't understand this conception...

@aburai
Copy link

aburai commented Jan 22, 2019

@DmytroDiachuk i don't know, i just search for a solution

@johnleider johnleider self-assigned this Jan 22, 2019
@johnleider johnleider added T: enhancement Functionality that enhances existing features and removed maybe Functionality that we are considering labels Jan 22, 2019
@johnleider johnleider added this to the v1.4.x milestone Jan 22, 2019
@lock lock bot locked as resolved and limited conversation to collaborators Jan 24, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
T: enhancement Functionality that enhances existing features T: regression Something that used to work but we broke
Projects
None yet
Development

No branches or pull requests

5 participants