Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

293
Views
How to change the CSS of some days in Pikaday?

I want to change the color of some day's objects in Pikaday, without any disabling. or specify them by a badge.

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Override the specific colors by declaring it in a style-sheet, after loading pikaday. E.g.

.is-today .pika-button {
   color: mediumpurple !important; /* default is #33aaff */
}

You can play around with the styling by opening Chrome's dev tools and remove the is-hidden

<div class="pika-single is-bound left-aligned bottom-aligned is-hidden">

You could also use JavaScript to apply some styling to a specific day, e.g. the 11th.

document.querySelector('button[data-pika-day="11"]').style.background = 'green';

And if you want to use a JS approach to apply styling to a specific day of the week, e.g. Monday, given your calendar week statrs with Monday and not Sunday:

document.querySelectorAll('tr[class="pika-row"]').forEach(tr => { if(!tr.children[0].classList.contains('is-empty')) {
   tr.children[0].firstElementChild.style.background = 'green';
} })

Chrome dev

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!