Section

dnkls

nodebb-plugin-category-sections

I try it before i open this topic, and this plugin don't work with Persona themes, you can see issue about that on github wich you show me.
But as we see this example http://i.imgur.com/0PRRV6m.png use Persona themes and section work and look very nise and very useful.
Plz if some one know how make section like that http://i.imgur.com/0PRRV6m.png show me how

yariplus

@dnkls If you want exactly what's on that site, you can copy their css by just right clicking on it, and putting the css in your custom header section.

yariplus

If you want to use the plugin, replacing this line will fix it.

tjs doesn't return exact matches. · yariplus/nodebb-plugin-category-sections@8f16a09

This plugin allows you to organize the categories on your homepage into individual sections. - tjs doesn't return exact matches. · yariplus/nodebb-plugin-category-sections@8f16a09

GitHub (github.com)

zsbox10

no no no

dnkls

Not working((( im realy wont the same as in example http://i.imgur.com/0PRRV6m.png but cant find and how they add font awsome icon? Maybe this forum with custom Persona theme?

yariplus

It works.

There's no custom theme.They are just using plain old CSS. The CSS will work on any theme. Learn how the CSS works.

(puu.sh)

Here it is working on my forum.

(puu.sh)

Alex Bro

@yariplus Bro may be you try post your css code below not just screen shot )

Alex Bro

@yariplus Can you add the text version of your css?

yariplus

@alex-bro

ul.categories [data-cid="1"]::before {
    content: "Money";
    background: #1e1f33 url(https://i.imgur.com/liB8eUb.png) no-repeat 10px center;
}

ul.categories [data-cid="3"]::before {
    content: "Blocks";
    background: #1e1f33 url(https://i.imgur.com/eSUaQuV.png) no-repeat 10px center;
}


ul.categories [data-cid="1"]::before, ul.categories [data-cid="3"]::before {
    color: #fff;
    display: block;
    position: relative;
    height: 40px;
    line-height: 40px;
    font-size: 15px;
    border-bottom: 1px #0c2b51 solid;
    text-align: left;
    padding-left: 70px;
    font-style: normal;
    text-transform: uppercase;
    margin-bottom: 20px;
    font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
    border-radius: 5px;
    margin-left: 10px;
}

Alex Bro

@yariplus said in Section:

ul.categories [data-cid="1"]::before {
content: "Money";
background: #1e1f33 url(https://i.imgur.com/liB8eUb.png) no-repeat 10px center;
}

ul.categories [data-cid="3"]::before {
content: "Blocks";
background: #1e1f33 url(https://i.imgur.com/eSUaQuV.png) no-repeat 10px center;
}

ul.categories [data-cid="1"]::before, ul.categories [data-cid="3"]::before {
color: #fff;
display: block;
position: relative;
height: 40px;
line-height: 40px;
font-size: 15px;
border-bottom: 1px #0c2b51 solid;
text-align: left;
padding-left: 70px;
font-style: normal;
text-transform: uppercase;
margin-bottom: 20px;
font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
border-radius: 5px;
margin-left: 10px;
}

Good! fnx