Hi,
Can anyone tell me how to make border of gridLayout darker?
I mean i have to highlight the border of each cell to make the cell block more visible.
Thanks.
D.
You should specify your own css theme. Something like that :
@mixin vaadinempty {
/* Include all the styles from the reindeer theme */
@include reindeer;
.v-gridlayout-slot {
border-style: solid;
border-width: 1px;
border-color: black;
}
}
Where instead of “vaadinempty” use your theme. This link might be helpfull https://vaadin.com/book/-/page/themes.css.html
Or you can do that for each component just in code, but I would recommened the first approach:
private GridLayout createGrid() {
GridLayout layout = new GridLayout(3, 3);
layout.setSizeFull();
Page.getCurrent()
.getStyles()
.add(".border-gridcell {padding:5px; border-style: solid;border-width: 1px;border-color: black; }");
for (int i = 0; i < 9; i++) {
Label lbl = new Label("label " + i);
lbl.addStyleName("border-gridcell");
layout.addComponent(lbl);
}
return layout;
}
Thanks Dmitrii Rogozin.
Do i have to write "gridlayout_name.setStyleName(“vaadinempty”) " too?
D.
If you specify css rules in a theme (in .scss) file, you should only specify @Theme annotation for the class.
Also in Vaadin 7.3 there will be a setTheme(theme) method which will allow you to set Theme during runtime.
i wrote
"@mixin vaadinempty {
/* Include all the styles from the reindeer theme */
@include reindeer;
.v-gridlayout-slot {
border-style: solid;
border-width: 1px;
border-color: black;
}
} " in the mixin.scss and imported it in the main theme.
Still the gridlayout is same.
Actually i want only one gridLayout to be with darker border like there is a specific style for a gridlayout and not for all gridlayout
Thanks Dmitrii Rogozin.
It worked fine. I didnt realized that this script was only for labels.
The Page.getCurrent()
.getStyles()
.add(“.border-gridcell {padding:5px; border-style: solid;border-width: 1px;border-color: black; }”); worked fine for my purpose.
D
Always glad to help.
Have fun!