Initial Build

assets/landing.js

@@ -0,0 +1,57 @@
+import './styles/landing.css';
+import './stimulus_bootstrap.js';
+
+const mobileMenu = () => {
+    const icon = document.querySelector('.icon-menu');
+    const menu = document.querySelector('.front-menu');
+
+    icon.addEventListener('click', (event) => {
+        icon.classList.toggle('open');
+        menu.classList.toggle('open');
+    });
+}
+
+const jobInfoToggle = () => {
+    const jobs = document.querySelectorAll('#work .jobs .job');
+    
+    jobs.forEach((job) => {
+        job.addEventListener('click', (event) => {
+            const jobId = job.dataset.jobId;
+            const jobInfo = document.querySelector(`#${jobId}`);
+            const activeJobLabel = document.querySelector('#work .jobs .job.active');
+            
+            if (jobInfo.classList.contains('hide')) {
+                const openJob = document.querySelector('#work .jobs .job-highlight.show');
+
+                if (jobInfo.classList.contains('hide')) {
+
+                    jobInfo.classList.remove('hide');
+                    jobInfo.classList.add('show');
+                    openJob.classList.remove('show');
+                    openJob.classList.add('hide');
+                }
+            }
+
+            if (!job.classList.contains('active')) {
+                job.classList.add('active');
+                activeJobLabel.classList.remove('active');
+            }
+        });
+    });
+}
+
+const scrollTo = () => {
+    const links = document.querySelectorAll('#outro .menu a');
+    
+    links.forEach((link) => {
+        link.addEventListener('click', (event) => {
+            const anchor = link.dataset.scrollTo;
+            const element = document.querySelector(`#${anchor}`).scrollIntoView();
+            window.history.pushState({}, '', `#${anchor}`);
+        })
+    });
+}
+
+mobileMenu();
+jobInfoToggle();
+scrollTo();