Skip to content

[NODEBB] CSS Style Sheets SelectBox

Locked Solved Customisation
112 2 63.3k 1
  • 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;
    }
    }
    
  • wrote on last edited by DownPW
    #83

    @phenomlab

    I have another CSS problem for me @phenomlab

    I have set the icon of theme switcher on white with this code:

    .navbar-default .btn-link {
        color: #fff;
    }
    

    I have set the icon of theme switcher on black when I dropdwown on the menu with this code :

    .navbar-default .btn-link:focus, .navbar-default .btn-link:hover {
        color: black;
    }
    

    The problem I have:

    Example on aqua theme, I dropdown the menu for change a theme and I have selected a wrong theme: I select the one already used (aqua)

    At this moment, the icon becomes white again and I would like it to remain black.

    It’s possible to do that ?

    edff94ef-23ff-4704-896c-e5b26cdb4923-image.png

  • wrote on last edited by DownPW
    #84

    EDIT:

    Others things I have :

    If I Click on fa-faw icon, The icon is black (its’ good) on dropdown :
    ff849338-bb74-499b-8e2d-ad8d4e1d03b0-image.png

    But if I click on background (here aqua), the icon is white on dropdown :

    d38b3686-81b7-47d5-84ac-f688d27e9937-image.png

    Thanks in advance @phenomlab for your help. See the older post for seeing my code

  • wrote on last edited by
    #85

    Hi @phenomlab 🙂
    How are you ?
    I know you are a busy man.

    Can you look at my last 2 posts?

    I have 2 small issues to solve and I think this is fairly straightforward for you.

    I’m a little lost with the fa-faw

    Thanks in advance

  • @phenomlab

    I have another CSS problem for me @phenomlab

    I have set the icon of theme switcher on white with this code:

    .navbar-default .btn-link {
        color: #fff;
    }
    

    I have set the icon of theme switcher on black when I dropdwown on the menu with this code :

    .navbar-default .btn-link:focus, .navbar-default .btn-link:hover {
        color: black;
    }
    

    The problem I have:

    Example on aqua theme, I dropdown the menu for change a theme and I have selected a wrong theme: I select the one already used (aqua)

    At this moment, the icon becomes white again and I would like it to remain black.

    It’s possible to do that ?

    edff94ef-23ff-4704-896c-e5b26cdb4923-image.png

    wrote on last edited by
    #86

    @downpw You should be able to use this in each stylesheet (obviously, set the colour you actually want)

    [data-original-title="Theme Switcher"] i {
        color: #000;
    }
    
  • wrote on last edited by DownPW
    #87

    @phenomlab

    The code just change The color icon but not the color when I dropdown to the menu

    I prefer 2 colors :

    • One on the navbar
    • On on hover icon and dropdown
  • wrote on last edited by DownPW
    #88

    Ola @phenomlab

    If you want we can use team viewer for see that.


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