creativetimofficial / ct-vuetify-material-dashboard-pro

Vuetify Material Dashboard Pro - Premium Admin Template
https://demos.creative-tim.com/vuetify-material-dashboard-pro
27 stars 6 forks source link

[Bug] base-material-card loses rounded corners and has different padding with Vuetify 2.1 #11

Closed subn3t closed 4 years ago

subn3t commented 4 years ago

Version

1.0.3

Reproduction link

https://demos.creative-tim.com/vuetify-material-dashboard-pro/#/

Operating System

Win 10

Device

PC

Browser & Version

Latest Chrome

Steps to reproduce

  1. npm update vuetify
  2. open dashboard

    What is expected?

    Dashboard looks the same

    What is actually happening?

    Dashboard does not look the same


Solution

Additional comments

mehdirochdi commented 4 years ago

look at src/components/base/Materialcard.vue add style="border-radius:6px" <v-sheet v-else :class="{ 'pa-7': !$slots.image }" :color="color" :max-height="icon ? 90 : undefined" :width="inline || icon ? 'auto' : '100%'" style="border-radius:6px" class="text-start v-card--material__heading mb-n6" dark>

marcpaskell commented 4 years ago

looks like the border radius is due to a change in 2.1.4 https://github.com/vuetifyjs/vuetify/commit/487ebfe5ad892685d650cf308fa30e494507936a

you could add in a variable override $sheet-border-radius: 4px;

nb. the only way I could get this to work was to rename main.scss to variables.scss and make the appropriate changes to vue.config.js

johnleider commented 4 years ago

this has been resolved for next release.