Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.


Thomas Älgevik
6 years ago Mar 28, 2017 2:55pm
Alejandro C De Baca
6 years ago Mar 28, 2017 3:44pm

I think you may be setting the variables too late in your SCSS file. The heights in the keyframes should include both variables, $v-loading-indicator-bar-height as well as $v-loading-indicator-bar-height--wait, and I don't see "35px" anywhere in the keyframes in your post.

Can you confirm that you are setting them in your theme's scss file before the theme mixin definition? For example:

@import "../valo/valo.scss";

// SCSS Variable assignments go here 
$v-loading-indicator-bar-height: 35px;
$v-loading-indicator-bar-height--wait: 35px;

@mixin mytheme {
  @include valo;

  // Other stuff goes here

  -- AC

Thomas Älgevik
6 years ago Mar 28, 2017 3:47pm