Skip to content
Sudonix

tag icon in front of tags

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 💗

  • crazycellsundefined

    CSS code customization for the link preview plugin

    Solved Customisation
    4
    3 Votes
    4 Posts
    118 Views
    phenomlabundefined

    @crazycells said in CSS code customization for the link preview plugin:

    does OGProxy show the pdf previews as well?

    Not yet, but it could with a bit of additional code.

  • Pandaundefined

    Nodebb icon on google page

    Solved Customisation
    9
    4 Votes
    9 Posts
    582 Views
    phenomlabundefined

    @Panda It’s been raised multiple times, but only for the open source version, and not hosted.

  • phenomlabundefined

    Targeting a disappearing element for its CSS

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

    Nice. Very good tips Mark 😁

  • DownPWundefined

    hover link effect

    Solved Customisation
    18
    6 Votes
    18 Posts
    605 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.

  • crazycellsundefined

    fading in /tags page

    Solved Customisation
    32
    30 Votes
    32 Posts
    3k Views
    DownPWundefined

    Fix working perfectly 👍 🙂

  • crazycellsundefined

    CSS codes for fa-info icon

    Solved Customisation
    9
    6 Votes
    9 Posts
    459 Views
    crazycellsundefined

    I have just figured it out…

    it can be targeted with text-decoration-color:

    I was mistakenly using color

  • DownPWundefined

    [NODEBB] CSS Style Sheets SelectBox

    Locked Solved Customisation
    112
    24 Votes
    112 Posts
    13k Views
    phenomlabundefined

    @DownPW as discussed in PM

    Seems to have been solved with the new JS code that you added allowing the version CSS file change!!

    Cache problem therefore with the JS of the Switcher theme

    Based on this, I will close this thread and reference
    https://sudonix.com/topic/207/nodebb-help-for-my-custom-css/27

  • JACundefined

    Social icon (Nodebb)

    Solved Customisation
    7
    0 Votes
    7 Posts
    913 Views
    JACundefined

    @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

    73e805e1-997b-41bf-9259-51c5052ca8fc-image.png

    fixed 🙂