Topic: mdb-select arrow color css
theenterpriseprogrammer premium asked 3 years ago
Expected behavior The css of the dropdown arrow should be accessible via scss or css using the .select-arrow
Actual behavior css of the mdb-select can be overridden however elements inside of the mdb-select prove useless!
Resources (screenshots, code snippets etc.)
<mdb-form-control>
<mdb-select name="category-search-select" id="category-search-input" class="category-select-search">
<mdb-option class="reverse-option-color" *ngFor="let option of options" [value]="option.value">
{{option.label}}
</mdb-option>
</mdb-select>
<label mdbLabel class="form-label" for="category-search-input">Category Search</label>
</mdb-form-control>
CSS
mdb-select { .select-arrow { color: purple !important; } }
.reverse-option-color { background-color: #303030; color: $font-color; span { padding-left: 2rem; } }
.reverse-option-color:hover { background-color: $backgroud-color; }
.select-dropdown { background-color: #303030; }
Closed
This topic is closed.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Closed
- ForumUser: Premium
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: MDB5 1.2.0
- Device: Thinkpad X1 Extreme
- Browser: Edge
- OS: Windows 11
- Provided sample code: No
- Provided link: No
theenterpriseprogrammer premium commented 3 years ago
This ended up being resolved by adding that sass to the styles.scss instead of the component scss