J’ai vraiment aimé le thème partagé il y a longtemps en 2016 par @jsthon. Ils ne sont plus actifs depuis sa publication initiale, alors je l’ai mis à jour, étendu et ajouté à GitHub.
Désactive l’image d’arrière-plan et les paramètres de tuiles ci-dessus.
Ce thème dispose de trois paramètres :
Un champ pour ajouter votre propre image d’arrière-plan
Une option pour créer un motif en tuiles
Et une option pour supprimer les deux options ci-dessus
Si vous désactivez l’option de tuiles, l’image sera définie sur background-size: cover, et votre navigateur ajustera votre image pour couvrir proportionnellement tout l’arrière-plan. Par exemple :
Am I the only one with this problem using this theme ? When I test in google page speed gets 99% but the page doesn’t load, so the results are misleading.
What is it because google can’t see - it doesn’t load this page?
Hmm, yeah I’m seeing the same issue… it seems like something in the theme is interfering with the version of Discourse we serve Google. I’ll investigate. Looks like it might be the same issue messing with the print view reported above.
I’m trying to make Graceful much wider on desktop. Tried this:
#main-outlet {
width: auto;
max-width: 1210px; /* This makes the container as wide as the logo/header controls */
}
and this CSS made the overall container wider; and the suggested topics at the bottom span the page nicely but the overall width of the posts in the topics are too narrow (for my wide version).
Tried inspector, and a number of elements but not being a expert, could not get the width of the topics / posts to match the width of #main-outlet .
Do you mind to help me out?
Thanks
Also, tried this:
#main-outlet {
width: auto;
max-width: 80%;
}
But cannot the the posts width to match the container width:
Not very graceful but at least it’s working ‘ok’ with large blocks of code, it is easier to read on the big developers screen.
Would be nice to show the .timeline-container but I could not get it to work overriding the class as suggested, surely because of my not well-developed CSS skills:
I am loving this theme so far. Many thanks for sharing it with us!
I’ve noticed on mobile view the category color bars disappear. Is this on purpose and is there a way to restore it?
Also, is there a way to turn off the background if a category has a background set? It seems to work okay but when scrolling on long posts the screen gets jerky and you can glimpse the theme set background.
…but it doesn’t show the specific category color, just a white bar. How do I get it to show the proper category color? I know it has something to do with category color variables but I can’t seem to find reference to it.
I’m a newb when it comes to CSS and such so I may be doing something wrong.
Je dois être lent, mais je n’arrive pas à modifier la taille du logo avec un composant de thème conçu pour ajuster le CSS. Je peux changer la hauteur globale de l’en-tête, mais le logo reste obstinément identique. Ce CSS semble annuler tous les changements que j’essaie d’apporter :
.d-header #site-logo {
max-height: 35px !important;
}
Selon l’inspecteur Chrome, cela provient de : desktop-scss-graceful.scss
La modification de la taille du logo fonctionne parfaitement avec le thème par défaut et, comme je l’ai dit, le changement de la hauteur de l’en-tête fonctionne avec Graceful, mais pas pour le logo…
Oui, le !important annule tout autre CSS sans !important… Je ne me souviens plus pourquoi il est là, mais je devrais vérifier pour le supprimer. Est-ce que cela fonctionne si vous incluez un !important dans votre propre CSS ?
Merci pour cette réponse rapide ! J’avais en fait remarqué le !important et essayé de l’ajouter dans mon code, mais sans succès. L’étrange, c’est que quand j’essaie maintenant, en sauvegardant ce changement et que la page se rafraîchit, pendant un instant l’élément semble avoir la bonne taille, puis il rétrécit à nouveau. Et dans l’inspecteur, il semble se comporter correctement :
OK, prochaine question, que je pense être spécifique à ce thème. Je l’utilise comme base pour créer une sorte de « blog » personnel (en réalité un jardin numérique, mais c’est un terme assez obscur). Comme pratiquement chaque publication sera rédigée par moi-même, je souhaite supprimer ou réduire la visibilité de certains éléments visuels liés à l’auteur, principalement les avatars, et surtout dans les listes de sujets sur la page d’accueil et dans les catégories. Ce que je souhaite masquer, si possible, est entouré en rouge :
L’utilisation des outils de développement de Chrome pour identifier les classes/IDs et tenter de les masquer (note à moi-même : ne pas masquer les ember-view )
Je suis également en train d’étudier et d’expérimenter divers composants afin d’afficher la première image d’un sujet sous forme de miniature. Si je pouvais remplacer ces avatars par de petites miniatures de la première image du sujet, ce serait également formidable. Mais les masquer est déjà un bon début.