CODEWITHSUNDEEP
vaadin7
Alexei
Alexei

Reputation: 15646

Why not apply custom style css?

In my web project I use Vaadin 7.3.6.

My custom css file is here:

myproject\src\main\resources\VAADIN\themes\non.print.component.css

In non.print.component.css

@media print {
.noPrint {
    display:none;
  }
}

In my code I use this:

import com.vaadin.ui.Button;
Button myButton = new Button("My custom button");
myButton.setStyleName("noPrint");

But it's not work. When I print current page, the myButton also print.

Upvotes: 0

Views: 50

Answers (1)

Sebastien Libert
Sebastien Libert

Reputation: 83

Your css file will not be used by the Vaadin UI until you do not declare it or include it in your custom theme. The best way is to create your custom theme, then you'll have to :

  • Add theme annotation to your UI class -> @Theme("mytheme")
  • Create a folder 'myproject\src\main\resources\VAADIN\themes\mytheme'
  • Put your css / scss stuff there

Please check basics of theming vaadin7 at : https://vaadin.com/docs/v7/framework/themes/themes-css.html

You do not want to create a theme, two solutions :

  • Put the CSS file in the src/main/webapp/VAADIN/* directory and use @StyleSheet("vaadin://style.css").
  • Put the css file in the src/main/resources/com/example/demo/ directory and use @StyleSheet("style.css"). (credits to Alejandro Duarte in offical Vaadin Forum)

Regards Sebastien

Upvotes: 1

Related Questions