Bakery App - response login page

Hi,

I am trying to recreate a similar login page that the Bakery App uses, but using Vaadin rather than pure HTML.

I see the HTML has DIV tags etc which i cannot create in Vaadin (server side).

I have managed to get the layout correct using HorizontalLayout, but when you reduce the size of the browser, it doesn’t behave the same as the nice Bakery Login HTML page.

Is it possible to re-create the same output and behaviour using Server side only? When i did this, even the background image is lost and the logo remains to the left (as its a Horizontal Layout, i assume)

See attached:-

34107.png
34108.png
34109.png
34110.png

Hi,

check out the Responsive themes chapter in the docs:
https://vaadin.com/docs/-/part/framework/themes/themes-responsive.html,
that might have some options.

Best regards,

Olli