feat: add landing page components including FAQ, features, footer, header, hero, modalities, steps, and section title

resources/js/Client/composables/useScrollReveal.js

@@ -0,0 +1,27 @@
+import { onBeforeUnmount, onMounted } from 'vue'
+
+export function useScrollReveal(rootRef, selector = '.landing-reveal') {
+    let observer = null
+
+    onMounted(() => {
+        const elements = rootRef.value?.querySelectorAll(selector) ?? []
+
+        if (!('IntersectionObserver' in window)) {
+            elements.forEach((element) => element.classList.add('is-visible'))
+            return
+        }
+
+        observer = new IntersectionObserver((entries) => {
+            entries.forEach((entry) => {
+                if (entry.isIntersecting) {
+                    entry.target.classList.add('is-visible')
+                    observer.unobserve(entry.target)
+                }
+            })
+        }, { threshold: 0.05 })
+
+        elements.forEach((element) => observer.observe(element))
+    })
+
+    onBeforeUnmount(() => observer?.disconnect())
+}