Skip to content
Sudonix

Custom badges

Solved Customisation

Did this solution help you?
Did you find the suggested solution useful? Why not buy me a coffee? It's a nice gesture, and a great way to show your appreciation 💗

Related Topics
  • DownPWundefined

    NodeBB socket with CloudFlare

    Unsolved Performance
    23
    1 Votes
    23 Posts
    2k Views
    phenomlabundefined

    @DownPW it’s your only realistic option at this stage.

  • DownPWundefined

    nodebb-plugin-custom-pages

    Solved Customisation
    5
    3 Votes
    5 Posts
    612 Views
    phenomlabundefined

    @DownPW it’s possible, yes, but you may inadvertently end up targeting other elements using the same class which of course isn’t desired.

    Can you provide a link in DM for me to review?

  • phenomlabundefined

    Add "author" badge to NodeBB posts using either CSS or jQuery

    Customisation
    1
    1 Votes
    1 Posts
    330 Views
    No one has replied
  • phenomlabundefined

    NodeBB v3 and Harmony Theme

    Discussion
    22
    13 Votes
    22 Posts
    2k Views
    phenomlabundefined

    Been playing with the user profile page this afternoon. Thought I’d post a video as I’m really pleased with how this came out

  • Pandaundefined

    Rotating homepage icons, gifs?

    Solved Configure
    2
    3 Votes
    2 Posts
    236 Views
    phenomlabundefined

    @eveh It’s not a GIF, no. It’s actually a webp file so made much smaller, and uses keyframes to control the rotation on hover. You can easily make your own though 🙂

    The CSS for that is as below

    @keyframes rotate180 { from { transform: rotate(0deg); } to { transform: rotate(180deg); } } @keyframes rotate0 { from { transform: rotate(180deg); } to { transform: rotate(0deg); } }

    Your milage may vary on the CSS below, as it’s custom for Sudonix, but this is the class that is used to control the rotate

    .header .forum-logo, img.forum-logo.head { max-height: 50px; width: auto; height: 30px; margin-top: 9px; max-width: 150px; min-width: 32px; display: inline-block; animation-name: rotate180, rotate0; animation-duration: 1000ms; animation-delay: 0s, 1000ms; animation-iteration-count: 1; animation-timing-function: linear; transition: transform 1000ms ease-in-out; }
  • crazycellsundefined

    Recent Cards plugin customization

    Solved Customisation
    21
    13 Votes
    21 Posts
    3k Views
    phenomlabundefined

    @pobojmoks that’s easily done by modifying the code provided here so that it targets background rather than border

    In essence, the below should work

    $(document).ready(function() { $(window).on('action:ajaxify.end', function(data) { $('.recent-card-container').each(function(i) { var dataId = $(this).attr("data-cid"); var color = $('[role="presentation"]', this).css("background-color"); console.log("data-cid " + dataId + " is " + color); $('[data-cid="' + dataId + '"] .recent-card').attr("style", "background-color: " + color); }); }); });
  • crazycellsundefined

    creating topic specific widgets

    Solved Customisation
    16
    10 Votes
    16 Posts
    1k Views
    phenomlabundefined

    @crazycells said in creating topic specific widgets:

    Additionally if hide class exists, why are we re-defining it?

    We’re not 🤭 I misspelled it - it should be hidden

  • JACundefined

    RSS parser script [NodeBB]

    Customisation
    47
    9 Votes
    47 Posts
    4k Views
    JACundefined

    @phenomlab said in RSS parser script [NodeBB]:

    @jac Not yet. Sorry. Have some other work commitments I need to prioritise. Hoping to get to this over the weekend.

    No worries at all mate, thanks 👍🏻