Add button with notch to site

Ask the community
1

hey everyone , i have the code for an outline button with a notch exactly how i would want it displayed on my site now it wont show can someone review this please?

heres the code

const button = document.createElement("button");
button.innerHTML = "Order Now";
button.style.cssText = "outline: none; padding: 10px 15px; position: relative; color: white; text-decoration: none;";

const notch = document.createElement("div");
notch.style.cssText = "border-top: 10px solid transparent; border-right: 10px solid white; border-bottom: 10px solid transparent; position: absolute; top: 0; right: 0;";
button.appendChild(notch);

button.addEventListener("mouseenter", function() {
  button.style.outlineColor = "#4FFF00";
  button.style.color = "#4FFF00";
});

button.addEventListener("mouseleave", function() {
  button.style.outlineColor = "white";
  button.style.color = "white";
});

const main = document.querySelector("#main");
button.setAttribute("href", "#anchor");
main.appendChild(button);
2

Hey there
Ad for the code related questions, it would be better for you to reach out to our Velo Code related forum:
https://www.wix.com/velo/forum

3

Hey @pailopaymentsolution , if you like, feel free to send me an image of how you’d like this button to look and I will try to build it for you in the editor without using code :slight_smile: