¿Creaste un nuevo componente de tema y lo agregaste a este caso el tema “air”?
Viste mis modificaciones anteriores. ¿Estás intentando anular partes de la configuración del tema o, como en mi publicación anterior, agregar modificaciones/correcciones?
¡Gracias Dan! Pude averiguar cómo agregar un nuevo componente y luego agregar CSS personalizado allí.
Si quieres anular una configuración. Usa “¡importante!”
Por ejemplo
.some-selector {
padding-top: 2.5em !important;
{
Todavía estoy aprendiendo. Discourse es muy diverso.
Gracias por el gran tema. todo funciona. Pero tengo la pregunta de cómo puedo cambiar la imagen de fondo.
Gracias por la ayuda.
Crea un componente de tema y añádelo con tu imagen de fondo
.background-container {
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 100vw;
background-image: url();
background-size: cover;
opacity: 1;
/* background: linear-gradient(90deg, var(--tertiary-hover) 0%, var(--tertiary) 100%); */
clip-path: unset;
background-color: var(--secondary) !important;
}
Hola chicos,
¿Hay alguna forma de añadir algunos enlaces externos en la cabecera cerca del logo?
¡Gracias!
Hay este\n\nhttps://meta.discourse.org/t/custom-header-links-icons/86307\n\nY\n\nhttps://meta.discourse.org/t/dropdown-header/226170\nTambién hay uno que añade una barra con menús desplegables debajo de la cabecera del sitio\n\nHeader Submenus - #67 by davidkingham
Hola,
Muchas gracias por tomarse el tiempo de responder.
Estaba usando este pero no estaba completamente satisfecho: Custom Top Navigation Links
Tu segunda sugerencia es exactamente lo que necesito, estoy muy contento con el resultado.
¡Muchas gracias por tu ayuda!
Hola a todos,
Disculpad este doble mensaje, pero ¿hay alguna forma de mostrar las subcategorías tanto en escritorio como en móvil y, al mismo tiempo, mostrar los títulos completos de las categorías en móvil cuando son un poco largos?
Mi configuración es CAJAS DE CATEGORÍAS CON SUBCATEGORÍAS, pero sin usar Categoría Moderna + Cajas de Grupo.
El resultado es genial en escritorio y móvil cuando uso la versión de escritorio. Pero con la versión móvil no se puede leer el final de algunos títulos de categorías.
¡Muchas gracias por vuestra ayuda!
¿Puedes publicar una captura de pantalla?
Veo subcategorías que se muestran en ambos ss. ¿Está buscando tener la descripción de la categoría en ambos? ¿O reflejar el escritorio sin descripción?
Disculpe si no fui claro.
Me gustaría ver los títulos completos de las categorías.
Por ejemplo, en la versión de escritorio, tiene «Discussions Générales sur la mode» pero en la versión móvil, solo tiene «Discussions Générales».
No estoy seguro del código CSS de memoria. Pero deberías poder hacer que el título de la categoría se ajuste como en la primera imagen que publicaste.
Quizás intente inspeccionar el elemento en el escritorio para ver si puede identificar el CSS utilizado para ajustar el nombre de la categoría a 2 líneas.
Probé algo de CSS con ChatGPT y Claude, por ejemplo:
.category-box-heading,
.category-box-heading a,
.category-box-heading h3 {
max-width: 100%;
width: 100%;
display: block;
word-break: break-word;
overflow-wrap: break-word;
white-space: normal !important;
overflow: visible !important;
text-overflow: clip !important;
line-height: 1.4;
padding: 5px 0;
}
.parent-box-link {
display: block;
width: 100%;
}
@media screen and (max-width: 767px) {
.category-box-heading h3 {
font-size: 16px; /* Ajusta este valor según tus necesidades */
}
}
Pero no funciona.
¿Hay alguna forma de forzar la vista de escritorio en el móvil? Sería perfecto tener la descripción y las subcategorías.
¡Gracias!
¿Has probado cómo se ve la vista de escritorio en un móvil? No es muy buena en algunos móviles.
Gracias por tu respuesta.
Lo acabo de probar en 2 iPhones y fue así.
Que es exactamente lo que estoy buscando.
Idealmente, me gustaría que mis usuarios tuvieran esta vista directamente sin jugar con la configuración.
Deshabilita tu componente personalizado. Crea un nuevo componente de prueba en CSS móvil, prueba esto
.category-box-heading h3 {
//* Es posible que necesites descomentar las 2 líneas siguientes.
// Overflow: unset !important;
// Text-overflow: unset !important;
text-wrap: balance !important;
}
Estoy bastante seguro de que no necesitarás ninguna otra modificación de CSS.
Acabo de probar. Tampoco funciona con mi fragmento.
Última versión del código efectivo:
.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;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.age {
width: 10%;
order: 4;
}
.topic-list .views {
width: 10% !important;
order: 3 !important;
display: flex !important;
visibility: visible !important;
justify-content: center;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.views {
width: 10% !important;
order: 3 !important;
display: flex !important;
justify-content: center;
align-items: center;
}



