The Schedule a Tour form does have some areas with color, such as the color of the underline, checkmark, or Send button, that may not fit your branding. For example, you'll notice little blue checkmark icons activated when a selection is made and a blue underline, there is CSS available below to customize those two items.
Tip
Place the desired code(s) in the Custom CSS box under Settings > Design. You must clear your caches, then check your web page in an incognito browser to see the change!
Customization Options
-
*To change the color of the underline:
.sidx-container .sidx-toggle-bar .sidx-toggle-bar-item.sidx-selected, .sidx-container .sidx-toggle-bar .sidx-toggle-bar-item:hover {
border-bottom: 2px solid #hexcode !important;
} -
*To change the color of the checkmark:
.sidx-container .sidx-toggle-bar .sidx-toggle-bar-item.sidx-selected:before {
color: #hexcode !important;
} -
*To change change the Send button: this has its own CSS which you can find here (click link)
Warning: Showcase IDX may make future updates to the product which may break previously acceptable CSS code, causing that section on your website to look unusual. If you've noticed your site not looking as expected, please return to this article for the updated CSS code.
If you are inexperienced with CSS, we suggest you turn to your developer as they will be the best contact person for CSS related questions and concerns. We are not developers and provide this baseline CSS for agents and developers experienced in coding.