I know how to add styles in Vaadin and I’ve done multiple stylings in my css and added the style in the code succesfully, but this one eludes me.
I tried the following:
in the css I have the following style:
.v-caption-mystyle .v-captiontext {
font-size: 13px !important;
font-weight: bold;
color: $dark-grey;
}
In the code I try to set it in two following ways and nothing happens:
postalCodeLabel= new Label(currentAddress.getPostalCode());
postalCodeLabel.setCaption("Postal code"));
postalCodeLabel.addStyleName("v-caption-mystyle");
postOfficeLabel = new Label(currentAddress.getPostOffice());
postOfficeLabel.addStyleName("v-caption-mystyle");
postOfficeLabel.setCaption("Post office"));
I managed to solve it. The problem was in the naming that I should use in the Java code for the addStyleName(parameter). Not quite sure why it works like this, but here’s what I did:
.v-caption-invoiceaddress-label-caption .v-captiontext {
font-size: 13px !important;
font-weight: bold;
color: $dark-grey;
}
And in the Java:
postalCodeLabel = new Label(currentAddress.getPostalCode());
postalCodeLabel.setCaption("myCaption"));
postalCodeLabel.addStyleName("invoiceaddress-label-caption");
Ah, yeah, I should have looked at your code more closer instead of writing my own. The caption is not actually under the label’s main element (which you can target directly with .[your style name]
, but it’s a separate div, so you need to use the .v-caption-[your stylel name]
to access the caption element.