Invert the Countdown Widget Colours

Follow

  This article is for our Classic Content Manager.

If you are an EventMobi customer and using experience.eventmobi.com, your account is using our new Experience Manager. If this is the case, please visit help.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.