Skip to content

is "night mode" shifting the forum several pixels up?

Solved Configure
8 2 2.5k 1
  • wrote on last edited by
    #1

    I was observing this in our forum for a very long time. Since nodebb community forum does not have night mode installed, I was not able to check there. However, if I click the night mode here, it looks like everything (including boxes, writings, bars, avatars, icons etc) is shifted a little bit up… It is only several pixels I guess, but definitely I can feel a difference before/after…

    Do you observe this or am I hallucinating? 😵 🤔

  • @phenomlab good to hear that I am not alone… 😄

    I do not know the reason for sure yet, but I will report here if I can find a clue…

    wrote on last edited by
    #4

    @crazycells Should be fixed now. Was being caused by some missing margins (left and right) and an odd border: none; setting which should not have been there. If you alternate between the two now, it should look correct.

  • I was observing this in our forum for a very long time. Since nodebb community forum does not have night mode installed, I was not able to check there. However, if I click the night mode here, it looks like everything (including boxes, writings, bars, avatars, icons etc) is shifted a little bit up… It is only several pixels I guess, but definitely I can feel a difference before/after…

    Do you observe this or am I hallucinating? 😵 🤔

    wrote on last edited by
    #2

    @crazycells no, you’re not hallucinating. I’ve noticed this myself and need to fix it. I’m suspecting rogue padding or margin somewhere.

  • @crazycells no, you’re not hallucinating. I’ve noticed this myself and need to fix it. I’m suspecting rogue padding or margin somewhere.

    wrote on last edited by
    #3

    @phenomlab good to hear that I am not alone… 😄

    I do not know the reason for sure yet, but I will report here if I can find a clue…

  • @phenomlab good to hear that I am not alone… 😄

    I do not know the reason for sure yet, but I will report here if I can find a clue…

    wrote on last edited by
    #4

    @crazycells Should be fixed now. Was being caused by some missing margins (left and right) and an odd border: none; setting which should not have been there. If you alternate between the two now, it should look correct.

  • phenomlab phenomlab has marked this topic as solved on
  • @crazycells Should be fixed now. Was being caused by some missing margins (left and right) and an odd border: none; setting which should not have been there. If you alternate between the two now, it should look correct.

    wrote on last edited by
    #5

    @phenomlab yes, it is fixed. is this the code I should use?

    body.lights-out {
    border: none;
    }
    
    
  • @phenomlab yes, it is fixed. is this the code I should use?

    body.lights-out {
    border: none;
    }
    
    
    wrote on last edited by
    #6

    @crazycells You should actually remove the border: none;

  • @crazycells You should actually remove the border: none;

    wrote on last edited by
    #7

    @phenomlab said in is "night mode" shifting the forum several pixels up?:

    @crazycells You should actually remove the border: none;

    how can I remove it?

    Should I edit the plugin and install the modified one?

  • @phenomlab said in is "night mode" shifting the forum several pixels up?:

    @crazycells You should actually remove the border: none;

    how can I remove it?

    Should I edit the plugin and install the modified one?

    wrote on last edited by
    #8

    @crazycells hmm. Good point. I actually use my own version of the dark mode plugin, so not entirely sure. However, I think the CSS is probably the same. I’m not at my PC currently but can check and advise later.


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
  • Nodebb to Xenforo

    Solved Configure xenforo nodebb
    3
    0 Votes
    3 Posts
    1k Views
    phenomlab
    @cagatay as @downpw stated, there isn’t a native tool that will do this for you. You’d need to either develop your own or ask the nodebb team to assist which will be a paid exercise.
  • What’s going on with NodeBB?

    Performance nodebb script die
    20
    8 Votes
    20 Posts
    5k Views
    phenomlab
    @cagatay The most reliable way to upgrade Node.js on Ubuntu depends on how you originally installed it. Method 1: Using NVM (Recommended) If you already use Node Version Manager (NVM), upgrading is simple. NVM allows you to keep both versions and switch between them if needed. Install Node 22: nvm install 22 Switch to Node 22: nvm use 22 Set it as your default: nvm alias default 22 Verify the change: node -v Method 2: Using NodeSource (PPA) If you installed Node.js via apt using the NodeSource repository, you need to update the repository script to point to the new version. Remove the old NodeSource list (optional but cleaner): sudo rm /etc/apt/sources.list.d/nodesource.list Download and run the NodeSource setup script for Node 22: curl -fsSL [https://deb.nodesource.com/setup_22.x](https://deb.nodesource.com/setup_22.x) | sudo -E bash - Install/Upgrade Node.js: sudo apt-get install -y nodejs Verify the installation: node -v Method 3: Using the ‘n’ Package If you have npm installed, you can use the n interactive manager. Clear the npm cache: sudo npm cache clean -f Install the ‘n’ helper: sudo npm install -g n Install Node 22: sudo n 22 Update your shell: hash -r Troubleshooting Permission Denied: If you see permission errors using Method 2 or 3, ensure you are using sudo. Path Issues: If node -v still shows version 20 after upgrading via NVM, restart your terminal or run source ~/.bashrc. Conflicts: Avoid mixing these methods. If you switch from apt to nvm, it is best to sudo apt remove nodejs first to avoid path conflicts.
  • MogoDB v6 to v7 upgrade

    Solved Configure nodebb
    5
    1 Votes
    5 Posts
    2k Views
    phenomlab
    @Panda if you used the Ubuntu PPA, I think this only goes as far as 6.x if I recall correctly.
  • how to hide "moved" badge with CSS?

    Solved Customisation nodebb
    12
    1
    3 Votes
    12 Posts
    4k Views
    phenomlab
    @crazycells ah, I see. That makes sense.
  • Bug Report

    Solved Bugs nodebb bugs
    47
    1
    26 Votes
    47 Posts
    20k Views
    phenomlab
    @crazycells Good points, thanks. I completely forgot that classes are added - makes life much simpler! EDIT - seems this is pretty straightforward, and only needs the below CSS .upvoted i { color: var(--bs-user-level) !important; } This then yields [image: 3f072f8a-ebfa-4910-8723-73c493b8e4eb-image.png] However, the caveat here is that the .upvoted class will only show for your upvotes, and nobody else’s. However, this does satisfy the original request however I would love to see my upvoted posts more clearly, because currently, when I upvote, nothing on the post tool is changing, it would be nicer if there is an indication that I have upvoted (like a filled or colored triangle?)
  • Setting up a beta NodeBB v3 environment

    Moved Let's Build It nodebb upgrades beta1
    14
    3
    11 Votes
    14 Posts
    6k Views
    phenomlab
    @dave1904 excellent news. Thanks for the feedback
  • NodeBB metadata

    Solved Configure nodebb
    4
    2 Votes
    4 Posts
    2k Views
    JAC
    @phenomlab said in NodeBB metadata: @jac Are you sure ? https://www.google.co.uk/search?q=site%3Astockportcounty.fans&sxsrf=AOaemvLwnaZL-PliU_2dBOg_Eo1pMVhBjg%3A1638982328139&source=hp&ei=uOKwYeatBcOsad3yp7AE&iflsig=ALs-wAMAAAAAYbDwyLBSDcG5XYoFCKwQFhgz94wTxOcV&ved=0ahUKEwjm6dX71NT0AhVDVhoKHV35CUYQ4dUDCAk&uact=5&oq=site%3Astockportcounty.fans&gs_lcp=Cgdnd3Mtd2l6EAM6BAgjECc6CwgAEIAEELEDEIMBOg4ILhCABBCxAxDHARCjAjoRCC4QgAQQsQMQgwEQxwEQowI6BQguEIAEOggIABCABBCxAzoFCAAQgAQ6CAguELEDEIMBOgsILhCABBDHARCvAToICC4QgAQQsQM6BQgAELEDOgsILhCABBDHARDRAzoLCAAQgAQQsQMQyQM6BQgAEJIDUABYySZg0CdoAHAAeACAAW2IAa0NkgEEMjMuMpgBAKABAQ&sclient=gws-wiz Fair enough 🤪🤪.
  • NodeBB Design help

    Solved Customisation
    8
    3
    2 Votes
    8 Posts
    4k Views
    phenomlab
    @riekmedia I’ve applied some new CSS to your site. Can you reload the page and try again ? For the record, this is what I added #footer { background: #2d343e; border-top: 4px solid #2d343e; font-size: 0.9em; margin-top: 70px; padding: 80px 0 0; position: relative; clear: both; bottom: 0; left: 0; right: 0; z-index: 1000; margin-left: -15px; margin-right: -338px; } The /categories page seems a bit messed up, so looking at that currently EDIT - issued some override CSS in the CATEGORIES widget <!--- CSS fix for overspill on /categories page - DO NOT DELETE --> <style> #footer { margin-right: -45px; } </style> That should resolve the /categories issue.