Where to put the style.css

Flow
1

Hey there, I have written the following code:

`package com.example.vaadin_chart2;

import com.vaadin.annotations.StyleSheet;
import com.vaadin.server.VaadinRequest;
import com.vaadin.spring.annotation.SpringUI;
import com.vaadin.ui.*;

@StyleSheet(“style.css”)

@SpringUI
public class ChartUI extends UI {
CssLayout layout;

@Override
protected void init(VaadinRequest vaadinRequest) {
    setupLayout();
}

private void setupLayout() {
    layout= new CssLayout();
    setContent(layout);

    Label l = new Label();
    l.addStyleName("Head");
    layout.addComponent(l);

    Button button = new Button("button");
    layout.addComponent(button);


}

}
`
I tried to include the css via the annotation, but i doesn’t work out (no black square). Somewhere I have read i should overwrite the css in the Vaadin directory, but i have no such directory in my source path. I have downloaded the project folder and dependencies from start.spring.io .

Here is the css, which is in the same directory as the java class :

.v-label-Head{
    width: 20px;
    height: 20px;
    color: black;
}

Greetings Julian

2

There are several options, for example:

  • 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”).

You might want to consider using a theme. This video might help: https://www.youtube.com/watch?v=USF35wZPxZk&index=1&list=PLcRrh9hGNaln3i0stypuu_hxQMXYy8eOU

3

Thanks for answering, but i cant find a webapp folder in my main folder…
Should i maybe use something else as start.spring.io to setup the project?

Or can i simply create the folder?

4

Creat it!

5

omg it’s working this is so cool (and easy) Thank you :slight_smile: