Favorites effect favorites-effect

The viewer displays Favorites icons over the main view in places where it was originally added by the user.

The appearance of the Favorite icon is controlled with the following CSS class selector:

.s7ecatalogsearchviewer .s7favoriteseffect .s7icon

CSS properties of the Favorite icon

Example - set up a 36 x 36 pixels Favorites icon.

.s7ecatalogsearchviewer .s7favoriteseffect .s7icon {
 height: 36px;
 width: 36px;
 background-image: url(images/v2/FavoriteEffect_dark_up.png);
}

On desktop systems, the component supports the cursortype attribute selector which you can apply to the .s7favoriteseffect class and controls the type of the cursor based on the selected user action. The following cursortype values are supported:

Example - have different mouse cursors for each type of component state.

.s7ecatalogsearchviewer .s7favoriteseffect[cursortype="mode_add"] {
cursor: crosshair;
}
.s7ecatalogsearchviewer .s7favoriteseffect[cursortype="mode_remove"] {
cursor: not-allowed;
}
.s7ecatalogsearchviewer .s7favoriteseffect[cursortype="mode_view"] {
cursor: auto;
}