Conditional style of button in filterselect when popup is shown

Hi folks,

I am just working on a custom style in vaadin and must say: I am very pleased. Using the good examples in base, runo and reindeer and some firebug I have archieved until now everything I wanted. But now I’m stuck:

I have a nice custom style for filterselect with images and all.

Now I’d like to style the “button” on the right side of the select, based on the property that the select “popup list” is shown. But in firebug all I see is the generic .v-filterselect-focus class on the parent divs, and that is also used if the user selects the input box. Is there any way to archieve that styling, or do I need to extend the component? (All themes I’ve seen so far don’t have it).

Thanks in advance,


I’m not 100% sure if I’m following. Do you want the style name for the button that opens the dropdown list? That one has the class v-filterselect-button.

I probably misunderstood the question so can you please give some more details.

I’ll try to explain further:

I got a style for the v-filterselect-button and the .v-filterselect-button:hover for the filter select boxes.

And now I’d like to change the style of the v-filterselectbutton after a click on the .v-filterselect-button when the suggestpopup is shown (to indicate, that another click on the .v-filterselect-button would close the suggestpopup).

Now I see what you mean. Sorry but I couldn’t find a way to achieve that effect either. I guess you have to extend the component if you really want it. When the open event is received add a stylename like v-filterselect-open, or something to the component and remove it on close. Shouldn’t be a big change but it seems that you have to make the change on the client side.

You could also suggest an enhancement at