Skip to content

chat list navbar

Solved Customisation
30 2 13.5k 1
  • @phenomlab

    I have a problem on my themes.

    Example I Have this on my css files :

    .btn-group>.btn:last-child:not(:first-child), .btn-group>.dropdown-toggle:not(:first-child) {
        color: var(--first-color) !important;
    }
    

    But this code is not taken into account 😞

    7880cacd-d49c-4fda-99bc-bddc5967b06c-image.png

    if i change in dev console (in live) it’s ok

    Can you help me with that ?

    wrote on last edited by
    #20

    @DownPW this sounds more like a caching issue to me. Do you get the same thing in an incognito session ?

  • @DownPW this sounds more like a caching issue to me. Do you get the same thing in an incognito session ?

    wrote on last edited by
    #21

    @phenomlab said in chat list navbar:

    @DownPW this sounds more like a caching issue to me. Do you get the same thing in an incognito session ?

    yes 😞

  • @phenomlab said in chat list navbar:

    @DownPW this sounds more like a caching issue to me. Do you get the same thing in an incognito session ?

    yes 😞

    wrote on last edited by DownPW
    #22

    I just installed firefox and it’s the same so for me it’s not a cache problem

    Edit @phenomlab

    For example, in fortifem theme, the code is correctly interpreted but not on Nightprowler theme but the code is the same !

    Fortifem its’ ok :
    https://i.imgur.com/Y85sVBi.gif

    Night prowler is not Ok withe the same code as Fortifem (variable) :

    https://i.imgur.com/tWus88b.gif

    All the rest of theme is OK

  • I just installed firefox and it’s the same so for me it’s not a cache problem

    Edit @phenomlab

    For example, in fortifem theme, the code is correctly interpreted but not on Nightprowler theme but the code is the same !

    Fortifem its’ ok :
    https://i.imgur.com/Y85sVBi.gif

    Night prowler is not Ok withe the same code as Fortifem (variable) :

    https://i.imgur.com/tWus88b.gif

    All the rest of theme is OK

    wrote on last edited by
    #23

    @DownPW I’ll have a look at this tomorrow. Sounds like you have values being overridden somewhere

  • @DownPW I’ll have a look at this tomorrow. Sounds like you have values being overridden somewhere

    wrote on last edited by
    #24

    @phenomlab

    I got better and I think I understand a little more the problem

    I declared the code in the ACP (it was not the case yesterday - just in the CSS file yesterday) and it applies. Normal

    On the other hand, it only applies the code of the ACP and not that of the CSS file.

  • wrote on last edited by DownPW
    #25

    EDIT @phenomlab :

    I just tested by deleting the entire CSS file except the button code and it is taken into account.

    There is therefore a CSS variable which prevents the execution of the code, but from there to know which one 😲

  • wrote on last edited by
    #26

    EDIT2:

    I find it… 😵 👍

  • wrote on last edited by DownPW
    #27

    hi @phenomlab

    I have this little avatar mismatch in the chat menu (just in Full mode) but only some of my themes (exemple: Daystalker) and I can’t find what’s wrong.

    An idear mark?

    b113f15a-2d3c-4667-9d6a-1380a0b78383-image.png

  • wrote on last edited by DownPW
    #28

    Hmm I find it the problem is that :

    .chats-list>li {
      padding: 0.5em;
      height: 80px; 
    }
    
  • Hmm I find it the problem is that :

    .chats-list>li {
      padding: 0.5em;
      height: 80px; 
    }
    
    wrote on last edited by
    #29

    @DownPW yes, you may need to be more specific with the target. Let me know

  • wrote on last edited by
    #30

    No no it’s ok @phenomlab
    I just comment the 2 lines mentionned aboves 😉


Did this solution help you?
Did you find the suggested solution useful? Support 💗 Sudonix with a coffee ☕
If your organisation needs deeper expertise around infrastructure, security, or technology leadership, learn more about Phenomlab Ltd. Many of the deeper technical guides behind Sudonix are published there.

Related Topics
  • 2 Votes
    1 Posts
    648 Views
    No one has replied
  • navbar

    Solved Customisation navbar harmony
    2
    2 Votes
    2 Posts
    1k Views
    phenomlab
    Marking as resolved, based on https://community.nodebb.org/topic/18625/navbar/2
  • Widget | CSS customization

    Solved WordPress css
    53
    17 Votes
    53 Posts
    19k Views
    phenomlab
    @Sala the only way you can achieve this is to use a robots.txt file and disallow access to those links.
  • The best css to customize our logo?

    Solved Customisation css
    2
    1 Votes
    2 Posts
    3k Views
    phenomlab
    @Sala This should look better .sidenav .navbar-brand { padding-top: 0.5rem; padding-bottom: 0.5rem; } [image: e5cec20e-be36-4ee8-9129-fd11ad4656ac-image.png] You can increase the top and bottom padding by increasing the values above.
  • hover link effect

    Solved Customisation css link hover
    18
    1
    6 Votes
    18 Posts
    7k Views
    phenomlab
    @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.
  • Blinking text Effect

    Customisation nodebb text effect css
    3
    5 Votes
    3 Posts
    2k Views
    DownPW
    @phenomlab I love it too @phenomlab said in Blinking text Effect: Has that “broken neon light” look that you see in films. It’s exactly that, kind of old neon signs of bar or pubs a bit cyberpunk too
  • Multiple link on one ico non Navbar

    Solved Customisation links css navbar
    7
    1
    2 Votes
    7 Posts
    3k Views
    DownPW
    yeah you’re right @phenomlab. Problem of NodeBB Version
  • [NODEBB] CSS Style Sheets SelectBox

    Locked Solved Customisation css
    112
    24 Votes
    112 Posts
    65k Views
    phenomlab
    @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