O'Reilly logo

Vaadin 7 Cookbook by Ondrej Kvasnovsky, Jaroslav Holan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Customizing tray notifications

In this recipe, we will see how to make a tray notification with a custom design. When the user clicks on the Click me! button, the tray notification is shown in the top-right corner (instead of the default bottom-right corner).

Normally, the user has to click on the tray notification window in order to close it. We will change the default behavior, so the tray notification disappears immediately after the user moves with the cursor.

We also change the color of the tray notification from dark gray to light gray.

Customizing tray notifications

Getting ready

  1. First, create a new CSS file VAADIN/themes/mytheme/styles.scss.
  2. Then, create a new Vaadin project ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required