How to change the color of the dates in Calendar?

  • Amanda_Barker_abarker
    Asked on June 13, 2024 at 5:32 PM

    Good afternoon,


    In our model request form, we've implimented a date input option. When updating the date by maually typing there is no issues, but when you select the date window that shows the calendar view there are no dates except a few. Is this the standard formatting or is there an issue on our end?


    Thanks,s

    Jotform Thread 15910801 Screenshot
  • Ronald JotForm Support
    Replied on June 13, 2024 at 6:32 PM

    Hello Amanda,

    Thanks for reaching out to Jotform Support. When I cloned and tested your form, the same thing happened for me. After investigating it a bit, I found a solution by injecting custom CSS codes on your form. It's really easy to fix. Let me show you how:

    1. Copy the code below.

    /* Change the color of dates- 15910801 */
    .calendar.popup table tbody td {
        color: black !important;
    }
    .calendar.popup tr.days td.selected{
    color: white !important;
    }
    /* End code here */

    2. In Form Builder, click on the Paint Roller icon on the right side of the page to open Form Designer.

    3. In the Form Designer menu, click on the Styles tab, scroll down and paste the code into the Inject CSS Code box.

    How to change the color of the dates in Calendar? Image 1 Screenshot 20

    Give it a try and let us know how it goes.

  • Amanda_Barker_abarker
    Replied on June 14, 2024 at 12:01 PM

    That worked! Thank you so much for your help. I really appreciate it.

  • OpsMoM
    Replied on June 28, 2024 at 9:32 AM

    Thank youuu. I had exact same issue!

 
Your Answer