Skip to content

[NODEBB] CSS Style Sheets SelectBox

Locked Solved Customisation
112 2 63.3k 1
  • wrote on last edited by
    #63

    Ok great my Lord 😉

  • wrote on last edited by DownPW
    #64

    @phenomlab

    It’s because i use this variable for this when I delete a message on Chat

    aa138d2a-5fa2-4b5c-a610-0a80ab24a0f2-image.png

  • @phenomlab

    It’s because i use this variable for this when I delete a message on Chat

    aa138d2a-5fa2-4b5c-a610-0a80ab24a0f2-image.png

    wrote on last edited by
    #65

    @downpw Yes, you’ll need to be more specific with the target so it doesn’t cause issues elsewhere.

  • wrote on last edited by DownPW
    #66

    havve you got an idea ?

    .modal-body doesn’t work, tranparency is here

  • havve you got an idea ?

    .modal-body doesn’t work, tranparency is here

    wrote on last edited by
    #67

    @downpw Yes, but let’s first fix the wallpapers 🙂

  • havve you got an idea ?

    .modal-body doesn’t work, tranparency is here

    wrote on last edited by
    #68

    @downpw said in [NODEBB] CSS Style Sheets SelectBox:

    .modal-body doesn’t work, tranparency is here

    This should work

    .modal-content {
        background: #fff;
    }
    
  • wrote on last edited by
    #69

    Nope. 😞

  • Nope. 😞

    wrote on last edited by phenomlab
    #70

    @downpw Try this

    .bootbox .modal-dialog .modal-content {
        background: #fff;
    }
    

    d3e63ab5-5a08-4caa-a898-de93a5eefdfd-image.png

  • @downpw Try this

    .bootbox .modal-dialog .modal-content {
        background: #fff;
    }
    

    d3e63ab5-5a08-4caa-a898-de93a5eefdfd-image.png

    wrote on last edited by
    #71

    @phenomlab
    That works Sir 🙂

    Super hero you are^^

  • @phenomlab
    That works Sir 🙂

    Super hero you are^^

    wrote on last edited by
    #72

    @downpw Great ! Can we get the wallpapers fixed now also ? Would be good to see everything working.

  • wrote on last edited by
    #73

    @phenomlab

    I have fix all files.
    You can test it if you want

  • @phenomlab

    I have fix all files.
    You can test it if you want

    wrote on last edited by
    #74

    @downpw doesn’t seem to be working ?

  • @downpw doesn’t seem to be working ?

    wrote on last edited by DownPW
    #75

    @phenomlab said in [NODEBB] CSS Style Sheets SelectBox:

    @downpw doesn’t seem to be working ?

    @phenomlab

    It seems to work on my mobile. Maybe your cache ?

  • @phenomlab said in [NODEBB] CSS Style Sheets SelectBox:

    @downpw doesn’t seem to be working ?

    @phenomlab

    It seems to work on my mobile. Maybe your cache ?

    wrote on last edited by phenomlab
    #76

    @downpw probably. Let me try again

    EDIT - All good in incognito session

  • wrote on last edited by
    #77

    @DownPW I think we’re done now, yes ?

  • wrote on last edited by DownPW
    #78

    Oh yeah @phenomlab

    The post can be marked Resolved. No problem…
    And I thanks you again for your hard work

    A question:

    I have customised the Theme Chooser menu for mobile.
    Moreover, if anyone is interested here is the code:

    @media all and (max-width: 1024px)
    {
    .dropdown-menu>li>a {
        display: block;
        padding: 3px 20px;
        clear: both;
        font-weight: 400;
        line-height: 1.42857143;
        color: #fff;
        white-space: nowrap;
        background: #3A3C41;
    }
    
    #theme.dropdown-menu {
        position: fixed;
        top: 140px;
        left: 15px;
        z-index: 1000;
        float: left;
        min-width: 160px;
        padding: 5px 0;
        margin: 2px 0 0;
        list-style: none;
        font-size: 14px;
        text-align: left;
        /* background-clip: padding-box; */
        background: #3A3C41;
        width: 30px;
        border: 1px solid white;
    }
    

    I want to change the color of these elements, when the button is selectionned (on mobile). Actually, there blue by default and I wanted to change for white or grey for :

    ceaee937-d1ea-4315-9a7e-fd2d346855d9-image.png

    And change the color of these icons :
    a2b8e252-921a-4424-a5ac-ddc6cf2b6cf2-image.png
    If you have an idea @phenomlab 🙂

  • Oh yeah @phenomlab

    The post can be marked Resolved. No problem…
    And I thanks you again for your hard work

    A question:

    I have customised the Theme Chooser menu for mobile.
    Moreover, if anyone is interested here is the code:

    @media all and (max-width: 1024px)
    {
    .dropdown-menu>li>a {
        display: block;
        padding: 3px 20px;
        clear: both;
        font-weight: 400;
        line-height: 1.42857143;
        color: #fff;
        white-space: nowrap;
        background: #3A3C41;
    }
    
    #theme.dropdown-menu {
        position: fixed;
        top: 140px;
        left: 15px;
        z-index: 1000;
        float: left;
        min-width: 160px;
        padding: 5px 0;
        margin: 2px 0 0;
        list-style: none;
        font-size: 14px;
        text-align: left;
        /* background-clip: padding-box; */
        background: #3A3C41;
        width: 30px;
        border: 1px solid white;
    }
    

    I want to change the color of these elements, when the button is selectionned (on mobile). Actually, there blue by default and I wanted to change for white or grey for :

    ceaee937-d1ea-4315-9a7e-fd2d346855d9-image.png

    And change the color of these icons :
    a2b8e252-921a-4424-a5ac-ddc6cf2b6cf2-image.png
    If you have an idea @phenomlab 🙂

    wrote on last edited by
    #79

    @downpw said in [NODEBB] CSS Style Sheets SelectBox:

    I want to change the color of these elements, when the button is selectionned (on mobile). Actually, there blue by default and I wanted to change for white or grey for :

    ceaee937-d1ea-4315-9a7e-fd2d346855d9-image.png

    Find 🙂

    @media all and (max-width: 1024px)
    {
    .btn-link:focus, .btn-link:hover {
        /*color: #23527c;*/
        color: lightgrey; /*Any color you want*/
        text-decoration: underline;
        background-color: transparent;
    }
    }
    

    I haven’t yet found for point shaped marker. I will search

  • wrote on last edited by DownPW
    #80

    @downpw said in [NODEBB] CSS Style Sheets SelectBox:

    I haven’t yet found for point shaped marker. I will search

    Hi @phenomlab

    I still haven’t found a way to remove the dot to the left of the Theme Switcher button on mobile (See Screenshot).

    https://sudonix.com/assets/uploads/files/1641509822802-ceaee937-d1ea-4315-9a7e-fd2d346855d9-image.png

    If you have an idea, I’m interested 🙂

    Cya

  • @downpw said in [NODEBB] CSS Style Sheets SelectBox:

    I haven’t yet found for point shaped marker. I will search

    Hi @phenomlab

    I still haven’t found a way to remove the dot to the left of the Theme Switcher button on mobile (See Screenshot).

    https://sudonix.com/assets/uploads/files/1641509822802-ceaee937-d1ea-4315-9a7e-fd2d346855d9-image.png

    If you have an idea, I’m interested 🙂

    Cya

    wrote on last edited by
    #81

    @downpw add list-style: none; to the class

  • @downpw add list-style: none; to the class

    wrote on last edited by DownPW
    #82

    Thanks @phenomlab 🙂

    Moreover, if anyone is interested here is the code:

    
    @media all and (max-width: 1024px)
    {
    .navbar-form {
        left: 20px;
        box-shadow: none;
        list-style: none;
    }
    }
    

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
  • Whitespace fixes in Nodebb

    Solved Customisation nodebb
    18
    2
    7 Votes
    18 Posts
    6k Views
    phenomlab
    @Panda Just circling back here with something of an update (which I think you’ll like). I’ve completely restructured the ranking system. There are now less ranks, with a higher point threshold to reach them. More importantly, if you reload the site, you’ll notice that the ranks are now icons. I also removed the “Author” badge, and made this a single icon, which (to me) looks much better.
  • 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
  • Fontawesome 5

    Unsolved Customisation fonts css nodebb
    14
    1 Votes
    14 Posts
    6k Views
    phenomlab
    @pwsincd 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 ?
  • Avatar on Topic Header

    Solved Customisation css avatar header
    9
    1
    0 Votes
    9 Posts
    3k Views
    JAC
    @jac said in Avatar on Topic Header: @downpw said in Avatar on Topic Header: Great Plugin I make it a bit cleaner via this CSS code: /*------------------------------------------------------------------*/ /*---------------- nodebb-plugin-browsing-users -----------------*/ /*------------------------------------------------------------------*/ /*Space between the avatar and the RSS icon */ .topic [component="topic/browsing-users"] { margin-bottom: -5px; padding-left: 10px; } /*Space between avatars*/ .pull-left { float: left!important; padding-right: 5px; } Do you have a screenshot of how this looks with the CSS change? Just added this change, thanks @DownPW
  • NodeBB Footer

    Solved Customisation footer nodebb
    10
    1 Votes
    10 Posts
    4k Views
    JAC
    @phenomlab said in NodeBB Footer: @jac and you. Hope all is well and you recover quickly Thanks pal
  • NodeBB Discord Plugins

    Unsolved Customisation nodebb discord plugin
    7
    0 Votes
    7 Posts
    4k Views
    phenomlab
    @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 ?
  • CSS Help on my Flarum

    Solved Customisation
    5
    2
    2 Votes
    5 Posts
    3k Views
    phenomlab
    @mike-jones Yes, you’ll typically see this type of behaviour if there is another style that has higher priority in the sense that yours will be overridden. Using !important will override the higher preference, but should be used sparingly rather than everywhere.
  • Customising NodeBB

    Locked Customisation nodebb
    3
    0 Votes
    3 Posts
    3k Views
    phenomlab
    Closing this thread as a duplicate of https://sudonix.com/topic/12/nodebb-customisation