Dialog height is broken in 12.0.0beta1 + 2

[martinisraelsen]

Starting from Vaadin 12.0.0alpha4 the dialog is not at full height in the Bakery app.

[alvarezguille]

Thanks @martinisraelsen for reporting this, I moved the issue to the starter project. We'll take a look and post a solution here

[alvarezguille]

The fix for this styling issue that is compatible with Vaadin 11+ is to do the following styles changes in shared-styles.html Change flex: 1; to height: 100vh; for [part="overlay"]

In a fresh downloaded full stack starter with Vaadin 11 the lines changes are

• Lines 40-44 from:

    :host([theme="left"]) [part="overlay"],
    :host([theme="right"]) [part="overlay"] {
      flex: 1;
      max-width: 45em;
    }

  to:

    :host([theme="left"]) [part="overlay"],
    :host([theme="right"]) [part="overlay"] {
      height: 100vh;
      max-width: 45em;
    }

• Lines 60-64 from:

      :host([theme]) [part="overlay"] {
        flex: 1;
        width: 100%;
        border-radius: 0 !important;
      }

  to:

      :host([theme]) [part="overlay"] {
        height: 100vh;
        width: 100vw;
        border-radius: 0 !important;
      }

[martinisraelsen]

@alvarezguille yep that solved it!