<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;200;300;400;500;600;700;800;900&display=swap"
	      rel="stylesheet">
          <link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
          <link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet" />

    <link rel="stylesheet" type="text/css" href="/css/style.css" />
    <title>Weekly nerd | New Post</title>
</head>
<body class="container">

<header>
    <a href="/"><i class='bx bxs-message-square-x'></i></a>
</header>

<main>

    <section class="form-voorkeur">

        <h1>nieuwe post toevoegen</h1>

        <%- include('../components/newformpost') %>

    </section>

</main>

<footer>
  <%- include('../partials/footer'); %>
</footer>

 <!-- Include Quill library -->
 <script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
 <script>

const toolbarOptions = [
  [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
  ['bold', 'italic', 'underline', 'strike'],        // toggled buttons
  ['blockquote', 'code-block'],
  ['link', 'image'],

  [{ 'header': 1 }, { 'header': 2 }],               // custom button values
  [{ 'list': 'ordered'}, { 'list': 'bullet' }, { 'list': 'check' }],     // superscript/subscript
  [{ 'indent': '-1'}, { 'indent': '+1' }],          // outdent/indent
  [{ 'direction': 'rtl' }],                         // text direction

  ['clean']                                         // remove formatting button
];


    const quill = new Quill('#editor', {
  theme: 'snow',
  toolbar: toolbarOptions,
});
  
    // Get the form element
    const form1 = document.getElementById('stepForm');
  
    // Add an event listener for form submission
    form1.addEventListener('submit', function(event) {
      // Prevent the default form submission behavior
      event.preventDefault();
      
      // Get the HTML content from Quill
      const quillContent = quill.root.innerHTML;
  
      // Set the content to the hidden input field
      document.getElementById('quillContent').value = quillContent;
  
      // Submit the form
      this.submit();
    });
  </script>
<script src="/js/index.js"></script>
</body>
</html>