Fai passare la nuova barra laterale da sinistra a destra (forum in inglese)

Ciao ragazzi,

Ho cercato nei forum e ho chiesto nella nuova chat qualche giorno fa. Mi è stato consigliato di pubblicare nei forum. Spero che qualcuno possa aiutare.

Esiste un plugin per spostare la nuova barra laterale sul lato destro?

o c’è un modo integrato per passare da sinistra a destra?

5 Mi Piace

Non esiste un modo integrato per farlo né alcun plugin esistente di cui sono a conoscenza. Quindi, sebbene una personalizzazione che lo faccia possa essere possibile, probabilmente romperebbe qualche nuovo terreno e potrebbe imbattersi in alcuni problemi imprevisti.

5 Mi Piace

Per la visualizzazione desktop:

    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 Mi Piace

Grazie. Dove devo incollare questo, qui?

Per stare sul sicuro, mettilo in Desktop-\u003eCSS

6 Mi Piace

Grazie! Funziona parzialmente. Il menu a sandwich è ancora in alto a sinistra e spinge il logo.

Vorrei che il menu a sandwich nella barra di navigazione rimanesse nella posizione originale con le icone sul lato destro.

Inoltre, l’attivazione della barra laterale restringe effettivamente la larghezza della pagina. (Ho una larghezza di pagina personalizzata che viene ignorata quando la barra laterale è abilitata)

Ottimo lavoro @Lhc_fl :clap:

C’è un’impostazione del sito per questo. Cerca menu di navigazione e impostala su “Menu a discesa nell’intestazione” :slight_smile:

4 Mi Piace

No, ti manca l’intera domanda. Quando attivi il menu a discesa dell’intestazione, la barra laterale viene rimossa. :slightly_smiling_face:

La discussione chiede di “spostare” la barra laterale da sinistra a destra e di mantenere l’icona del menu sul lato destro, dove è sempre stata. (si potrebbe sostenere che appartenga lì)

Ho già abilitato “Menu a discesa dell’intestazione” finché non ci sarà un modo per avere sia la barra laterale che l’icona sul lato destro.

Il logo a sinistra porta alla “home del forum” (fantastico). Ma ora la posizione del logo è sostituita da un’icona di attivazione/disattivazione della barra laterale, e puoi attivare/disattivare la barra laterale per errore. Penso che tutte le icone del menu dovrebbero rimanere a destra.

L’attivazione/disattivazione della barra laterale non ha bisogno di essere costantemente attivata/disattivata, quindi spostarla a sinistra del logo è un’area troppo sensibile.

Lo stesso vale per la barra laterale, preferisco che il contenuto della pagina sia a sinistra e la barra laterale a destra.

È solo una preferenza personale, ne sono sicuro. Quindi sto solo chiedendo, poiché altri proprietari di forum devono essere d’accordo con tutto a sinistra.

4 Mi Piace

Ah, sì, capisco. Ho dimenticato che l’hamburger di destra non attiva una vera barra laterale. Stesso contenuto ma più simile a un menu a discesa, non a una barra laterale, che è quello che desideri.

Ho dato un’occhiata al codice di Discourse che purtroppo mi sembra ancora una formula arcana da stregone :mage: :scroll: Sembra che i due componenti siano renderizzati in modo molto diverso.

Il contenuto dell’header che contiene il widget di attivazione della barra laterale: discourse/app/assets/javascripts/discourse/app/widgets/header-contents.js at fde9e6bc25227b69195181d45ee4360c25c279da · discourse/discourse · GitHub

Il widget della barra laterale: discourse/app/assets/javascripts/discourse/app/widgets/sidebar-toggle.js at 5b6604f5a7e1c8ff29fe556236dbf86872908b03 · discourse/discourse · GitHub

Il codice attuale dell’hamburger di destra: discourse/app/assets/javascripts/discourse/app/widgets/header.js at c43cb0c5716a3671a682c87295f5a7dad61eb65d · discourse/discourse · GitHub

Forse questo potrebbe aiutare qualcuno a creare un componente tematico per questo scopo.

3 Mi Piace

Grazie! È un sandwich grigliato al formaggio, tra l’altro, non un hamburger. :nerd_face:

2 Mi Piace

Sono curioso di capire perché vuoi spostare il menu sul lato destro? È un feedback che ritieni migliore per tutti i siti, o c’è una particolarità del tuo sito che rende la posizione a sinistra non adatta? Hai un altro menu lì, per esempio? Altrimenti penso che la posizione a sinistra per un menu di navigazione che può essere nascosto/mostrato stia diventando uno standard del settore..

Qualunque termine ti faccia venire più fame! :rofl: Anche se penso che hamburger sia più riconoscibile. Personalmente, mi piace chiamarlo hamburglar! :man_detective:

2 Mi Piace

Bene, aggiungi questa riga.

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

2 Mi Piace

Per quanto ne so, alcuni utenti hanno richiesto che fosse sul lato destro dopo che l’ho distribuito. Forse erano abituati alla posizione dell’hamburger?

4 Mi Piace

Grazie per il duro lavoro e gli aggiornamenti. :coffee:

È possibile ora, per caso?

1 Mi Piace

Ciao @haydenjames :slight_smile:
Hai già richiesto questa funzionalità qui.
Non c’è bisogno di pubblicare più volte su argomenti diversi, quindi ho spostato il tuo post da Discourse 3.0 is Here! :slight_smile:

Inoltre, @Lhc_fl ha fornito delle ottime soluzioni alternative. :+1:

Il workaround era effettivamente quasi lì. Avevo solo bisogno che l’hamburger rimanesse la seconda icona da destra e non la prima a destra. Ma @Lhc_fl ha confermato che ciò non poteva essere ottenuto solo tramite CSS.

Preferisco avere il contenuto a sinistra e la barra laterale (meno utilizzata) a destra, senza spostare la posizione originale dell’icona hamburger.

Modifica: Penso che concedere la libertà di scegliere i lati e non dividere le icone del lato destro in sinistra e destra incoraggerà più proprietari di forum ad abilitare la barra laterale.

Attualmente, l’abilitazione della barra laterale divide le icone del menu troppo a sinistra e a destra e sposta il logo del forum in modo che l’icona hamburger sia ora accanto ai clic di forum-home.

Vorrei mantenere questo:
image

Avendo questo:

Se possibile in futuro… Grazie. :handshake:

4 Mi Piace

Potresti essere in grado di modificare questo componente del tema, possibilmente per ottenere la posizione del menu hamburger.

1 Mi Piace

Non sono sicuro di seguirti. Mi scuso. Gli screenshot su quel plugin sembrano esattamente lo stesso del nuovo approccio di Discourse di dividere le icone a sinistra e a destra.

Tuttavia, non voglio che l’icona hamburger per attivare/disattivare il menu sia così vicina al logo di ritorno alla home del forum. Voglio attivare la barra laterale e poi usare i forum normalmente senza che l’icona di attivazione/disattivazione della barra laterale si trovi nella posizione dell’hot-spot del logo a sinistra.

Attualmente, disattivare il menu, come implementato dagli sviluppatori, non aggiunge alcun valore o vantaggio perché la larghezza della pagina ritorna a una larghezza già troppo stretta. Tutto ciò significa che la maggior parte degli utenti non attiverà/disattiverà costantemente la barra laterale, giustamente.

Anche se lo facessero, avere l’icona hamburger a sinistra dell’hot-spot del logo di ritorno a casa non è (secondo me) un buon posto e va contro il precedente design di Discourse, dove tutte le icone si trovano sul lato destro della barra del menu superiore. Vorrei mantenere questo:
image
…mantenendo anche il contenuto a sinistra e la barra laterale a destra. (come da screenshot sopra)

Grazie per la risposta! Continuerò a leggere di più su quel plugin per capire meglio se ci stiamo riferendo alle stesse modifiche.

1 Mi Piace

Quello che intendevo era che, combinato con lo spostamento del pannello a destra con il componente @Lhc_fl. Studiando il codice nel componente che ho collegato, potresti essere in grado di rimettere il menu hamburger tra la ricerca e il profilo. Se ho capito la tua richiesta e il problema con la soluzione attuale creata da Lhc_fl.

Poiché utilizza già codice per spostare il menu, potrebbe avere dettagli nel codice come esempio da modificare per ottenere l’effetto desiderato che stai cercando.

Su mobile, il tuo screenshot è nella posizione desiderata che stai cercando in modalità Desktop.

Qualcuno con esperienza potrebbe essere in grado di estrarre anche il codice utilizzato su mobile e applicarlo al desktop. Tramite lo studio di “inspect element” sul desktop mentre si carica il sito in visualizzazione mobile.

Per la larghezza, c’è un nuovo componente per cambiare la larghezza del sito che potrebbe essere di interesse da esplorare.

1 Mi Piace

Sì, spero in questo. Hai ragione riguardo alle icone del menu mobile vs desktop.

1 Mi Piace