MyBB Community Forums

see this...

in this box whatever text i am writing it's color seems white and you can see the background colour of box is white so the text doesn't appear.

so anyone can tell me ? which css class that i have to edit ?

or how to fix this ?

i want the background colour of that box should be 

hex :- #242424

That is a jquery plugin and the stylesheet is not available through ACP.
You need to change the CSS which is located here:
jscripts\select2\select2.css

but i have seen in many dark theme that their , this box has darken background. even then don't have a jscript file in theme folder.

how do they do that ?

if i will change it in as you said this will also effect to my normal default theme... but i just want this in my particular dark theme...

any other solutions for this ?

(2021-03-13, 04:02 PM)PARADOXP Wrote: [ -> ]any other solutions for this ?

umm, yes correct paradoxp, we do this alot in our dark themes and YES this is completely doable via acp theme edits, just apply the select2 and other such related overwrite styling in your stylesheet..., I do it all the time as such is rather

!important

.
lol

here is just one example of say editing select2 items by overwrite in acp css only shown as an example and not suggested to use as you should probably make your own respective edits related to your specific theme but eh just an example of how quickly you can overwrite such straight in acp edit stylesheet:

.select2-dropdown-open .select2-choice {
    border-bottom-color: transparent !important;
    -webkit-box-shadow: 0 1px 0 #303030 inset !important;
    box-shadow: 0 1px 0 #303030 inset !important;
    background-color: #202020 !important;
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #303030), color-stop(0.5, #202020)) !important;
    background-image: -webkit-linear-gradient(center bottom, #303030 0%, #202020 50%) !important;
    background-image: -moz-linear-gradient(center bottom, #303030 0%, #202020 50%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#202020', endColorstr='#303030', GradientType=0) !important;
    background-image: linear-gradient(to top, #303030 0%, #202020 50%) !important;
}

.select2-dropdown-open.select2-drop-above .select2-choice,
.select2-dropdown-open.select2-drop-above .select2-choices {
    border: 1px solid #5897fb !important;
    border-top-color: transparent !important;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #303030), color-stop(0.5, #202020)) !important;
    background-image: -webkit-linear-gradient(center top, #303030 0%, #202020 50%) !important;
    background-image: -moz-linear-gradient(center top, #303030 0%, #202020 50%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#202020', endColorstr='#303030', GradientType=0) !important;
    background-image: linear-gradient(to bottom, #303030 0%, #202020 50%) !important;
}

.select2-container .select2-choice {
    border: 1px solid #252525 !important;
}

.select2-search input {
color: #A0A0A0 !important;
    border: 1px solid #252525 !important;
    border-radius: 0;
    background: #202020 url('images/select3.png') no-repeat 100% -22px !important;
    background: url('images/select3.png') no-repeat 100% -22px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #202020), color-stop(0.99, #252525)) !important;
    background: url('images/select3.png') no-repeat 100% -22px, -webkit-linear-gradient(center bottom, #202020 85%, #252525 99%) !important;
    background: url('images/select3.png') no-repeat 100% -22px, -moz-linear-gradient(center bottom, #202020 85%, #252525 99%) !important;
    background: url('images/select3.png') no-repeat 100% -22px, linear-gradient(to bottom, #202020 85%, #252525 99%) 0 0 !important;
}

.select2-drop.select2-drop-above {
    border-top: 1px solid #202020 !important;
}

.select2-drop {
background: #303030 !important;
    color: #A0A0A0 !important;
}
.select2-drop2 {
background: #303030 !important;
}
.select2-drop-mask2 {
background: #303030 !important;
}
.select2-drop-mask {
background: #303030 !important;
}
.select2-no-results {
background: #303030 !important;
color: #A0A0A0 !important; 
}

.select2-container .select2-choice {
background: #303030 !important;
color: #A0A0A0 !important;
}

.select2-container-multi .select2-choices {
    border: 1px solid #252525 !important;
    background-color: #303030 !important;
color: #A0A0A0 !important; 
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #202020), color-stop(15%, #303030)) !important;
    background-image: -webkit-linear-gradient(top, #202020 1%, #303030 15%) !important;
    background-image: -moz-linear-gradient(top, #202020 1%, #303030 15%) !important;
    background-image: linear-gradient(to bottom, #202020 1%, #303030 15%) !important; 
}
.select2-drop-active {
    border: 1px solid #202020 !important; 
}

* this is just shown from an existing theme created years ago that edits such select2 so you get an idea of the types of select2 overwrites you might want to target and overwrite, hence why I said this is only for example as this comes straight from a theme that has custom select2 styling

78 th css property is incomplete ?

---

wow it wotks perfect amazing... you know what you are for me 😊

Thank You Brother...

(2021-03-13, 04:54 PM)PARADOXP Wrote: [ -> ]wow it wotks perfect amazing... you know what you are for me 😊

Thank You Brother...

cool beans & no worries.  happy editing & best of luck!