Merge branch 'main' of github.com:rankrunners-dev/next-cochise into main

src/components/Team.tsx

@@ -93,11 +93,11 @@ export default function Team() {
                   </div>
                 </div>
                 <div className="owl-buttons">
-                  <div className="owl-prev snbp1 owl-prev-testimonial-1" role="button" tabIndex="0">
+                  <div className="owl-prev snbp1 owl-prev-testimonial-1" role="button" tabIndex={0}>
                     <span className="visually-hidden">Previous Slide</span>
                     <i className="mi-arrow-left" aria-hidden="true"></i>
                   </div>
-                  <div className="owl-next snbn1" role="button" tabIndex="0">
+                  <div className="owl-next snbn1" role="button" tabIndex={0}>
                     <span className="visually-hidden">Next Slide</span>
                     <i className="mi-arrow-right" aria-hidden="true"></i>
                   </div>

src/utils/addScroll.ts

@@ -1,29 +1,20 @@
-const addScrollspy = (
+const addScrollspy = (defalutClass = "", linksContainer = ".scrollspy-link", activeClass = "active") => {
-  defalutClass = "",
+  const section = document.querySelectorAll(".scrollSpysection");
-  linksContainer = ".scrollspy-link",
-  activeClass = "active"
-) => {
-  var section = document.querySelectorAll(".scrollSpysection");
 
-  var sections = {};
+  const sections = {};
-  var i = 0;
+  const i = 0;
 
   Array.prototype.forEach.call(section, function (e) {
     // @ts-ignore
     sections[e.id] = e.offsetTop;
   });
-  var scrollPosition =
+  const scrollPosition = document.documentElement.scrollTop || document.body.scrollTop;
-    document.documentElement.scrollTop || document.body.scrollTop;
 
-  for (let i in sections) {
+  for (const i in sections) {
     // @ts-ignore
     if (sections[i] <= scrollPosition) {
-      document
+      document.querySelector(linksContainer + ` .${activeClass}`)?.setAttribute("class", defalutClass);
-        .querySelector(linksContainer + ` .${activeClass}`)
+      const navLink = document.querySelector(linksContainer + " a[href*=" + i + "]");
-        ?.setAttribute("class", defalutClass);
-      const navLink = document.querySelector(
-        linksContainer + " a[href*=" + i + "]"
-      );
 
       navLink?.setAttribute("class", `${defalutClass} ${activeClass}`);
     }

src/utils/changeHeaderOnScroll.ts

@@ -1,7 +1,7 @@
 export const headerChangeOnScroll = () => {
-  var mainNav = document.querySelector(".main-nav");
+  const mainNav = document.querySelector(".main-nav");
-  var navLogoWrapLogo = document.querySelector(".nav-logo-wrap .logo");
+  const navLogoWrapLogo = document.querySelector(".nav-logo-wrap .logo");
-  var lightAfterScroll = document.querySelector(".light-after-scroll");
+  const lightAfterScroll = document.querySelector(".light-after-scroll");
   if (window.scrollY > 0) {
     mainNav?.classList.remove("transparent");
     mainNav?.classList.add("small-height", "body-scrolled");

src/utils/initWow.ts

@@ -7,11 +7,9 @@ export function init_wow() {
   setTimeout(() => {
     /* Wow init */
     if (document.body.classList.contains("appear-animate")) {
-      document
+      document.querySelectorAll(".wow").forEach((el) => el.classList.add("no-animate"));
-        .querySelectorAll(".wow")
-        .forEach((el) => el.classList.add("no-animate"));
     }
-    var wow = new WOW({
+    const wow = new WOW({
       boxClass: "wow",
       animateClass: "animatedfgfg",
       offset: 100,
@@ -23,17 +21,13 @@ export function init_wow() {
     if (document.body.classList.contains("appear-animate")) {
       wow.init();
     } else {
-      document
+      document.querySelectorAll(".wow").forEach((el) => (el.style.opacity = "1"));
-        .querySelectorAll(".wow")
-        .forEach((el) => (el.style.opacity = "1"));
     }
     /* Wow for portfolio init */
     if (document.body.classList.contains("appear-animate")) {
-      document
+      document.querySelectorAll(".wow-p").forEach((el) => el.classList.add("no-animate"));
-        .querySelectorAll(".wow-p")
-        .forEach((el) => el.classList.add("no-animate"));
     }
-    var wow_p = new WOW({
+    const wow_p = new WOW({
       boxClass: "wow-p",
       animateClass: "animatedfgfg",
       offset: 100,
@@ -45,9 +39,7 @@ export function init_wow() {
     if (document.body.classList.contains("appear-animate")) {
       wow_p.init();
     } else {
-      document
+      document.querySelectorAll(".wow-p").forEach((el) => (el.style.opacity = "1"));
-        .querySelectorAll(".wow-p")
-        .forEach((el) => (el.style.opacity = "1"));
     }
     /* Wow for menu bar init */
     if (
@@ -62,9 +54,7 @@ export function init_wow() {
         }, 1500);
       });
     } else {
-      document
+      document.querySelectorAll(".wow-menubar").forEach((el) => (el.style.opacity = "1"));
-        .querySelectorAll(".wow-menubar")
-        .forEach((el) => (el.style.opacity = "1"));
     }
   }, 100);
 }

src/utils/menuToggle.ts

@@ -1,17 +1,14 @@
 // @ts-nocheck
 export function init_classic_menu_resize() {
-  var mobile_nav = document.querySelector(".mobile-nav");
+  const mobile_nav = document.querySelector(".mobile-nav");
-  var desktop_nav = document.querySelector(".desktop-nav");
+  const desktop_nav = document.querySelector(".desktop-nav");
 
   mobile_nav.setAttribute("aria-expanded", "false");
 
   // Mobile menu max height
   if (document.querySelector(".main-nav")) {
     document.querySelector(".desktop-nav > ul").style.maxHeight =
-      window.innerHeight -
+      window.innerHeight - document.querySelector(".main-nav").offsetHeight - 20 + "px";
-      document.querySelector(".main-nav").offsetHeight -
-      20 +
-      "px";
   }
 
   // Mobile menu style toggle

src/utils/parallax.ts

@@ -11,13 +11,11 @@ export const parallaxMouseMovement = () => {
 
       this.querySelectorAll(".parallax-mousemove").forEach((el) => {
         const offset = parseInt(el.getAttribute("data-offset"));
-        const translate = `translate3d(${Math.round(
+        const translate = `translate3d(${Math.round(offsetX * offset)}px, ${Math.round(offsetY * offset)}px, 0px)`;
-          offsetX * offset
-        )}px, ${Math.round(offsetY * offset)}px, 0px)`;
         el.style.transform = translate;
       });
 
-      let sceneOffsetX = e.pageX - this.offsetLeft;
+      const sceneOffsetX = e.pageX - this.offsetLeft;
 
       this.querySelectorAll(".parallax-mousemove-follow").forEach((el) => {
         el.style.left = `${sceneOffsetX}px`;
@@ -58,10 +56,7 @@ export function parallaxScroll() {
 
       function addScrollParallax() {
         document.querySelectorAll("[data-rellax-y]").forEach((element) => {
-          if (
+          if (element.getBoundingClientRect().top < window.innerHeight && element.getBoundingClientRect().bottom > 0) {
-            element.getBoundingClientRect().top < window.innerHeight &&
-            element.getBoundingClientRect().bottom > 0
-          ) {
             if (!element.classList.contains("js-in-viewport")) {
               element.classList.add("js-in-viewport");
               rellax_y.refresh();
@@ -87,10 +82,7 @@ export function parallaxScroll() {
       });
       function addParallaxX() {
         document.querySelectorAll("[data-rellax-x]").forEach((element) => {
-          if (
+          if (element.getBoundingClientRect().top < window.innerHeight && element.getBoundingClientRect().bottom > 0) {
-            element.getBoundingClientRect().top < window.innerHeight &&
-            element.getBoundingClientRect().bottom > 0
-          ) {
             if (!element.classList.contains("js-in-viewport")) {
               element.classList.add("js-in-viewport");
               rellax_x.refresh();

src/utils/toggleMobileMenu.ts

@@ -1,7 +1,7 @@
 // @ts-nocheck
 export const toggleMobileMenu = () => {
-  var mobile_nav = document.querySelector(".mobile-nav");
+  const mobile_nav = document.querySelector(".mobile-nav");
-  var desktop_nav = document.querySelector(".desktop-nav");
+  const desktop_nav = document.querySelector(".desktop-nav");
 
   if (desktop_nav.classList.contains("js-opened")) {
     desktop_nav.style.maxHeight = "0px";
@@ -14,8 +14,8 @@ export const toggleMobileMenu = () => {
   }
 };
 export const closeMobileMenu = () => {
-  var mobile_nav = document.querySelector(".mobile-nav");
+  const mobile_nav = document.querySelector(".mobile-nav");
-  var desktop_nav = document.querySelector(".desktop-nav");
+  const desktop_nav = document.querySelector(".desktop-nav");
 
   if (desktop_nav.classList.contains("js-opened")) {
     desktop_nav.style.maxHeight = "0px";