Tema Aire

:discourse2: Resumen Air Theme es un tema limpio y moderno que incluye varios componentes para mejorar tu foro.
:eyeglasses: Vista previa Vista previa en Discourse Theme Creator
:hammer_and_wrench: Enlace al repositorio https://github.com/discourse/discourse-air
:open_book: ¿Nuevo en los temas de Discourse? Guía para principiantes sobre el uso de temas de Discourse

Instalar este tema

Características

Modo claro

Modo oscuro

Página de categorías

Este tema también incluye varios componentes para mejorar tu foro.

  • Temas clicables
  • Cajas modernas de categorías y grupos

:exclamation: Por favor, lee estos consejos durante la instalación, ya que hay algunas configuraciones que DEBEN ACTIVARSE para que el tema se renderice correctamente.


Consejos

Alternancia entre esquemas de colores claro y oscuro

Para que esto funcione correctamente, al menos dos opciones de esquema de colores deben estar habilitadas en tu área de https://discourse.jordanvidrine.com/admin/customize/colors. Al menos dos colores deben tener la opción el esquema de colores puede ser seleccionado por los usuarios activada.

Una vez hecho esto, los usuarios podrán elegir entre dos esquemas de colores como sus preferencias de claro y oscuro en el menú de preferencias de usuario.


Banner de bienvenida

Ve a la página Administración > Banner de bienvenida (/admin/config/welcome-banner).

  • En el menú desplegable Habilitado en temas…, selecciona Air Theme.
  • En el menú desplegable Ubicación, selecciona Debajo del encabezado del sitio.

Cajas modernas de categorías y grupos

Este componente del tema requiere que tus categorías utilicen la configuración CAJAS DE CATEGORÍAS CON SUBCATEGORÍAS en tu área /admin/site_settings/category/all_results?filter=categories.

Este componente del tema también permite al administrador del foro organizar la página de categorías con títulos de encabezado y elegir qué categorías aparecen bajo cada encabezado. Para mantener las cosas simples, solo he permitido hasta 5 encabezados. Si no se eligen categorías ni configuraciones de encabezado, todas las categorías se renderizarán como se muestra arriba; esta es la opción de renderizado predeterminada.

:discourse2: ¿Alojado por nosotros? Los temas están disponibles para usar en nuestros planes Estándar, Empresarial y Corporativo.

139 Me gusta

¡Eso es simplemente increíble, Jordan! :heart_eyes: ¡Me encanta!

17 Me gusta

Sería útil que el mensaje de bienvenida se oculte si se deja el campo de idioma en blanco :+1:

7 Me gusta

¡Vaya, esto se ve realmente genial! Gracias por compartirlo. :slight_smile:

10 Me gusta

Este tema le da a Discourse el aspecto moderno que merece. Muy bien hecho, @jordan.vidrine.

14 Me gusta

El tema se ve increíble. ¡Gran trabajo! :heart_eyes:

5 Me gusta

¡Este tema se ve increíble! Esperemos que también podamos obtener el diseño de esta página de categoría como un componente independiente. Se ve mucho mejor así. :heart:

8 Me gusta

Gracias, es muy agradable…

Es la primera vez que instalo un tema nuevo. ¡Me encanta este!

9 Me gusta

Hola @jordan-vidrine, en cuanto a la columna de número de vistas, ¿qué tipo de código debo agregar en el componente para anular que esa columna esté oculta?

3 Me gusta

Creo que esto debería funcionar:

.full-width .contents .topic-list thead th.posts {
width: 10%;
}

.full-width .contents .topic-list thead th.activity {
width: 10%;
order: 4;
}

th.num.views {
width: 10%;
order: 3;
display: block;
}

.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.posts {
width: 10%;
order: 2;
}

.topic-list .views {
width: 10%;
order: 3;
}

.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.age {
width: 10%;
order: 4;
}
6 Me gusta

¡Hermoso y refrescante. ¡Gran trabajo @jordan.vidrine!

4 Me gusta

¿Existe alguna posibilidad de cambiar el texto del encabezado “Bienvenido al foro”?

4 Me gusta

Sí, esto se puede editar en el componente Discourse Search Banner :+1:

3 Me gusta

Hace un tiempo publiqué un problema sobre no ver las categorías en una vista móvil (Air Theme - #172). Hablé un poco con @jordan.vidrine, pero no pudimos llegar a la raíz del problema. Espero que alguien más tenga algunas ideas.

Para los detalles
Usando una instalación limpia de Discourse 2.7.11 en kubernetes con la ayuda de un gráfico de Helm de Bitnami, y la última versión del tema instalada y configurada como se menciona en la publicación inicial, no vemos ninguna categoría en la vista móvil y el estilo está desajustado en la página más reciente.

Lo que intentamos
Además de usar una instalación limpia, intentamos usar también algunas versiones anteriores del tema. Sin embargo, el problema persistió, pero no probamos exhaustivamente todas las versiones.
También comparamos el HTML de nuestra instancia con el de discourse.jordanvidrine.com , y notamos que es significativamente diferente.

Intuición
Como no podemos usar una versión ‘beta’, mi intuición me dice que esto es un problema de compatibilidad entre el tema o uno de sus complementos y Discourse 2.7. Me encantaría saber si alguien tiene este tema funcionando en 2.7, y si es así, con qué versiones del tema y complementos relevantes.

Pregunta
¿Alguien ha conseguido que este tema funcione con 2.7 y/o hay alguna pista sobre lo que podríamos hacer para que funcione?

2 Me gusta

Hola. Primero, gracias por este gran tema :smile:

Quiero cambiar la fuente, ¿cómo puedo hacerlo?

Intenté esto :point_down:

  • Descargar este tema Google Fonts y cambiar la configuración de fuente en CONFIGURACIÓN DEL SITIO – No funciona

  • Añadir código @import{enlace de fuente web ~~~ } en Desktop.css, mobile.css – No funciona

¿Qué archivo debería modificar para cambiar la fuente? :sob:

3 Me gusta

Creo que deberías poder establecer una fuente personalizada sin un componente aquí: admin/site_settings/category/all_results?filter=font

Si deseas más personalización, creo que el componente temático de Google Fonts que enlazaste funcionaría. Sin embargo, creo que el tema utiliza theme-settings y no una configuración del sitio.

¿Has planteado este problema en el tema de ese componente de fuentes?

4 Me gusta

Hola a todos, ¿alguien puede ayudarme a cambiar el tamaño y la “naturaleza fija” del color de fondo en el móvil?

El CSS para el móvil es transparente de mi lado. Y solo necesito un poco de orientación sobre cómo cambiar el fondo fijo para los colores de fondo.

Si no me equivoco, hay un fondo de encabezado y un fondo de página, ¿correcto?

3 Me gusta

Esto se debe a que el tema y sus componentes incluidos son bastante exigentes con la forma en que se configura el sitio.

En el OP compartí que:

6 Me gusta

¿Hay alguna forma de hacer que el fondo sea una imagen? Preferiría tener una imagen en lugar de colores. Usar

body {
    background-image: url("url de la imagen aquí");
    background-color: #cccccc;
}

hace que la parte superior del color sea la imagen, pero no la inferior.

4 Me gusta

Lo que hiciste está bien para añadir la imagen, pero también querrás eliminar la ruta de recorte que se crea para dar ese efecto de superposición.

html .background-container {
clip-path: unset;
}
5 Me gusta