I have recently delved into using the Angular2 datepicker, but I am struggling to customize its color, borders, font, and other styling elements.
After inspecting the element of the datepicker, I tried targeting the class "wc-date-container" in my CSS file to modify these properties, but it doesn't seem to be working correctly. Here are snippets from my Angular component.html and CSS files:
<angular2-date-picker
[(ngModel)]="search.date_from"
[ngModelOptions]="{standalone: true}"
[settings]="timeSettings" >
</angular2-date-picker>
.wc-date-container {
border: 1px solid rgba(155, 151, 151, 0.911);;
}
.wc-date-container > span {
color: rgba(155, 151, 151, 0.911);
}
.wc-date-container > i {
font-size: 20px;
color: rgba(155, 151, 151, 0.911);
}
Thank you for taking a look at this. I hope I haven't missed an important detail. I have referred to other solutions, but none seem to address my specific issue. Some parts of this fiddle were used as reference: https://jsfiddle.net/solomon301/s3hL05s6/.