Skip to content
Sudonix

[NODEBB] Help for my custom CSS

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 💗

  • Pandaundefined

    NodeBB upgrade now cant post

    Solved Bugs
    5
    2 Votes
    5 Posts
    191 Views
    phenomlabundefined

    @Panda yes, for some reason, that is the case. If you need an urgent response, it’s probably better to post here because of the time difference.

  • phenomlabundefined

    Targeting a disappearing element for its CSS

    Moved Let's Build It
    2
    +0
    5 Votes
    2 Posts
    212 Views
    DownPWundefined

    Nice. Very good tips Mark 😁

  • mventuresundefined

    NodeBB: Consent page

    Solved Configure
    16
    4 Votes
    16 Posts
    559 Views
    phenomlabundefined

    @DownPW I still do not see any issues.

  • DownPWundefined

    hover link effect

    Solved Customisation
    18
    6 Votes
    18 Posts
    614 Views
    phenomlabundefined

    @DownPW Looking at the underlying code, class start is being added on hover by jQuery in this function

    document.querySelectorAll(".button-gradient, .button-transparent").forEach((button) => { const style = getComputedStyle(button); const lines = document.createElement("div"); lines.classList.add("lines"); const groupTop = document.createElement("div"); const groupBottom = document.createElement("div"); const svg = createSVG( button.offsetWidth, button.offsetHeight, parseInt(style.borderRadius, 10) ); groupTop.appendChild(svg); groupTop.appendChild(svg.cloneNode(true)); groupTop.appendChild(svg.cloneNode(true)); groupTop.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); lines.appendChild(groupTop); lines.appendChild(groupBottom); button.appendChild(lines); button.addEventListener("pointerenter", () => { button.classList.add("start"); }); svg.addEventListener("animationend", () => { button.classList.remove("start"); }); }); })

    The CSS for start is below

    .button-gradient.start .lines svg, .button-transparent.start .lines svg { animation: stroke 0.3s linear; }

    And this is the corresponding keyframe

    @keyframes stroke { 30%, 55% { opacity: 1; } 100% { stroke-dashoffset: 5; opacity: 0; } }

    It’s using both CSS and SVG, so might not be a simple affair to replicate without the SVG files.

  • DownPWundefined

    New message CSS problem

    Unsolved Customisation
    11
    2 Votes
    11 Posts
    551 Views
    phenomlabundefined

    @DownPW hi. Sorry for digging up an old post, but I’m going through items still unresolved and was looking to get an understanding of where you are currently with this?

  • elhana fineundefined

    Editing a reputation for a user in a nodeBB based forum

    Solved Customisation
    9
    5 Votes
    9 Posts
    934 Views
    crazycellsundefined

    is there any way to see whose reputation is changed by this plugin?

  • DownPWundefined

    Bug Navbar CSS

    Solved Customisation
    3
    1 Votes
    3 Posts
    302 Views
    DownPWundefined

    Not better way.

    Thanks.

  • RiekMediaundefined

    NodeBB Discord Plugins

    Unsolved Customisation
    7
    0 Votes
    7 Posts
    813 Views
    phenomlabundefined

    @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 ?