Ridimensiona banner di categoria

Assistenza prodotto
3

Ciao,

Penso che la causa sia questo CSS

.category-logo.aspect-image {
  width: calc(var(--max-height) * var(--aspect-ratio));
}

Qui max-height è 150px e il aspect-ratio dipende dall’immagine. Significa che se hai un’immagine con un aspect ratio di 6…, allora sarà un’immagine larga 150 x 6 = 900px. Quindi dipende dall’aspect ratio dell’immagine.

Ma puoi sovrascrivere questo calcolo… (non questo ma influenzerà) con quanto segue.
Aggiungi una max-width fissa all’immagine. In questo modo l’immagine non potrà essere più larga di questo valore.
Aggiungi quanto segue alla sezione CSS mobile.

.category-list .category-logo.aspect-image {
  max-width: 250px;
}

Oppure puoi provare qualcosa di simile su mobile. Calcolerà la larghezza massima della viewport e allineerà l’immagine a questa.

.category-list .category-logo.aspect-image {
  max-width: calc(100vw - 2.5em);
}