How to apply styling through setClassName() in Vaadin 14

Flow
1

I created a new project using the Spring Boot Technology stack.

I supplied my css definitions in frontend/styles/styles.css:

  .nice-background {
    background-color: #3b3f42;
    background-size: cover;
    width: 100%;
    height: 100%;
  }

This file was referenced in Application.java:

@CssImport("./styles/styles.css")
@SpringBootApplication
public class Application extends SpringBootServletInitializer {
    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);
    }
}

MainView.java was extended with a “setClassName” instruction:

@Route
@PWA(name = "Project Base for Vaadin Flow with Spring", shortName = "Project Base")
public class MainView extends VerticalLayout {
	public MainView(@Autowired MessageBean bean) {
        Button button = new Button("Click me springbootstarter",
                e -> Notification.show(bean.getMessage()));
        add(button);
        setClassName("nice-background");        
    }
}

Unfortunately the background was not affected at all.
This should be real basic, so I must have overseen something very simple.
Please help!

2

Move your @CssImport annotation from Application to the MainView class.

3

Yes, it works. Terrific!
Thank you soo much!