Vista Favoritos

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

El aspecto del contenedor de vistas de favoritos se controla con el siguiente selector de clase CSS:

.s7ecatalogsearchviewer .s7favoritesview

La vista gestiona la posición y el alto de la vista Favoritos; 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 miniaturas de Favoritos se controla con el siguiente selector de clase CSS:

.s7ecatalogsearchviewer .s7favoritesview .s7thumbcell

Propiedades CSS de las miniaturas de Favoritos

margin

El tamaño del margen vertical alrededor de cada miniatura. El espaciado en miniatura real es igual a la suma de los márgenes superior e inferior que se establecen 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 aspectos a diferentes estados de miniaturas. En concreto, 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.

Por ejemplo: para configurar miniaturas de 75 x 75 píxeles, tenga un borde predeterminado de gris claro y un borde seleccionado de 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 la 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