إضافة صندوق عرض الأكواد مع زر النسخ و التحميل

<style>
.snippet-container2 {
  position: relative;
  background-color: #1e1e1e;
  color: #dcdcdc;
}
.copy-button2 {
  position: absolute;
  top: 1px;
  background-color: #000000;
  color: #fff;
  border: none;
  padding: 5px 10px;
  font-size: 12px;
}
.download-button2 {
  position: absolute;
  top: 1px;
  right: 60px;
  background-color: #000000;
  color: #fff;
  border: none;
  padding: 5px 10px;
  font-size: 12px;
}
.copy-button2:hover,
.download-button2:hover {
  background-color: #45a049;
}
.htmlcode2 {
  text-align: left;
  padding: 15px !important;
  font-size: 14px;
  overflow: auto;
  max-height: 400px;
  direction: ltr;
  white-space: pre-wrap;
}
.dark-mode .snippet-container2 {
  background-color: #1e1e1e;
  border: 1px solid #1e1e1e;
}
#boxcode2 {
  background-color: #000000;
  padding: 15px 0px;
}
</style>

<script>
  const accordionHeaders = document.querySelectorAll('.accordion-header');

  accordionHeaders.forEach(header => {
    let isClicked = false;

    header.addEventListener('click', () => {
      const item = header.parentNode;
      const content = item.querySelector('.accordion-content');

      if (!isClicked) {
        isClicked = true;
        item.classList.add('active');
        content.style.display = 'block';
      } else {
        isClicked = false;
        item.classList.remove('active');
        content.style.display = 'none';
      }
    });
  });
   var copyButtons = document.querySelectorAll('.copy-button2');
  copyButtons.forEach(function(button) {
    button.addEventListener('click', function() {
      var codeSnippet = document.querySelector('.htmlcode2 code');
      var textarea = document.createElement('textarea');
      textarea.value = codeSnippet.innerText;
      document.body.appendChild(textarea);
      textarea.select();
      textarea.setSelectionRange(0, 99999);
      document.execCommand('copy');
      document.body.removeChild(textarea);
      button.innerHTML = 'تم النسخ!';
      setTimeout(function() {
        button.innerHTML = 'نسخ';
      }, 2000);
    });
  });

  var downloadButtons = document.querySelectorAll('.download-button2');
  downloadButtons.forEach(function(button) {
    button.addEventListener('click', function() {
      var codeSnippet = document.querySelector('.htmlcode2 code');
      var file = new File([codeSnippet.innerText], 'تم التحميل.txt', { type: 'text/plain' });
      var url = URL.createObjectURL(file);
      var a = document.createElement('a');
      a.href = url;
      a.download = 'تم التحميل.txt';
      a.click();
      URL.revokeObjectURL(url);
    });
  });
</script>