Remove Favorite button
Last update: December 10, 2021
CREATED FOR:
- Developer
- User
The position of the Remove Favorite button is fully managed by the Favorites menu.
The appearance of the Remove Favorite button is controlled with the following CSS class selector:
.s7ecatalogsearchviewer .s7removefavoritebutton
CSS properties of the Remove Favorite button
background-image | The image that is displayed for a given button state. |
background-position |
Position inside artwork sprite, if CSS sprites are used. See also CSS Sprites. |
width | Width of the button. |
height | Height of the button. |
This button supports both the
state
and selected
attribute selectors, which can be used to apply different skins to different button states. In particular, selected='true'
corresponds to the state when a user can add a new Favorite icon by clicking or tapping. And selected='false'
corresponds to the normal operation mode when a user can zoom, pan, and swap pages.The button tool tip can be localized. See Localization of user interface elements for more information.
Example - to set up a Remove Favorite button that is 28 x 28 pixels, and displays a different image for each of the four different button states when selected or not selected.
.s7ecatalogsearchviewer .s7removefavoritebutton {
width:28px;
height:28px;
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='false'][state='up'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_up.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='false'][state='over'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='false'][state='down'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_down.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='false'][state='disabled'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_disabled.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='true'][state='up'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='true'][state='over'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='true'][state='down'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_over.png);
}
.s7ecatalogsearchviewer .s7removefavoritebutton[selected='true'][state='disabled'] {
background-image:url(images/v2/RemoveFavoriteButton_dark_disabled.png);
}
recommendation-more-help
b7426f53-aad9-4c00-83fc-664f30f681e8