Topic: Change CSS of an Input
Expected behavior I would like to be able to change the way the input looks. Currently it seems theres a an outline around the form control / input but I just want to have a border at the bottom and not have it look like a closed input
Actual behavior the inputs are already styled to have a border / outline around it.
Resources (screenshots, code snippets etc.)
and also want to change when its on focus so when I click on the input I want to change the css as well!
Please try to use such scss selector to set such styles. Remember to place it below your mdb import in your global styles.scss file.
@import 'mdb-angular-ui-kit/assets/scss/mdb.scss';
.form-outline .form-control,
.form-outline .form-control.active {
~ .form-notch {
.form-notch-leading,
.form-notch-middle,
.form-notch-trailing {
border: none;
border-radius: 0;
border-bottom: 1px solid gray;
box-shadow: none;
}
}
}
Let me know if that serves your needs.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Angular
- MDB Version: MDB5 5.2.0
- Device: Desktop
- Browser: Chrome
- OS: MacOs
- Provided sample code: No
- Provided link: No