Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is it possible to add custom CSS/Styles to each dates? #4

Open
anirudhr95 opened this issue Mar 31, 2021 · 1 comment
Open

Is it possible to add custom CSS/Styles to each dates? #4

anirudhr95 opened this issue Mar 31, 2021 · 1 comment

Comments

@anirudhr95
Copy link

I added the following css to ng-fullyearcalendar

:host ::ng-deep .day {
  border-radius: 10px !important;
}

It is working fine as expected.
Screenshot 2021-03-31 at 4 30 54 PM

However, I want to add border-radius only to the left-most and right-most elements on a continuous date - so that I get something like so -
Screenshot 2021-03-31 at 4 31 41 PM

Is it possible to accomplish this?

Any suggestion from you guys would help a lot 😀

@Botchar
Copy link

Botchar commented Mar 25, 2022

maybe you can use DOM and setting style depending the day

Into Init wait set calendar and values, then you need identificate when start and finish your range
setTimeout(() => {
// get html
const elements = document.getElementsByClassName('tooltip');
// example get current day with number format (1 - 365)
elements[this.getDayNumberYear() - 1].setAttribute('style', 'color:white; background-color: #FF6B0B; height: 24px; padding-top: 0px;');
}, 10);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants