Hi everyone!
I’m struggling to change a color of an href link (“Book a call”) that I have imported as a custom code. I tested the usual links by creating a “Link Button” element, adding it button-primary
class and overriding the color afterwards - it worked.
Here, I have a custom link from Calendly. The button-primary
class adds the background and transition, but I can’t figure out how can I update the link color. On the screenshot below I put it to red (just as an example), but it doesn’t really work. I guess it takes the styling from that stylesheet in the code? What’s the best way to override it?
Here is the code I put into that Embed element:
<!-- Calendly link widget begin -->
<div id="calendly-div" onclick="openCalendly(event)">
<link href="https://assets.calendly.com/assets/external/widget.css" rel="stylesheet">
<script src="https://assets.calendly.com/assets/external/widget.js" type="text/javascript" async></script>
<a href="javascript:void(0);">Book a call</a>
</div>
<!-- Calendly link widget end -->
<script type="text/javascript">
function openCalendly(event) {
event.preventDefault();
Calendly.initPopupWidget({
url: 'https://calendly.com/mstephan/jobagentpro-45min?hide_event_type_details=1&hide_gdpr_banner=1'
});
}
</script>
This is the site: Redirect