Disable dialog open/close animation ?

[april]

Hi,
Is there a way to remove the animation when a dialog is opened by calling the Dialog.create() function and when it closes as well?
-april

[rstoenescu]

Use the name prop and set it to something bogus.

[april]

@rstoenescu
I’m not sure if I’m missing something. There’s no “name” prop on the Dialog component. How can I set it?

[s.molinari]

I think Razvan means the “name” prop for the transition itself, which is a child component of modal, which is used in the dialog component.

Scott

[april]

That’s not confusing at all, is that? :)) I’m still new to Vue and not sure how to do that, but I will try to work it out myself.

My current hack is overriding the following css in the parent component of the dialog so the animation is less.

 .modal, .modal-content {
        transition: all 0.02s linear;
  }

Would be nice to be able to customise all animation in the framework.

Thank you for your response!

[april]

I think a better place to put my overriding css is in the themes/app.mat.styl or themes/app.ios.styl
E.g.

// This file is included in the build if src/main.js imports it.
// Otherwise the default Material CSS file is bundled.
// Check "DEFAULT / CUSTOM STYLE" in src/main.js

// App Shared Variables
// --------------------------------------------------
// Shared Stylus variables go in the app.variables.styl file
@import 'app.variables'

// App Material Design Variables
// --------------------------------------------------
// Material Design only Stylus variables can go here
// http://quasar-framework.org/api/css-stylus-variables.html

$typography-font-family     ?= 'Roboto'

$toolbar-color              ?= white
$toolbar-background         ?= $primary
$toolbar-active-color       ?= $primary
$toolbar-faded-color        ?= composite-color($primary)

// Quasar Material Design Stylus
// --------------------------------------------------
// Custom App variables must be declared before importing Quasar.
// Quasar will use its default values when a custom variable isn't provided.
@import '~quasar-framework/dist/quasar.mat.styl'

// MY OVERRIDING CSS
// --------------------------------------------------
.modal, .modal-content
  transition none

[cityboy]

<q-dialog  transition-show="none" transition-hide="none" 
v-model="loadingDialog" persistent maximized></q-dialog>