Skip to content

NodeBB customisation

Locked Customisation
332 4 274.3k 1
  • JAC JAC

    Looking to add a line / divider under eachother comment to seperate them properly, is this possible?

    Many thanks.

    wrote on last edited by

    @jac Something like this ?

    8b5277ff-fee0-45ff-bf97-349e5528511f-image.png

    .topic .posts.timeline .timeline-event:not(:last-child), .topic .posts.timeline>[component=post]:not(:last-child) {
        border-bottom: 1px solid #eeeeee;
    }
    
  • @jac Something like this ?

    8b5277ff-fee0-45ff-bf97-349e5528511f-image.png

    .topic .posts.timeline .timeline-event:not(:last-child), .topic .posts.timeline>[component=post]:not(:last-child) {
        border-bottom: 1px solid #eeeeee;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Something like this ?

    8b5277ff-fee0-45ff-bf97-349e5528511f-image.png

    .topic .posts.timeline .timeline-event:not(:last-child), .topic .posts.timeline>[component=post]:not(:last-child) {
        border-bottom: 1px solid #eeeeee;
    }
    

    Thanks Mark, I’ll apply this when I can.

    As for the tags in the screenshot are they generally big or it is the screenshot that is playing tricks? 😉.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Something like this ?

    8b5277ff-fee0-45ff-bf97-349e5528511f-image.png

    .topic .posts.timeline .timeline-event:not(:last-child), .topic .posts.timeline>[component=post]:not(:last-child) {
        border-bottom: 1px solid #eeeeee;
    }
    

    Thanks Mark, I’ll apply this when I can.

    As for the tags in the screenshot are they generally big or it is the screenshot that is playing tricks? 😉.

    wrote on last edited by phenomlab

    @jac said in NodeBB customisation:

    are they generally big or it is the screenshot that is playing tricks?

    They’re big. I noticed that. It’s because of the tags page we recently changed to get the Stockport colour layout. Use this to fix it

    .tag-list .tag {
        height: 26px;
        border-radius: 4px;
        margin-left: 5px;
    }
    
  • @jac said in NodeBB customisation:

    are they generally big or it is the screenshot that is playing tricks?

    They’re big. I noticed that. It’s because of the tags page we recently changed to get the Stockport colour layout. Use this to fix it

    .tag-list .tag {
        height: 26px;
        border-radius: 4px;
        margin-left: 5px;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    are they generally big or it is the screenshot that is playing tricks?

    They’re big. I noticed that. It’s because of the tags page we recently changed to get the Stockport colour layout. Use this to fix it

    .tag-list .tag {
        height: 26px;
        border-radius: 4px;
        margin-left: 5px;
    }
    

    Many thanks mate, that has fixed the issue 😁.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    are they generally big or it is the screenshot that is playing tricks?

    They’re big. I noticed that. It’s because of the tags page we recently changed to get the Stockport colour layout. Use this to fix it

    .tag-list .tag {
        height: 26px;
        border-radius: 4px;
        margin-left: 5px;
    }
    

    Many thanks mate, that has fixed the issue 😁.

    wrote on last edited by

    Is there a way to change the colour of the online status?

    Many thanks 😁.

  • JAC JAC

    Is there a way to change the colour of the online status?

    Many thanks 😁.

    wrote on last edited by

    @jac are you referring to the green dot ? What would you like to change ?

  • @jac are you referring to the green dot ? What would you like to change ?

    wrote on last edited by

    @phenomlab yes mate,

    I was thinking blue when online and yellow when offline

    Many thanks

  • JAC JAC

    @phenomlab yes mate,

    I was thinking blue when online and yellow when offline

    Many thanks

    wrote on last edited by

    @jac Ok, but I’m not sure this is going to be a good idea. On/Off typically aligns itself to “traffic light” colours, so if anything, it should be green and red (or grey for “offline”).

  • @jac Ok, but I’m not sure this is going to be a good idea. On/Off typically aligns itself to “traffic light” colours, so if anything, it should be green and red (or grey for “offline”).

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Ok, but I’m not sure this is going to be a good idea. On/Off typically aligns itself to “traffic light” colours, so if anything, it should be green and red (or grey for “offline”).

    That’s a fair point mate, probably just change the offline to red then if possible at all?

    Many thanks mate.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Ok, but I’m not sure this is going to be a good idea. On/Off typically aligns itself to “traffic light” colours, so if anything, it should be green and red (or grey for “offline”).

    That’s a fair point mate, probably just change the offline to red then if possible at all?

    Many thanks mate.

    wrote on last edited by RiekMedia

    @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    
  • @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    
    wrote on last edited by

    @riekmedia said in NodeBB customisation:

    @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    

    Many thanks for the code that has worked. 👍🏻.

    I’ll not be much help technical wise I’m afraid on here but it’s great to see others posting and helping out too 😁.

  • JAC JAC

    @riekmedia said in NodeBB customisation:

    @jac with the css the offline point changes from gray to red

    .status.offline {
        color:red;
        
    }
    

    Many thanks for the code that has worked. 👍🏻.

    I’ll not be much help technical wise I’m afraid on here but it’s great to see others posting and helping out too 😁.

    wrote on last edited by JAC

    Is there any way to style this widget at all?

    IMG_20211108_210405.jpg

    Image uploaded successfully 👍🏻😉.

  • JAC JAC

    Is there any way to style this widget at all?

    IMG_20211108_210405.jpg

    Image uploaded successfully 👍🏻😉.

    wrote on last edited by

    @jac yes, there is. What do you have in mind ?

  • JAC JAC

    Is there any way to style this widget at all?

    IMG_20211108_210405.jpg

    Image uploaded successfully 👍🏻😉.

    wrote on last edited by

    Unsure if it’s possible but for the title background to be in yellow that’s used throughout the forum and then the main background to be blue with white font?

    I’m unsure if this is poss for individual widgets however if this can be achieved that would look great!

    Many thanks.

  • JAC JAC

    Unsure if it’s possible but for the title background to be in yellow that’s used throughout the forum and then the main background to be blue with white font?

    I’m unsure if this is poss for individual widgets however if this can be achieved that would look great!

    Many thanks.

    wrote on last edited by

    Basically I’m looking to improve and edit things where I can, so little changes here and there that I think will make a difference 😁.

  • JAC JAC

    Unsure if it’s possible but for the title background to be in yellow that’s used throughout the forum and then the main background to be blue with white font?

    I’m unsure if this is poss for individual widgets however if this can be achieved that would look great!

    Many thanks.

    wrote on last edited by

    @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

  • @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    wrote on last edited by

    @phenomlab that definitely sounds great if it is possible 😁.

  • @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    Interested to see how this would look.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I’m unsure if this is poss for individual widgets

    Not “out of the box” but absolutely possible with the use of ID attributes once added to the widgets themselves.

    Interested to see how this would look.

    wrote on last edited by

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    
  • @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac It’ll look like this

    942f1f6d-3e0f-4e91-a6d1-b351fdec45b7-image.png

    CSS (already applied to your forum)

    .panel-heading.custom {
        background: #ffc557;
        color: #194F90;
    }
    .panel-body.custom2 {
        background: #194F90;
        color: #ffffff;
    }
    .panel-body.custom2 small {
        color: #ffffff;
        font-size: 40%;
    }
    .row.forum-stats {
        margin-left: 5px;
        margin-right: 5px;
    }
    

    Wow that looks great!! 😁😁


Related Topics
  • Forum customisation

    Customisation nodebb forum customised
    11
    2
    6 Votes
    11 Posts
    3k Views
    JAC
    Thank you Mark, the changes look fantastic!!
  • NodeBB recent cards customisation

    Solved Customisation nodebb recent cards
    3
    1
    2 Votes
    3 Posts
    1k Views
    JAC
    @phenomlab thank you very much for the assistance Mark, massively appreciated as always. The great thing about this is it’s all documented for other NodeBB users that come looking for solutions . Looks far better .
  • Forum Icons NodeBB

    Solved Customisation icons forum nodebb
    13
    0 Votes
    13 Posts
    5k Views
    phenomlab
    @cagatay That matches what I see [image: 4f0f858d-9812-42b1-9f61-ffb13d31dccd-image.png]
  • NodeBB inline videoplayer

    Solved Customisation nodebb
    12
    3 Votes
    12 Posts
    5k Views
    Panda
    @phenomlab YAY! It works Thanks so much
  • [NODEBB] Stats

    Unsolved Customisation plugin stats script
    20
    1
    2 Votes
    20 Posts
    6k Views
    JAC
    @phenomlab said in [NODEBB] Stats: @jac or I land up fixing it I wouldn’t put it past you
  • NodeBB Footer

    Solved Customisation footer nodebb
    10
    1 Votes
    10 Posts
    4k Views
    JAC
    @phenomlab said in NodeBB Footer: @jac and you. Hope all is well and you recover quickly Thanks pal
  • Forum customisation

    Customisation forum customise
    17
    3 Votes
    17 Posts
    6k Views
    JAC
    @jac said in Forum customisation: @phenomlab said in Forum customisation: @jac 100%. Just setting up some free time. I’m on annual leave from work offer the coming 2 weeks so hopefully will have a bit more time then. Not a problem Mark, I don’t wish for you to use all your spare time doing that, just do it when you can, no issues I know you’re busy doing other things but when you get a chance mate I’m happy for this to go ahead along with the RSS script.
  • Customising NodeBB

    Locked Customisation nodebb
    3
    0 Votes
    3 Posts
    3k Views
    phenomlab
    Closing this thread as a duplicate of https://sudonix.com/topic/12/nodebb-customisation