Comment puis-je cacher le lien Badges dans la barre latérale ?

J’imagine que la personnalisation de la barre latérale sera ajoutée en temps voulu, mais pour l’instant, j’aimerais supprimer le lien « Badges », ou du moins le masquer dans « Plus… »

Devrais-je simplement utiliser du CSS pour le masquer, pour le moment ?

Je n’arrive pas à comprendre le CSS. Les divs contenant les liens sont de classe sidebar-section-link-wrapper sans id. Lorsque j’essaie de masquer la balise a avec a.sidebar-section-link-badges { display: none; }, cela ne masque rien.

2 « J'aime »

Bonjour, dans le menu hamburger, j’ai utilisé « nth-child » pour faire ce genre de chose

https://www.w3schools.com/cssref/sel_nth-child.asp

1 « J'aime »

nth-child est très utile pour de nombreuses choses, cependant dans ce cas, je pense qu’il est probablement dangereux. Puisqu’il est basé uniquement sur des nombres, cela nécessiterait une garantie que les Badges resteront dans la même position.

Si quelque chose d’autre est ajouté/supprimé/déplacé avant, la position des Badges changera, ce qui pourrait entraîner la révélation des Badges, la dissimulation de quelque chose d’autre et cela pourrait passer inaperçu.

:has() est idéal pour cela, cependant son support est malheureusement encore limité, notamment il est désactivé par défaut dans Firefox et absent de nombreux navigateurs mobiles.

Si le masquer n’est pas critique pour vous, c’est-à-dire qu’il est acceptable de le masquer autant que possible pour une meilleure expérience tout en étant visible dans les navigateurs qui ne supportent pas encore :has(), vous pouvez utiliser le sélecteur suivant :

sidebar-section-link-wrapper:has(a.sidebar-section-link-badges) { display: none; }
1 « J'aime »

Merci pour ces idées. Je vais probablement faire cela pour l’instant. Mais j’espère que des ids pourront être ajoutés.

1 « J'aime »

Bonjour,
Vous pouvez le masquer avec ceci. :slightly_smiling_face:

.sidebar-section-link-wrapper {
  .sidebar-section-link.sidebar-section-link-badges {
    display: none;
  }
}
6 « J'aime »

Je viens de copier-coller ceci dans mon ancien composant de thème (qui faisait la même chose avec l’ancien menu hamburger) et cela a fonctionné ! Merci beaucoup, et merci encore à tous les autres aussi.

3 « J'aime »

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

Malheureusement, ce CSS ne semble pas fonctionner avec la version 2.9.0beta12… des idées ? :slight_smile:

Ce lien fonctionne toujours pour moi sur la dernière version.


Pouvez-vous partager votre code ?

1 « J'aime »

Je m’excuse. Ça fonctionne. Je l’avais commenté à cause du bug avec le lien « Plus ».
Ce bug est que le lien est affiché même lorsqu’il n’y a pas d’options de menu « Plus ». Avec le nombre d’options sur mon forum, l’option Badges présente, même si je ne la veux pas là, au moins « Plus » a quelque chose à faire ! (Le problème demeure… lorsque vous êtes sur la page Badges elle-même, le lien inutile « Plus » est là.) "More..." shows in sidebar when there is nothing more
Pour une raison quelconque, la fonctionnalité « coller l’URL sur le texte pour créer un hyperlien » n’a pas fonctionné lors de la modification de ce message.

Je vois. En fait, je pense que ce n’est pas un bug car les options du menu Plus s’y trouvent mais sont masquées, donc il n’est pas vide. Mais si je comprends bien, vous masquez tout ce qui se trouve dans le menu Plus ? Si c’est le cas, je pense qu’il serait préférable de masquer toute la section Plus ?

Pour masquer le menu déroulant Plus de toutes les pages :

// masquer le menu Plus de toutes les pages
.sidebar-more-section-links-details {
  display: none;
}

Si vous souhaitez le masquer sur une page spécifique, vous pouvez utiliser la classe body pour le cibler.

Vous pouvez le trouver ici.

Par exemple, sur la page des badges, cela ressemblera à ceci :

// masquer le menu Plus de la page spécifique (badges)
body.badges-page {
  .sidebar-more-section-links-details {
    display: none;
  }
}

Cela masquera le menu déroulant Plus mais affichera Badges dans la barre latérale.


Mais si vous utilisez le code précédent pour masquer les Badges, ceux-ci ne s’afficheront pas non plus.

// masquer l'élément du menu Plus des badges
.sidebar-section-link-wrapper {
  .sidebar-section-link.sidebar-section-link-badges {
    display: none;
  }
}

// masquer le menu Plus de la page spécifique (badges)
body.badges-page {
  .sidebar-more-section-links-details {
    display: none;
  }
}

1 « J'aime »

Je considère cela comme un bug car je ne pense pas qu’une option « Plus » devrait apparaître à moins qu’il n’y ait plus d’éléments et que cliquer sur « Plus » ait donc un effet. Le rapport de bug se trouve ici : "More..." shows in sidebar when there is nothing more

Ce sujet a été automatiquement fermé après 617 jours. Les nouvelles réponses ne sont plus autorisées.