This post is for the users of the MyListing Theme. Check out the theme.
Difficulty
Challenging
Here is a quick and easy way to add some identifying colors to your preview cards on the post-type archive page. The colors are based on the listing’s business hour status. Of course you can change the colors to your preference.
/* ***** When business hours status is - Open */
.open-status.listing-status-open {
color: #FFFFFF;
background-color: #34C759;
border-color: #34C759;
}
/* ***** When business hours status is - Closed */
.open-status.listing-status-closed {
color: #FFFFFF;
background-color: #FF3B30;
border-color: #FF3B30;
}
/* ***** When business hours status is - By Appointment Only */
.listing-status-appointment-only {
color: #FFFFFF;
background-color: #55BEF0;
border-color: #55BEF0;
}
Below is the minified version
.open-status.listing-status-open{color:#fff;background-color:#34c759;border-color:#34c759}.open-status.listing-status-closed{color:#fff;background-color:#ff3b30;border-color:#ff3b30}.listing-status-appointment-only{color:#fff;background-color:#55bef0;border-color:#55bef0}