How can I change CSS style during development in Eclipse?

Flow
1

Hi all

I’m trying to set a CSS style on a label component. I have a MainLayout (derived from bookstore example):

@JsModule("@vaadin/vaadin-lumo-styles/presets/compact.js")
@Theme(value = Lumo.class)
@CssImport(value = "./styles/shared-styles.css", themeFor = "vaadin-grid")
@CssImport("./styles/shared-styles.css")
public class MainLayout extends AppLayout implements RouterLayout {
...}

And I try to create a Label:

Label label=new Label();
label.addClassName("klasse");

And I’ve added to shared-styles.css:

.klasse {
	cursor: pointer;
}

But it seems kind of nondeterministic if changes to shared-styles.css work. If I run from eclipse IDE, changes to css don’t seem to work. If I run a mvn package before, changes seem to work, but DnD will be broken again. And if I run mvn package -Pproduction (before I run from Eclipse), everything seems fine.

Do I really have to run mvn package -Pproduction before I run in Eclipse?

Or am I doing something wrong?

Thank you for your help!

Marcus.

2

Hi Markus,

Unfortunately I can’t help with your Eclipse issue but I wanted to point out that you’ll probably want to place your grid styles in a separate file:

@CssImport(value = "./styles/grid-styles.css", themeFor = "vaadin-grid")
@CssImport("./styles/shared-styles.css")