Skip to content

NodeBB customisation

Locked Customisation
332 4 274.3k 1
  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Try this

    .topic .pagination-block {
        background-color: #ffc557;
    }
    .topic .pagination-block .progress-bar {
        background-color: #194f90;
    }
    .topic .pagination-block .wrapper,
    .topic .pagination-block .pagination-text  {
        color: #ffffff;
    }
    

    Fantastic mate, worked a treat again 😁.

    Is the font a little more complicated to do?

    wrote on last edited by

    @jac Nope. Do you want the same as is here, but global (for example, the default everywhere) ?

  • @jac Nope. Do you want the same as is here, but global (for example, the default everywhere) ?

    wrote on last edited by

    @phenomlab yes please mate, it’s the possible at all? - happy to choose a different font as wary of copying mate.

    Many thanks as always!

  • JAC JAC

    @phenomlab yes please mate, it’s the possible at all? - happy to choose a different font as wary of copying mate.

    Many thanks as always!

    wrote on last edited by

    Although the font did look great last time. I can’t remember if the header was a different font 😑.

  • JAC JAC

    Although the font did look great last time. I can’t remember if the header was a different font 😑.

    wrote on last edited by

    @jac Let me have a play around with this.

  • @jac Let me have a play around with this.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Let me have a play around with this.

    Many thanks mate.

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    wrote on last edited by

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    wrote on last edited by

    @jac I fixed that a while back

    5ef8bafc-394b-4c8e-a938-ec3a40722a53-image.png

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    wrote on last edited by

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    Apologies it’s this mate, it was hiding at the start of the quote.

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    Apologies it’s this mate, it was hiding at the start of the quote.

    wrote on last edited by
    This post is deleted!
  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    Apologies it’s this mate, it was hiding at the start of the quote.

    wrote on last edited by

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    Apologies it’s this mate, it was hiding at the start of the quote.

    Screenshot_2021-05-06-21-28-41-777_com.android.chrome.jpg

    IMG_20210512_092944.jpg

    Title font appears to be bold compared? Although possibly same font.

  • JAC JAC

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac It’s in the above post 😉

    Apologies! 😁

    Worked a treat! Many thanks again 👍🏻.

    Am ok to keep posting little tweaks that I am looking to change?

    Looking to change the font & number of read posts.

    IMG_20210927_212333.jpg

    Looking to change this to blue white a white font and then as the posts are read it changes to yellow?

    Is this something that is possible? I seem to remember it working out well on the last installation.

    Many thanks.

    I’ve actually found a screenshot of how grtit looked last time. The font etc and the bottom bar looked great!
    IMG_20210512_092944.jpg

    Is there any way to change the member name colour on the quote? As this clashes with the colour.

    Thanks 👍🏻.

    IMG_20210928_223447.jpg

    Youll see the title don’t appears to be different or bold.

    Many thanks as always!

    Apologies it’s this mate, it was hiding at the start of the quote.

    Screenshot_2021-05-06-21-28-41-777_com.android.chrome.jpg

    IMG_20210512_092944.jpg

    Title font appears to be bold compared? Although possibly same font.

    wrote on last edited by

    @jac said in NodeBB customisation:

    Title font appears to be bold compared? Although possibly same font.

    Ok, add this

    .topic h1 .topic-title {
        font-weight: 600;
    }
    
  • @jac said in NodeBB customisation:

    Title font appears to be bold compared? Although possibly same font.

    Ok, add this

    .topic h1 .topic-title {
        font-weight: 600;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Title font appears to be bold compared? Although possibly same font.

    Ok, add this

    .topic h1 .topic-title {
        font-weight: 600;
    }
    

    Worked a treat again my friend, thank you very much as always!

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Title font appears to be bold compared? Although possibly same font.

    Ok, add this

    .topic h1 .topic-title {
        font-weight: 600;
    }
    

    Worked a treat again my friend, thank you very much as always!

    wrote on last edited by

    There’s probably going to be more changes on the way, if that’s ok? But like I’ve said previously I’m more than happy to put the Phenomlab stamp on it 👍🏻.

  • JAC JAC

    There’s probably going to be more changes on the way, if that’s ok? But like I’ve said previously I’m more than happy to put the Phenomlab stamp on it 👍🏻.

    wrote on last edited by

    I think this was done last time… Is there any way to add … To the slider if it has a certain amount of characters?

    Many thanks.

  • JAC JAC

    There’s probably going to be more changes on the way, if that’s ok? But like I’ve said previously I’m more than happy to put the Phenomlab stamp on it 👍🏻.

    wrote on last edited by

    @jac Fine. Just keep using this thread as we’ll document the changes along the way

  • @jac Fine. Just keep using this thread as we’ll document the changes along the way

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Fine. Just keep using this thread as we’ll document the changes along the way

    Many thanks mate, sounds good to me 😁.

  • JAC JAC

    I think this was done last time… Is there any way to add … To the slider if it has a certain amount of characters?

    Many thanks.

    wrote on last edited by phenomlab

    @jac Something like this ?

    6845e44d-bfae-4e7b-925d-de3fb41c4e1d-image.png

    .recent-cards .recent-card-container .recent-card .topic-info p {
        max-width: 200px;
        margin: 0;
        width: 200px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
    }
    
  • @jac Something like this ?

    6845e44d-bfae-4e7b-925d-de3fb41c4e1d-image.png

    .recent-cards .recent-card-container .recent-card .topic-info p {
        max-width: 200px;
        margin: 0;
        width: 200px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Something like this ?

    6845e44d-bfae-4e7b-925d-de3fb41c4e1d-image.png

    .recent-cards .recent-card-container .recent-card .topic-info p {
        max-width: 200px;
        margin: 0;
        width: 200px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
    }
    

    Thanks mate, yes like that but with the … At the end of the last word in the box?

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Something like this ?

    6845e44d-bfae-4e7b-925d-de3fb41c4e1d-image.png

    .recent-cards .recent-card-container .recent-card .topic-info p {
        max-width: 200px;
        margin: 0;
        width: 200px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 1.2;
    }
    

    Thanks mate, yes like that but with the … At the end of the last word in the box?

    wrote on last edited by phenomlab

    @jac That’s not as simple as it looks unfortunately. The text isn’t formatted as a single line so the artefact of that is the multiple three dots you can see. It’s possible to consolidate this into one line, but it can only be for that particular view meaning you need explicit CSS.

    Happy to have another look, but it’s a lot of work for very little (cosmetic) gain.

  • @jac That’s not as simple as it looks unfortunately. The text isn’t formatted as a single line so the artefact of that is the multiple three dots you can see. It’s possible to consolidate this into one line, but it can only be for that particular view meaning you need explicit CSS.

    Happy to have another look, but it’s a lot of work for very little (cosmetic) gain.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac That’s not as simple as it looks unfortunately. The text isn’t formatted as a single line so the artefact of that is the multiple three dots you can see. It’s possible to consolidate this into one line, but it can only be for that particular view meaning you need explicit CSS.

    Happy to have another look, but it’s a lot of work for very little (cosmetic) gain.

    Thanks for looking mate, I seem to remember it was possible last time but I can’t find a screenshot to show you unfortunately.

    No sweat mate, I just thought it would look a bit more professional and cleaner 👍🏻.


Related Topics
  • Whitespace fixes in Nodebb

    Solved Customisation nodebb
    18
    2
    7 Votes
    18 Posts
    6k Views
    phenomlab
    @Panda Just circling back here with something of an update (which I think you’ll like). I’ve completely restructured the ranking system. There are now less ranks, with a higher point threshold to reach them. More importantly, if you reload the site, you’ll notice that the ranks are now icons. I also removed the “Author” badge, and made this a single icon, which (to me) looks much better.
  • who is read NodeBB

    Customisation read post nodebb
    6
    0 Votes
    6 Posts
    3k Views
    phenomlab
    @cagatay You should ask in the NodeBB forums. Perhaps reference this post https://discuss.flarum.org/d/23066-who-read
  • NodeBB inline videoplayer

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

    Solved Customisation css nodebb javascript
    2
    1
    3 Votes
    2 Posts
    2k Views
    phenomlab
    @pwsincd welcome to sudonix, and thanks for the comments. What your looking for is here https://sudonix.com/topic/195/nodebb-welcome-message/3?_=1648295651358
  • [NODEBB] Scroll Button

    Solved Customisation css javascript html scroll button
    7
    1
    0 Votes
    7 Posts
    3k Views
    phenomlab
    @downpw ooops. Forgot that. Thanks for adding.
  • 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
  • NodeBB Discord Plugins

    Unsolved Customisation nodebb discord plugin
    7
    0 Votes
    7 Posts
    4k Views
    phenomlab
    @RiekMedia hi. Just following up on this thread (I know it’s old) but was curious to understand if it’s still an issue or not ?
  • NodeBB Design help

    Solved Customisation
    8
    3
    2 Votes
    8 Posts
    4k Views
    phenomlab
    @riekmedia I’ve applied some new CSS to your site. Can you reload the page and try again ? For the record, this is what I added #footer { background: #2d343e; border-top: 4px solid #2d343e; font-size: 0.9em; margin-top: 70px; padding: 80px 0 0; position: relative; clear: both; bottom: 0; left: 0; right: 0; z-index: 1000; margin-left: -15px; margin-right: -338px; } The /categories page seems a bit messed up, so looking at that currently EDIT - issued some override CSS in the CATEGORIES widget <!--- CSS fix for overspill on /categories page - DO NOT DELETE --> <style> #footer { margin-right: -45px; } </style> That should resolve the /categories issue.