Passez la nouvelle barre latérale du côté gauche au côté droit (forum en anglais)

Salut tout le monde,

J’ai cherché sur les forums et j’ai posé la question dans le nouveau chat il y a quelques jours. On m’a conseillé de poster sur les forums. J’espère que quelqu’un pourra m’aider.

Existe-t-il un plugin pour déplacer la nouvelle barre latérale vers la droite ?

ou existe-t-il un moyen intégré de passer du côté gauche au côté droit ?

5 « J'aime »

Il n’y a pas de moyen intégré pour faire cela ni de plugin existant dont je sois au courant. Donc, bien qu’une personnalisation qui le ferait soit possible, elle risquerait de repousser certaines limites et de rencontrer des problèmes imprévus.

5 « J'aime »

Pour la vue de bureau :

    body #main-outlet-wrapper {
        grid-template-areas: "content sidebar";
        grid-template-columns: minmax(0, 1fr) 0;
    }
    
    body.sidebar-animate #main-outlet-wrapper {
        grid-template-areas: "content sidebar";
    }
    body.has-sidebar-page #main-outlet-wrapper {
        grid-template-areas: "content sidebar";
        grid-template-columns: minmax(0, 1fr) var(--d-sidebar-width);
        padding: 0 0 0 10px;
    }
8 « J'aime »

Merci. Où est-ce que je colle ça, ici ?

Pour être du bon côté, veuillez le mettre dans Bureau->CSS

6 « J'aime »

Merci ! Cela fonctionne partiellement. Le menu sandwich est toujours en haut à gauche et pousse le logo.

J’aimerais que le menu sandwich dans la barre de navigation reste dans la position d’origine avec les icônes du côté droit.

De plus, l’activation de la barre latérale rend la largeur de la page plus étroite. (J’ai une largeur de page personnalisée qui est ignorée lorsque la barre latérale est activée)

Excellent travail @Lhc_fl :clap:

Il y a un réglage sur le site pour cela. Cherchez navigation menu et réglez-le sur “Header Dropdown” :slight_smile:

4 « J'aime »

Non, vous manquez toute la question. Lorsque vous activez le menu déroulant de l’en-tête, la barre latérale est supprimée. :slightly_smiling_face:

Le fil de discussion porte sur le fait de « changer » la barre latérale de gauche à droite et de garder le sandwich à droite où il a toujours été. (on pourrait soutenir qu’il y appartient)

J’ai déjà activé « Menu déroulant de l’en-tête » en attendant qu’il y ait un moyen d’avoir à la fois la barre latérale et l’icône à droite.

Le logo à gauche mène à la « page d’accueil du forum » (charmant). Mais maintenant, la position du logo est remplacée par une icône de basculement de la barre latérale, et vous pouvez basculer la barre latérale par accident. Je pense que toutes les icônes de menu devraient rester à droite.

Le basculement de la barre latérale n’a pas besoin d’être constamment activé, donc le déplacer à gauche du logo est un point d’accès trop important.

Même chose avec la barre latérale, je préfère que le contenu de la page soit à gauche et la barre latérale à droite.

C’est une préférence personnelle uniquement, j’en suis sûr. Je me renseigne donc seulement, car d’autres propriétaires de forums doivent être d’accord avec tout à gauche.

4 « J'aime »

Ah, oui, je comprends. J’avais oublié que le hamburger de droite ne déclenche pas une vraie barre latérale. Même contenu mais plutôt un menu déroulant, pas une barre latérale, ce que vous voulez.

J’ai jeté un coup d’œil au code de Discourse qui, malheureusement, ressemble encore à des formules cryptiques de sorcier pour moi :mage: :scroll: Il semble que les deux composants soient rendus très différemment.

Le contenu de l’en-tête qui contient le widget de basculement de la barre latérale : discourse/app/assets/javascripts/discourse/app/widgets/header-contents.js at fde9e6bc25227b69195181d45ee4360c25c279da · discourse/discourse · GitHub

Le widget de la barre latérale : discourse/app/assets/javascripts/discourse/app/widgets/sidebar-toggle.js at 5b6604f5a7e1c8ff29fe556236dbf86872908b03 · discourse/discourse · GitHub

Le code actuel du hamburger de droite : discourse/app/assets/javascripts/discourse/app/widgets/header.js at c43cb0c5716a3671a682c87295f5a7dad61eb65d · discourse/discourse · GitHub

Peut-être que cela aiderait certains à créer un composant de thème à cet effet.

3 « J'aime »

Merci ! C’est un sandwich au fromage grillé, d’ailleurs, pas un hamburger. :nerd_face:

2 « J'aime »

Je suis curieux de comprendre pourquoi vous souhaitez déplacer le menu sur le côté droit ? Est-ce un retour d’information que vous pensez être meilleur pour tous les sites, ou y a-t-il une particularité de votre propre site qui rend l’emplacement à gauche inadapté ? Avez-vous un autre menu là-bas, par exemple ? Sinon, je pense que l’emplacement à gauche pour un menu de navigation qui peut être caché/affiché devient la norme de l’industrie…

Peu importe le terme qui vous donne le plus faim ! :rofl: Bien que je pense que hamburger soit plus reconnaissable. Personnellement, j’aime l’appeler le hamburglar ! :man_detective:

2 « J'aime »

Eh bien, ajoutez cette ligne.

span.header-sidebar-toggle {
    order: 1;
}

2 « J'aime »

Pour information, certains utilisateurs m’ont demandé de le mettre sur le côté droit après que je l’ai déployé. Peut-être étaient-ils habitués à l’emplacement du hamburger ?

4 « J'aime »

Merci pour le travail acharné et les mises à jour. :coffee:

Est-ce possible maintenant, par hasard ?

1 « J'aime »

Salut @haydenjames :slight_smile:
Vous avez déjà demandé cela dans une demande de fonctionnalité ici.
Il n’est pas nécessaire de publier plusieurs fois sur différents sujets, j’ai donc déplacé votre publication de Discourse 3.0 is Here! :slight_smile:

De plus, @Lhc_fl a fourni de bonnes solutions de contournement. :+1:

La solution de contournement était effectivement presque là. Il me fallait juste que le hamburger reste la deuxième icône en partant de la droite et non la première à droite. Mais @Lhc_fl a confirmé que cela ne pouvait pas être réalisé uniquement par CSS.

Je préfère avoir le contenu à gauche et la barre latérale (moins utilisée) à droite - sans déplacer l’emplacement original de l’icône hamburger.

Modification : Je pense qu’autoriser la liberté de choisir les côtés et de ne pas diviser les icônes de droite en gauche et droite encouragera davantage de propriétaires de forums à activer la barre latérale.

Actuellement, l’activation de la barre latérale divise les icônes du menu trop à gauche et à droite et déplace le logo du forum de sorte que l’icône hamburger se trouve maintenant juste à côté des clics sur la page d’accueil du forum.

J’aimerais conserver ceci :
image

Tout en ayant ceci :

Si possible à l’avenir… Merci. :handshake:

4 « J'aime »

Vous pourriez être en mesure de modifier ce composant de thème éventuellement pour obtenir la position du menu hamburger.

1 « J'aime »

Je ne suis pas sûr de comprendre. Mes excuses. Les captures d’écran de ce plugin ressemblent exactement à la nouvelle approche de Discourse consistant à séparer les icônes tout à gauche et tout à droite.

Cependant, je ne veux pas que l’icône hamburger de basculement du menu soit si proche du logo de retour à l’accueil du forum. Je veux pouvoir basculer la barre latérale et ensuite utiliser les forums normalement sans que l’icône de basculement de la barre latérale ne se trouve dans la zone d’accès du logo de gauche.

Actuellement, désactiver le menu - comme les développeurs l’ont implémenté - n’apporte aucune valeur ou avantage car la largeur de la page revient à une largeur déjà trop étroite. Tout cela signifie que la plupart des utilisateurs ne basculeront pas constamment la barre latérale pour l’activer et la désactiver - à juste titre.

Même s’ils le faisaient, avoir l’icône hamburger à gauche de la zone d’accès du logo de retour à l’accueil n’est (à mon avis) pas un bon endroit et va à l’encontre de la conception précédente de Discourse, où toutes les icônes se trouvent sur le côté droit de la barre de menu supérieure. Je voudrais conserver cela :
image
…tout en gardant le contenu à gauche et la barre latérale à droite. (conformément à la capture d’écran ci-dessus)

Merci de votre réponse ! Je continuerai à lire davantage sur ce plugin pour mieux comprendre si nous parlons des mêmes changements.

1 « J'aime »

Ce que je voulais dire, c’est qu’en combinant le déplacement du panneau vers la droite avec le composant @Lhc_fl. En étudiant le code du composant que j’ai lié, vous pourriez peut-être remettre le menu hamburger entre la recherche et le profil. Si je comprends bien votre demande et le problème avec la solution de contournement actuelle de Lhc_fl.

Comme il utilise déjà du code pour déplacer le menu, il pourrait y avoir des détails dans le code comme exemple à modifier pour obtenir l’effet désiré que vous recherchez.

Sur mobile, votre capture d’écran est dans la position désirée que vous recherchez en mode bureau.

Quelqu’un d’expérimenté pourrait également extraire le code utilisé sur mobile et l’appliquer sur le bureau. Soit en étudiant l’inspecteur d’éléments sur le bureau tout en chargeant le site en vue mobile, soit par les deux.

Pour la largeur, il existe un nouveau composant pour changer la largeur du site qui pourrait vous intéresser.

1 « J'aime »

Oui, j’espère cela. Vous avez raison concernant les icônes de menu mobile et bureau.

1 « J'aime »