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
  • Sidebar Widget is no longer on the side!

    Moved Solved General nodebb
    4
    2
    2 Votes
    4 Posts
    1k Views
    phenomlab
    @Panda said in Sidebar Widget is no longer on the side!: Ah, so sidebar wont work on mobile? Correct. If you review the docs on bootstrap, you’ll notice that it is designed on a grid system https://getbootstrap.com/docs/5.0/layout/grid/ What I mean by changing the category is moving it on here to general as you posted it in bugs, when it isn’t.
  • Plugin to show images in teasers

    General nodebb teaser image plugin hook
    6
    1
    2 Votes
    6 Posts
    2k Views
    phenomlab
    @dave1904 I’d start by adding a console.log function to hookData so you can see what is being returned return hookData; console.log(hookData):
  • build nodebb Warning in entrypoint size limit

    Solved Performance nodebb
    2
    0 Votes
    2 Posts
    1k Views
    phenomlab
    @eeeee they are nothing to worry about, and can be ignored.
  • NodeBB: Favicon upload issue

    Solved Configure nodebb favicon
    12
    1
    3 Votes
    12 Posts
    4k Views
    mventures
    @phenomlab I am on a Mac, so I used the “Option + Command + I”, and then performed the steps. It loaded my favicon! I checked on Firefox which I haven’t used before, and it showed my favicon also! That’s fantastic and thank you for the help!
  • Upgrade Problem from 2.8.3 to 2.8.4

    Solved Configure nodebb
    35
    1
    8 Votes
    35 Posts
    12k Views
    phenomlab
    @cagatay No, you can ignore that.
  • How to fix size of photos & videos NodeBB

    Solved Customisation nodebb nodebb size
    7
    3 Votes
    7 Posts
    3k Views
    phenomlab
    @crazycells pleasure. Using percentages makes much more sense in this case. It’s the same argument with px vs pt vs em with fonts, margins, padding, etc., in the sense that em is generally preferred over px and pt https://stackoverflow.com/questions/609517/why-em-instead-of-px
  • Rotating homepage icons, gifs?

    Solved Configure nodebb
    2
    3 Votes
    2 Posts
    1k Views
    phenomlab
    @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; }
  • Detect if user is admin

    General nodebb javascript code
    2
    0 Votes
    2 Posts
    2k Views
    phenomlab
    @pwsincd I think you can use userData.isAdmin = isAdmin; if I’m not mistaken - see https://community.nodebb.org/topic/15128/how-to-hide-whitelist-user-field-only-to-owner-or-admin?_=1648802303112 for an example