You can add banners in the component settings by defining the category right below the banner, a banner color and the heading text. There’s also an option to hide the default colored borders:
To add styles you can select the general class, as well as specific banners by category-id:
.category list .category-list-banner {
&.category-5 { [style a specific banner] }
&:after { [style the headings]}
}
This component only adds layout elements to the category page. So you can’t refer to these headings anywhere else on your site. Another caution: There’s no default page style Categories Only on mobile. It will always show featured topics as well.
That looks like expected behavior… The color slot takes any value that you can use as background-color in CSS. So when you give a hex value, it will stay the same color in different modes and themes.
If you actually don’t want a background color, you should state none or transparent.
If you want a background color that changes with modes, you’d need to state it with a CSS custom property: you could use one of Discourse’s pre-defined ones like var(--secondary-high). Or define some yourself, as explained in
Felice che ti piaccia il componente! Non sono sicuro del perché mi accusi di aver rubato il tuo lavoro, però…?
Realizzare questo componente è stato ispirato da questo argomento:
Avevo indirizzato l’OP alla tua soluzione, ma poi mi sono interessato a come risolvere questo problema senza codificare i template e decostruendo i valori da un elenco di impostazioni all’interno di scss. Quindi il codice del componente riguarda essenzialmente questa soluzione: https://meta.discourse.org/t/how-to-add-settings-to-your-discourse-theme/82557/52?u=nolo
Ma in ogni caso: se ritieni che abbia usato parte del tuo lavoro e mi sia dimenticato di dare credito, fammelo sapere e aggiornerò il primo post
Sì, per favore, mi piacerebbe ricevere almeno una qualche forma di credito. Ma dipende da te. Per il resto, sembra buono e consiglierò questo componente del tema nel mio post poiché rende le cose più facili per i nuovi utenti.
@ Nolo
Esiste un modo in TC, o con CSS nel tema, per allineare a sinistra il testo dell’intestazione, proprio come nel tuo secondo esempio).
Inoltre, esiste un modo (se non si utilizza un’immagine banner) per ridimensionare l’intestazione allo spessore di una riga di testo.
E se sì, è possibile ridimensionare il testo in modo che non sia così grande?
Certamente, puoi stilizzare i banner usando queste classi:
Se vuoi sovrascrivere le dichiarazioni esistenti sulla classe generale, dovrai usare la proprietà !important. Ad esempio, per gli stili che hai menzionato:
Questo perché gli stili sono effettivamente dichiarati sui banner specifici. Immagino che potrei migliorarlo nel componente, ma per ora dovresti sovrascrivere con important.
Grazie mille per questo componente!! Sto sviluppando un forum politico e poter applicare questo tipo di separazione è fondamentale.
Sebbene sia già un enorme miglioramento per il mio forum, farebbe una grande differenza se le intestazioni potessero essere referenziate tramite URL, perché ciò consentirebbe di creare pulsanti in cima al forum dai quali l’utente potrebbe navigare facilmente nella stessa pagina. Sarebbe una funzionalità estremamente agile se il forum (si spera) diventasse molto più grande. È attualmente possibile?
Grazie per il suggerimento @lisandro_iaffar. Sebbene questo componente fornisca solo una soluzione leggera che non modifica i modelli HTML. Se si desidera fare riferimento alle sezioni, è necessario utilizzare un approccio come quello offerto da GitHub - discourse/discourse-minimal-category-boxes.
Sono entusiasta di provarlo poiché ho creato troppe categorie e poterle organizzare in gruppi sarà di grande aiuto.
Lo saprò quando ci proverò, questo potrebbe anche essere un modo per lasciare le categorie vecchie e meno utilizzate fuori dalla pagina principale, giusto? Sarebbero comunque disponibili tramite la nuova barra laterale.
Sì, certo In realtà faccio quasi sempre selezioni di categorie su diversi elementi della pagina (barra laterale, intestazione, navbar, pagina categoria, ..) È come la struttura del sito di un sito web. È importante che sia ben organizzato, ma non è necessario che determini la tua presentazione dell’interfaccia utente.
Ciao @manuel vorrei sapere se questo fantastico componente funziona ancora dopo gli aggiornamenti del discorso, l’ho installato e non funziona per me, grazie in anticipo