changes to blocks and styles

assets/js/backend-script.js

@@ -55,4 +55,62 @@ document.addEventListener('DOMContentLoaded', function() {
             });
         });
     });
-});
+});
+
+
+
+
+
+
+
+// REPEATERS
+    // Example html:
+    //  <div class="my-repeater-container">
+    // <div class="my-repeater-row">
+    // <input type="text" name="field_1[]">
+    // <input type="text" name="field_2[]">
+    // <input type="text" name="field_3[]">
+    //<button class="delete-repeater-row">Delete Row</button>
+    //</div>
+    //<button class="new-repeater-row">Click to add a new row</button>
+    //</div>
+
+document.addEventListener('DOMContentLoaded', function () {
+    // Get all repeater containers
+    const repeaterContainers = document.querySelectorAll('.my-repeater-container');
+    
+    // Loop through each repeater container and initialize the functionality
+    repeaterContainers.forEach(function (container) {
+        const newRowButton = container.querySelector('.new-repeater-row');
+        const rowTemplate = container.querySelector('.my-repeater-row');
+
+        // Hide the row template (we will clone it)
+        rowTemplate.style.display = 'none';
+
+        // Add event listener for the 'Add New Row' button
+        newRowButton.addEventListener('click', function () {
+            // Clone the row template
+            const newRow = rowTemplate.cloneNode(true);
+
+            // Make sure the new row is visible
+            newRow.style.display = 'flex';  // or 'block' based on your layout
+
+            // Reset input values in the new row
+            const inputs = newRow.querySelectorAll('input');
+            inputs.forEach(input => input.value = '');
+
+            // Add the new row to the repeater container
+            container.insertBefore(newRow, newRowButton);
+        });
+
+        // Handle deleting rows
+        container.addEventListener('click', function (e) {
+            if (e.target && e.target.classList.contains('delete-repeater-row')) {
+                const rowToDelete = e.target.closest('.my-repeater-row');
+                if (rowToDelete) {
+                    rowToDelete.remove();
+                }
+            }
+        });
+    });
+});

assets/js/highlight-to-share.js

@@ -0,0 +1,71 @@
+document.addEventListener("DOMContentLoaded", function () {
+  // Get reference to the popup element
+  const popup = document.getElementById('popup');
+  const facebookShareLink = document.getElementById('facebook-share');
+  const twitterShareLink = document.getElementById('twitter-share');
+  
+  // Function to check if selection intersects with any <p> tag
+  function isSelectionInParagraph(selection) {
+      const range = selection.getRangeAt(0);  // Get the selected range
+      const paragraphs = document.querySelectorAll('p');  // Get all <p> elements
+
+      for (let p of paragraphs) {
+          // Check if the selected range intersects with this <p> tag
+          const pRect = p.getBoundingClientRect();
+          const rangeRect = range.getBoundingClientRect();
+
+          // Check if the range and the <p> element's bounding boxes overlap
+          if (rangeRect.top < pRect.bottom && rangeRect.bottom > pRect.top && 
+              rangeRect.left < pRect.right && rangeRect.right > pRect.left) {
+              return true;  // Selection intersects with this <p> tag
+          }
+      }
+
+      return false;  // No intersection with any <p> tag
+  }
+
+  // Function to show the popup near the selected text
+  function showPopup(e) {
+      const selection = window.getSelection();
+      
+      // Check if any text is selected and if it is inside or intersects with a <p> tag
+      if (selection.toString().length > 0 && isSelectionInParagraph(selection)) {
+          // Get the bounding rectangle of the selected text
+          const range = selection.getRangeAt(0);
+          const rect = range.getBoundingClientRect();
+          
+          // Position the popup above the selection (adjust for spacing)
+          popup.style.left = `${rect.left + window.scrollX}px`;
+          popup.style.top = `${rect.top + window.scrollY - popup.offsetHeight - 5}px`;
+          
+          // Show the popup
+          popup.style.display = 'block';
+
+          // Set up share links with the selected text and page URL
+          const selectedText = selection.toString();
+          const pageUrl = window.location.href;
+
+          // Facebook share link
+          facebookShareLink.setAttribute('href', `https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(pageUrl)}&quote=${encodeURIComponent(selectedText)}`);
+          
+          // Twitter/X share link
+          twitterShareLink.setAttribute('href', `https://twitter.com/intent/tweet?text=${encodeURIComponent(selectedText)}&url=${encodeURIComponent(pageUrl)}`);
+      } else {
+          // Hide the popup if no text is selected or it's not inside or overlapping a <p> tag
+          popup.style.display = 'none';
+      }
+  }
+
+  // Listen for mouse-up event (when selection ends)
+  document.addEventListener('mouseup', showPopup);
+
+  // Optionally, listen for touchend event for mobile devices
+  document.addEventListener('touchend', showPopup);
+
+  // Hide the popup if user clicks anywhere else
+  document.addEventListener('click', function(event) {
+    if (!popup.contains(event.target) && !window.getSelection().toString()) {
+      popup.style.display = 'none';
+    }
+  });
+});