Desactiva la imagen de fondo y la configuración de mosaico anteriores.
Este tema tiene tres configuraciones:
Un campo para agregar tu propia imagen de fondo
Una opción para crear mosaicos con ella
Y una opción para eliminar ambas opciones anteriores
Si desactivas la opción de mosaico, la imagen se establecerá en background-size: cover, y tu navegador escalará tu imagen para cubrir proporcionalmente todo el fondo. Por ejemplo:
¿Soy el único que tiene este problema con este tema? Cuando lo pruebo en Google PageSpeed, obtengo un 99%, pero la página no carga, por lo que los resultados son engañosos.
¿A qué se debe que Google no pueda verla? ¿Es porque la página no carga?
Hmm, sí, estoy viendo el mismo problema… parece que algo en el tema está interfiriendo con la versión de Discourse que servimos a Google. Lo investigaré. Parece que podría ser el mismo problema que afecta a la vista de impresión reportada anteriormente.
Estoy intentando hacer que Graceful sea mucho más ancho en el escritorio. Probé esto:
#main-outlet {
width: auto;
max-width: 1210px; /* Esto hace que el contenedor sea tan ancho como los controles del logotipo/encabezado */
}
Y este CSS hizo que el contenedor general fuera más ancho; y los temas sugeridos en la parte inferior ocupan la página de manera agradable, pero el ancho general de los mensajes en los temas es demasiado estrecho (para mi versión ancha).
Probé el inspector y varios elementos, pero al no ser un experto, no pude hacer que el ancho de los temas/mensajes coincidiera con el ancho de #main-outlet.
¿Te importaría ayudarme?
Gracias
También probé esto:
#main-outlet {
width: auto;
max-width: 80%;
}
Pero no pude hacer que el ancho de los mensajes coincidiera con el ancho del contenedor:
No es muy elegante, pero al menos funciona “bien” con bloques grandes de código; es más fácil de leer en la pantalla grande de los desarrolladores.
Sería genial mostrar la .timeline-container, pero no pude lograr que funcionara al anular la clase como se sugirió, seguramente debido a mis habilidades CSS poco desarrolladas:
Me encanta este tema hasta ahora. ¡Muchas gracias por compartirlo con nosotros!
He notado que en la vista móvil desaparecen las barras de color de las categorías. ¿Es intencional y hay alguna forma de restaurarlas?
Además, ¿hay alguna forma de desactivar el fondo si una categoría tiene un fondo configurado? Parece funcionar bien, pero al desplazarse en publicaciones largas, la pantalla se vuelve entrecortada y se puede ver el fondo configurado del tema.
Sin embargo, sé que esto se sobrescribirá cada vez que se actualice el tema. ¿Cuál es la mejor manera de mantener las modificaciones en esas situaciones?
Tengo un componente de tema personalizado donde guardo cambios de CSS personalizados, esto en la parte de CSS móvil:
…pero no muestra el color específico de la categoría, solo una barra blanca. ¿Cómo puedo hacer que muestre el color correcto de la categoría? Sé que tiene algo que ver con las variables de color de las categorías, pero no logro encontrar ninguna referencia a ellas.
Soy un principiante en CSS y cosas así, así que es posible que esté haciendo algo mal.
Debo ser lento, pero no logro que el logo cambie de tamaño con un componente de tema creado para ajustar el CSS. Puedo modificar la altura general del encabezado, pero el logo se mantiene tercamente igual. Este CSS parece anular cualquier cambio que intente realizar:
.d-header #site-logo {
max-height: 35px !important;
}
Según el Inspector de Chrome, esto proviene de: desktop-scss-graceful.scss
Cambiar el tamaño del logo funciona bien con el tema predeterminado y, como dije, cambiar la altura del encabezado funciona con Graceful, pero no el logo…
Sí, el !important anula cualquier otro CSS que no tenga !important… No recuerdo por qué está ahí, pero debería investigar para eliminarlo. ¿Funciona si incluyes un !important en tu propio CSS?
¡Gracias por la respuesta rápida! De hecho, ya había notado el !important e intenté agregarlo en mi código, pero sin éxito. Lo curioso es que, al probarlo ahora, cuando guardo ese cambio y se actualiza, por un momento aparece del tamaño correcto, pero luego se encoge de nuevo. Y en el Inspector parece que está haciendo lo correcto:
OK, siguiente pregunta, que creo que es específica de este tema. Lo estoy usando como base para crear una especie de “blog” personal (en realidad, un jardín digital, aunque ese es un término algo oscuro). Dado que básicamente cada publicación será escrita por mí, quiero eliminar o reducir la prominencia de ciertos elementos visuales relacionados con la autoría, principalmente los avatares, especialmente en las listas de temas en la página principal y en las categorías. Lo que quiero ocultar, si es posible, está delimitado en rojo:
Usar las herramientas de desarrollo de Chrome para encontrar las clases/IDs e intentar ocultarlos (nota para mí mismo: no ocultar ember-view )
También estoy investigando y experimentando con varios componentes para mostrar la primera imagen de un tema como miniatura. Si pudiera reemplazar esos avatares con pequeñas miniaturas de la primera imagen del tema, sería genial también. Pero ocultarlos es un buen comienzo.
. No han estado activos desde que se publicó inicialmente, así que lo he actualizado, ampliado y añadido a GitHub.
¿Alojado por nosotros? Los temas están disponibles para usar en nuestros planes Estándar, Empresarial y Corporativo.
)