Invert the Countdown Widget Colours

Follow

  This article is for our new Experience Manager.

If you are an EventMobi customer and using manage.eventmobi.com your account is using our Classic Content Manager. If this is the case, please visit support.eventmobi.com

This snippet switches the colours for the background of the countdown widget and the background of the numbers. 

Before  After 
Screen_Shot_2017-07-04_at_2.01.13_PM.png Screen_Shot_2017-07-04_at_2.01.01_PM.png 

In order to customize the colors, you will need to fill in the hex codes for the colors (hex codes start with #, and can be seen below as #fff and #635fd9. A great resource for finding the hex code for the colors you want is http://www.colorpicker.com/.

Code:

/*Invert Countdown */
.widget-countdown-number {
   background: #fff;
}
.widget-countdown {
   background-color:#635fd9;
}
.widget-countdown-block span {
   margin-bottom: 5px;
   line-height: .4em;
   display: block;
   color: white;
   font-weight: bolder;
}

.widget-countdown-title {
   color:white;
}
.widget-countdown-number {
   color: #61596a;
}
0 out of 0 found this helpful

Comments

0 comments

Article is closed for comments.