Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #20297

    Hi,

    I am tying to change the default blue color on Incarnation’s calendar template. After searching through the css files for the template and the config-events-calendar folders, I’m stuck.

    Can anyone point me in the right direction? I am trying to change background colors for the Event List & Calendar buttons, the column header backgrounds, and the day header background.

    Thank you!

    #107104

    Hi cavanaughb,

    You can use Chrome’s inspect element tool to pick out the css selectors for the items you want to modify and add that css to the quick css or custom.css file. The same can be done with Firebug for Firefox ex: http://www.kriesi.at/support/topic/fyi-firebug-tutorial-for-wordpress-users

    For example, Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    #top .tribe-events-calendar th {
    background-color: #F00;
    border: 1px solid #F00;
    color: #fff;
    }

    This will change the days of the week background color, border and text color.

    The following will change the current day highlight color:

    #top .tribe-events-calendar th {
    background-color: #F00;
    border: 1px solid #F00;
    color: #fff;
    }

    and for the button:

    #top .main_color .tribe-events-calendar-buttons a.tribe-events-button-on {
    background: #F00;
    color: #fff;
    }

    Regards,

    Devin

    #107105

    Hi Devin,

    Is there a way to change the background color of the current day? I think the code examples above are the same for the days of the week, etc.

    Thank you!

    #107106

    Hi,

    After some more testing, I believe I found the solution. If anyone else is interested, here is the code I used:

    #top .tribe-events-calendar .tribe-events-present .tribe-events-event{
    background-color:#999999;
    border-color:#999999;
    }

    #107107

    Hi!

    Glad that you found the solution :)

    Regards,

    Peter

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Calendar CSS’ is closed to new replies.