window decoration/title bar for subwindow

Flow
1

By default the window decoration/title bar for a subwindow is black with white lettering. Are there CSS styles that can be used to change this?

Thanks,

Matthew Fleming
Fleming Dermatopathology

2

Hi,

There are two different style names involved with the sub-window header: .v-window-outerheader and .v-window-header. The close arrow is decorated using .v-window-closebox.

HTH,
Jouni

3

Could you please be a little more specific as to how I can change the background color and the font color for the title?

I’ve tried

.v-form-logonForm .v-window-header {
background: white;
}

.v-form-logonForm .v-window-header {
background-color: white;
}

.v-form-logonForm .v-window-outerheader {
background: white;
}

.v-form-logonForm .v-window-outerheader {
background-color: white;
}

and none of this seems do anything.

Thanks,

Matthew Fleming

4

Well yes, those would not work, since a window can never be inside a form. The CSS selector syntax implies just that, which is incorrect. Sub-windows are always independent of all other components when it comes to styling.

Sub-windows can be styled by giving them a custom style name (Window.addStyleName) and then using the .v-window-mystylename to target those windows. E.g.

// JAVA
myWindow.addStyleName("foo");

// CSS
.v-window-foo .v-window-outerheader {
     background: white;
     }

.v-window-foo .v-window-header {
     color: black;
     }

BR,
Jouni

5

Thank you Jouni, I used your suggestion and it worked for me.