How to change the color of calendar text month, number, and arrow

Site URL: https://www.caroline-shenaz-hossein.com/portal-main

Hello,

I'm customizing my calendar, and have figured out a couple things, but one thing i can't seem to manage is to change the color of the month, numbers, and arrows. I've attached a picture below. Basically my question is:

How do i change the colour of the text of each month from red to white?
How do i change the colour of all the numbers on the calendar from black to white?
and
How do i change the colour of the arrows from black to white?

The usual h1, h2, h3, p, doesn't seem to work.

link:    https://www.caroline-shenaz-hossein.com/portal-main

(the other bright colours are just so i can see what the code is doing, i won't keep them 🙂 )

15 hours ago, JTeich said:

Site URL: https://www.caroline-shenaz-hossein.com/portal-main

Hello,

I'm customizing my calendar, and have figured out a couple things, but one thing i can't seem to manage is to change the color of the month, numbers, and arrows. I've attached a picture below. Basically my question is:

How do i change the colour of the text of each month from red to white?
How do i change the colour of all the numbers on the calendar from black to white?
and
How do i change the colour of the arrows from black to white?

The usual h1, h2, h3, p, doesn't seem to work.

link:    https://www.caroline-shenaz-hossein.com/portal-main

(the other bright colours are just so i can see what the code is doing, i won't keep them 🙂 )

Try adding to Home > design > custom css

#block-yui_3_17_2_1_1659034884374_7780 [aria-role="heading"] {
  color: #fff;
}

#block-yui_3_17_2_1_1659034884374_7780  .marker-daynum {
  color: #fff;
}

#block-yui_3_17_2_1_1659034884374_7780  [role="columnheader"] {
  color: #fff;
}

#block-yui_3_17_2_1_1659034884374_7780 .yui3-calendar-header {
  color: #fff;
}

Let me know how it works on your site

Support me by pressing 👍 if this useful for you

6 hours ago, bangank36 said:

Try adding to Home > design > custom css

#block-yui_3_17_2_1_1659034884374_7780 [aria-role="heading"] {
  color: #fff;
}

#block-yui_3_17_2_1_1659034884374_7780  .marker-daynum {
  color: #fff;
}

#block-yui_3_17_2_1_1659034884374_7780  [role="columnheader"] {
  color: #fff;
}

#block-yui_3_17_2_1_1659034884374_7780 .yui3-calendar-header {
  color: #fff;
}

Let me know how it works on your site

Support me by pressing 👍 if this useful for you

Wonderful!

It seems to work on Page Settings> Advanced  as well!

Thanks so much!!