Modal layout

  • I have been trying to get may way around in Quasar, and the bast way is still just to make some code :-)

    I need to have a modal for my layout (not all pages need login), and I tried to see if I could make a nice looking modal, using the q-layout as suggested in the docs, but then things got strange.

    When making a normal q-modal with some html inside, it works but was not pretty, then I tried to put a q-layout inside, and then … it became invisible. It disables the background, it has inserted all the proper things in the dom tree, but I cant see them.

    Need I do something special to use a q-layout inside a q-modal

    PS: where are all the nice demos in the doc ?

  • @s.molinari Yes, it was not there yesterday :-) I am happy to see it back and working again.

  • Admin

    @druppy It wasn’t removed at all :)

  • @rstoenescu Scary ! :-) I just discovered that the page is responsive … :-)

  • @druppy To answer my own post, when making a modal that holds another q-layout tag inside, the q-modal need to specify a size of the modal, using content-css property.

    I am sure there is some logic to that, but not in my head at the moment :-)

  • According to the docs thecontent-cssproperty

    Applies CSS style Object to Modal container.

    So, probably without it, the modal can’t be rendered.

    However, I too am wondering how that property is used. It looks like some Quasar magic? :smile:


  • @s.molinari I think q-layout uses 100% of parent, and parent i as big as the child dictates … and then both got confused :-)

    content-css just apply the style to the div modal wrapper, so no real magic .

Log in to reply

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.