¿Cómo puedo cambiar el fondo de la categoría en la versión móvil?

[Vsekraski (Андрей)]

Hola. No puedo cambiar el fondo de la categoría. ¿Hay alguna forma de hacerlo?

[Lilly (Lillian)]

Creo que esto puede ser complicado de hacer con Horizon^[1], pero algo así funcionará en un componente de tema. El color dependerá de la variable que utilices (por ejemplo, --tertiary-low de las paletas de colores para modo claro/oscuro). También puedes crear tus propias variables y añadir más complejidad.

En un componente de tema con CSS personalizado:

@use "lib/viewport";

//** apunta al ID de la categoría para una categoría específica **//

.category-box[data-category-id="4"] {

// ** aplica solo a móviles ** //

  @include viewport.until(md) {
    .category-box-inner {
       background: var(--tertiary-low);
    }
  }
}

Con la paleta de colores que estás usando actualmente en tu sitio:

modo claro:

modo oscuro:

---

1. encuentro que Horizon es un dolor de cabeza para personalizar ↩︎

[Lilly (Lillian)]

Si deseas usar colores específicos que no estén en la paleta y que cambien con el modo oscuro/claro, puedes utilizar la pestaña de definiciones de color en el mismo componente:

$bg-light: aqua;
$bg-dark: blueviolet;

:root {
  --category-id-4-background: #{dark-light-choose($bg-light, $bg-dark)};
}

[chapoi]

Solo para señalar:

Horizon no está diseñado para ser personalizado.

Si deseas realizar cualquier personalización, la recomendación oficial es que comiences con Foundation y lo uses como base.

Como se explica aquí

@Discourse

recomendamos que los sitios interesados en la personalización utilicen el tema Foundation en su lugar.

[Lilly (Lillian)]

eso es triste porque los administradores quieren personalizar sus sitios. eso es una de las grandes cosas que a la gente le gusta de Discourse.

[chapoi]

Sí, si puedes ajustarlo, claro, adelante. Un no significa que no puedes.

Pero no estaba pensado para eso, así que no lo construimos con la idea de que fuera fácil de personalizar. Está pensado como un tema listo para usar para personas con menos conocimientos técnicos.