Skip to content

NodeBB customisation

Locked Customisation
332 4 274.3k 1
  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Itz probably a longshot anyway, but is there any way to change the link colour on the quotes to yellow?

    Like this ?

    5883be0c-e2f0-4677-a4ac-58a1ba86cee7-image.png

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557;
    }
    

    Yes mate, brilliant mate, will apply these changes later.

    Great to see how a few changes make it look a lot better 😁

    wrote on last edited by

    @jac Yep. Admittedly, I’ve taken some of the theming from Sudonix, but I’m ok with that.

  • @jac said in NodeBB customisation:

    look a bit more professional and cleaner

    Had another go at this. The best I’ve come up with is

    .recent-cards .recent-card-container .recent-card .recent-card-body {
        height: 143px;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 200px;
        max-width: 200px;
        line-height: 1.2;
        white-space: nowrap;
    }
    

    Which looks like the below

    3a53b0e8-0e22-4790-8428-f70ecdcdf403-image.png

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    look a bit more professional and cleaner

    Had another go at this. The best I’ve come up with is

    .recent-cards .recent-card-container .recent-card .recent-card-body {
        height: 143px;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 200px;
        max-width: 200px;
        line-height: 1.2;
        white-space: nowrap;
    }
    

    Which looks like the below

    3a53b0e8-0e22-4790-8428-f70ecdcdf403-image.png

    Thanks mate for all the efforts. I’ll leave it how it is for now and wait and see if it can be fixed sometime. Thank you for the efforts mate 😁.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    look a bit more professional and cleaner

    Had another go at this. The best I’ve come up with is

    .recent-cards .recent-card-container .recent-card .recent-card-body {
        height: 143px;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 200px;
        max-width: 200px;
        line-height: 1.2;
        white-space: nowrap;
    }
    

    Which looks like the below

    3a53b0e8-0e22-4790-8428-f70ecdcdf403-image.png

    Thanks mate for all the efforts. I’ll leave it how it is for now and wait and see if it can be fixed sometime. Thank you for the efforts mate 😁.

    wrote on last edited by

    Going to implement all of the above now…

    As for the footer widget I can’t remove the NodeBB text as I’m not on the laptop you, I’m happy to include phenomlab on there for all your efforts and continued help?

    Maybe something live Version 1 in the footer and then when a significant change is made the version number can be updated.

  • JAC JAC

    Going to implement all of the above now…

    As for the footer widget I can’t remove the NodeBB text as I’m not on the laptop you, I’m happy to include phenomlab on there for all your efforts and continued help?

    Maybe something live Version 1 in the footer and then when a significant change is made the version number can be updated.

    wrote on last edited by

    @jac said in NodeBB customisation:

    As for the footer widget I can’t remove the NodeBB text as I’m not on the laptop you, I’m happy to include phenomlab on there for all your efforts and continued help?

    Done 🙂

  • @jac said in NodeBB customisation:

    Itz probably a longshot anyway, but is there any way to change the link colour on the quotes to yellow?

    Like this ?

    5883be0c-e2f0-4677-a4ac-58a1ba86cee7-image.png

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Itz probably a longshot anyway, but is there any way to change the link colour on the quotes to yellow?

    Like this ?

    5883be0c-e2f0-4677-a4ac-58a1ba86cee7-image.png

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557;
    }
    

    For some reason this didn’t appear to work, would this change make any URLs in a quote yellow too?

    Many thanks.

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Itz probably a longshot anyway, but is there any way to change the link colour on the quotes to yellow?

    Like this ?

    5883be0c-e2f0-4677-a4ac-58a1ba86cee7-image.png

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557;
    }
    

    For some reason this didn’t appear to work, would this change make any URLs in a quote yellow too?

    Many thanks.

    wrote on last edited by

    @jac No - that just targets the mention name.

  • @jac No - that just targets the mention name.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac No - that just targets the mention name.

    For some reason it hasn’t worked mate?

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Many thanks as always!

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac No - that just targets the mention name.

    For some reason it hasn’t worked mate?

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Many thanks as always!

    wrote on last edited by

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac No - that just targets the mention name.

    For some reason it hasn’t worked mate?

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Many thanks as always!

    I think it’s because the mentions colour is set to white, I’ll find the other colour and change it.

  • JAC JAC

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac No - that just targets the mention name.

    For some reason it hasn’t worked mate?

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Many thanks as always!

    I think it’s because the mentions colour is set to white, I’ll find the other colour and change it.

    wrote on last edited by

    @jac said in NodeBB customisation:

    I think it’s because the mentions colour is set to white, I’ll find the other colour and change it.

    Use this

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557 !important;
    }
    
  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac No - that just targets the mention name.

    For some reason it hasn’t worked mate?

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Many thanks as always!

    wrote on last edited by

    @jac said in NodeBB customisation:

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Can you send me a URL where this is an issue to save me trawling through your forum ? 🙂

  • @jac said in NodeBB customisation:

    I think it’s because the mentions colour is set to white, I’ll find the other colour and change it.

    Use this

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557 !important;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    I think it’s because the mentions colour is set to white, I’ll find the other colour and change it.

    Use this

    blockquote .plugin-mentions-user.plugin-mentions-a {
        color: #ffc557 !important;
    }
    

    Fantastic mate, that’s sorted it 😁😁

  • @jac said in NodeBB customisation:

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Can you send me a URL where this is an issue to save me trawling through your forum ? 🙂

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Can you send me a URL where this is an issue to save me trawling through your forum ? 🙂

    Sure… here

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Can you send me a URL where this is an issue to save me trawling through your forum ? 🙂

    Sure… here

    wrote on last edited by

    It’s probably my fault as I’ve chosen a background colour that natively clashes, would you prefer me to change the quote colour instead?

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac said in NodeBB customisation:

    Would there be a way to change the URL colour in quote to stand out or is that too difficult?

    Can you send me a URL where this is an issue to save me trawling through your forum ? 🙂

    Sure… here

    wrote on last edited by

    @jac Use this

    blockquote a {
        color: #ffc557;
    }
    

    You’ll need a hover class as well otherwise the text will disappear when hovered over - use this

    blockquote a:hover {
        color: #db9716;
    }
    
  • @jac Use this

    blockquote a {
        color: #ffc557;
    }
    

    You’ll need a hover class as well otherwise the text will disappear when hovered over - use this

    blockquote a:hover {
        color: #db9716;
    }
    
    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Use this

    blockquote a {
        color: #ffc557;
    }
    

    You’ll need a hover class as well otherwise the text will disappear when hovered over - use this

    blockquote a:hover {
        color: #db9716;
    }
    

    Worked a treat mate, thank you very much as always, a massive help! 😁😁

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Use this

    blockquote a {
        color: #ffc557;
    }
    

    You’ll need a hover class as well otherwise the text will disappear when hovered over - use this

    blockquote a:hover {
        color: #db9716;
    }
    

    Worked a treat mate, thank you very much as always, a massive help! 😁😁

    wrote on last edited by

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac Use this

    blockquote a {
        color: #ffc557;
    }
    

    You’ll need a hover class as well otherwise the text will disappear when hovered over - use this

    blockquote a:hover {
        color: #db9716;
    }
    

    Worked a treat mate, thank you very much as always, a massive help! 😁😁

    I think all the changes may have affected this.

    Is there any way to replicate colours on the tags page for the widget?

    Sorry to be a pain… 🚕

  • JAC JAC

    @jac said in NodeBB customisation:

    @phenomlab said in NodeBB customisation:

    @jac Use this

    blockquote a {
        color: #ffc557;
    }
    

    You’ll need a hover class as well otherwise the text will disappear when hovered over - use this

    blockquote a:hover {
        color: #db9716;
    }
    

    Worked a treat mate, thank you very much as always, a massive help! 😁😁

    I think all the changes may have affected this.

    Is there any way to replicate colours on the tags page for the widget?

    Sorry to be a pain… 🚕

    wrote on last edited by

    @jac Can you provide a screenshot ? Sorry. Not entirely sure I understand.

  • @jac Can you provide a screenshot ? Sorry. Not entirely sure I understand.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac Can you provide a screenshot ? Sorry. Not entirely sure I understand.

    IMG_20211008_211530.jpg

  • JAC JAC

    @phenomlab said in NodeBB customisation:

    @jac Can you provide a screenshot ? Sorry. Not entirely sure I understand.

    IMG_20211008_211530.jpg

    wrote on last edited by

    @jac did you add any additional CSS other than what I provided ? I’m surprised this is impacted as the classes are completely different.

  • @jac did you add any additional CSS other than what I provided ? I’m surprised this is impacted as the classes are completely different.

    wrote on last edited by

    @phenomlab said in NodeBB customisation:

    @jac did you add any additional CSS other than what I provided ? I’m surprised this is impacted as the classes are completely different.

    No mate I didn’t.


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.
  • 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] Welcome Message

    Solved Customisation css html nodebb
    20
    2
    13 Votes
    20 Posts
    9k Views
    phenomlab
    @DownPW the ‘js’ code for the banner takes the time from the client, so what it displays really depends on the regional settings for the operating system. I’ve not seen this issue myself but would like to see some examples of screenshots if possible.
  • 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
  • Social icon (Nodebb)

    Solved Customisation nodebb social
    7
    0 Votes
    7 Posts
    3k Views
    JAC
    @phenomlab said in Social icon (Nodebb): @jac I just tested my theory around using the OG image, and according to the Twitter card validator, it works fine [image: 73e805e1-997b-41bf-9259-51c5052ca8fc-image.png] fixed
  • 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.