Code box with Copy Text Button

<button onclick="myFunction()" style="color:#783f04;background-color: rgba(252,229,205,1);border-color: rgba(252,229,205,1);height: 27.0pt;font-size: 13.0pt;font-weight: 700;font-family: 'Nunito', sans-serif;border-radius: 4px;transition: background .2s .1s;width: 100%;border-style: solid;">Copy Text</button><br>
<div style="margin-top:10px;background-color:#0000000f;padding: 10px;border-radius: 10px;"><textarea type="text" style="height:100px;border: none;position: relative;width: 100%;background-color: transparent;color: #666666;font-family: Courier;" id="myInput">

TEXT GOES HERE


</textarea></div>



<script>
function myFunction() {
  // Get the text field
  var copyText = document.getElementById("myInput");

  // Select the text field
  copyText.select();
  copyText.setSelectionRange(0, 99999); // For mobile devices

  // Copy the text inside the text field
  navigator.clipboard.writeText(copyText.value);

  // Alert the copied text
  alert("Copied the text: " + copyText.value);
}
</script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@700&display=swap" rel="stylesheet">