Adjusting CSS Datepicker in Angular

Topic: Adjusting CSS Datepicker in Angular

bfiering premium asked 5 years ago

I am using the date picker in a form in an Angular component. I have to make several css styling adjustments. (positioning, border, collars etc.) and also have to change CSS, positioning etc. to the calendar when the user wants to enter the date.

I tried to acces the date picker object from within the CSS of the Angular Component and also over the global styles.scss, and tried to access them over tags like .mdb-date-picker or the in this object assigned class or id name, but it is ignored in the browser.

Is there a separate way to change the CSS of this component?

Best regards,

Bob

Add comment

Ritten pro answered 5 years ago

1 0 Best answer

Works for me, adding in your main style sheet:

 .picker__date-display {
    background-color: red !important;
  }

or scss

 .picker {
    &__date-display {
      background-color: red !important;
    }
  }

bfiering premium commented 5 years ago

Thanks, I will try that

Damian Gemza staff commented 5 years ago

You should definitely try the Ritten's approach!

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Premium
Premium support: Yes
Technology: MDB Angular
MDB Version: 7.5.1
Device: Several
Browser: Chrome (latest), Safari
OS: MacOS, iOS,Android
Provided sample code: No
Provided link: No

bfiering

Premium support 25Support score
3Questions 1Answers 0Snippets