Vista Favoritos

La vista Favoritos consiste en una columna de imágenes en miniatura.

El aspecto del contenedor de vista favoritas se controla con el siguiente selector de clase CSS:

.s7ecatalogsearchviewer .s7favoritesview

La posición y la altura de la vista Favoritos la gestiona la vista; en CSS solo es posible definir la anchura.

Propiedades CSS de la vista Favoritos

background-color

Color de fondo de la vista Favoritos.

width

Anchura de la vista.

Ejemplo: para configurar una vista Favoritos de 100 píxeles de ancho con un fondo gris semitransparente.

.s7ecatalogsearchviewer .s7favoritesview { 
 width: 100px; 
 background-color: rgba(221, 221, 221, 0.5); 
}

El espaciado entre las miniaturas de Favoritos se controla con el siguiente selector de clase CSS:

.s7ecatalogsearchviewer .s7favoritesview .s7thumbcell

Propiedades CSS de las miniaturas de Favoritos

margin

Tamaño del margen vertical alrededor de cada miniatura. El espaciado de la miniatura real es igual a la suma de los márgenes superior e inferior que se configuran para .s7thumbcell .

Ejemplo: para configurar el espaciado de 10 píxeles.

.s7ecatalogsearchviewer .s7favoritesview .s7thumbcell { 
 margin: 5px; 
}

El aspecto de la miniatura individual se controla con el siguiente selector de clase CSS:

.s7ecatalogsearchviewer .s7favoritesview .s7thumb

Propiedades CSS de las miniaturas de Favoritos

width

Anchura de la miniatura.

height

Altura de la miniatura.

borde

Borde de la miniatura.

NOTA

La miniatura admite el selector de atributos state, que puede utilizarse para aplicar diferentes apariencias a distintos estados de miniaturas. En particular, state="selected" corresponde a la miniatura seleccionada recientemente por el usuario. state="default" corresponde al resto de las miniaturas. Y state="over" se utiliza al pasar el ratón por encima.

Ejemplo: para configurar miniaturas de 75 x 75 píxeles, tenga un borde predeterminado de gris claro y un borde seleccionado de color gris oscuro.

.s7ecatalogsearchviewer .s7favoritesview .s7thumb { 
 width: 75px; 
 height: 75px;  
} 
.s7ecatalogsearchviewer .s7favoritesview .s7thumb[state="default"] { 
 border: 1px solid #dddddd; 
} 
.s7ecatalogsearchviewer .s7favoritesview .s7thumb[state="selected"] { 
 border: 1px solid #666666; 
}

El aspecto de la etiqueta de miniatura se controla con el siguiente selector de clase CSS:

.s7ecatalogsearchviewer .s7favoritesview .s7label

Propiedades CSS de la etiqueta Favoritos

font-family

Nombre de fuente.

font-size

Tamaño de fuente.

Ejemplo: para configurar etiquetas con una fuente Helvetica de 14 píxeles.

.s7ecatalogsearchviewer .s7favoritesview .s7label { 
 font-family: Helvetica,sans-serif; 
 font-size: 14px; 
}

En esta página