diff --git a/src/components/introAudio/IntroAudio.js b/src/components/introAudio/IntroAudio.js
index 6bb60da..a2beacd 100644
--- a/src/components/introAudio/IntroAudio.js
+++ b/src/components/introAudio/IntroAudio.js
@@ -1,31 +1,10 @@
-import React, {useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
import intro_music from "../../assets/audio/intro-music.mp3";
import "./IntroAudio.css";
-
-const IntroAudio = () => {
- // Intro-Music-Logic
+const IntroAudio = () => {
const [notPlaying, setnotPlaying] = useState(true);
- const [scrollisPlaying, setscrollisPlaying] = useState(null);
const audioRef = React.createRef();
- //This part inside useEffect is only to test that music playing upon scrolling part.
- const scrollThreshold = 100;
- useEffect(() => {
- // Function to handle the scroll event
- const handleScroll = () => {
- //threshold here defines how many pixels you will scroll when the music starts to play
-
- if (window.scrollY >= scrollThreshold && !scrollisPlaying) {
- audioRef.current.play();
- setscrollisPlaying(true);
- setnotPlaying(false); //To change the icon
- }
- };
- window.addEventListener("scroll", handleScroll);
- return () => {
- window.removeEventListener("scroll", handleScroll);
- };
- }, [scrollisPlaying]);
const toggle = () => {
if (notPlaying) {
@@ -33,100 +12,98 @@ const IntroAudio = () => {
} else {
audioRef.current.pause();
}
- setscrollisPlaying(false);
setnotPlaying(!notPlaying);
};
return (
-
-
-
-
+
- )
-}
+ );
+};
-export default IntroAudio
\ No newline at end of file
+export default IntroAudio;
diff --git a/src/motionUtils.js b/src/motionUtils.js
index c1582ca..41f6835 100644
--- a/src/motionUtils.js
+++ b/src/motionUtils.js
@@ -26,6 +26,7 @@ export const sliderSettings = {
slidesToShow: 3,
slidesToScroll: 1,
initialSlide: 0,
+ lazyload: true,
touchMove: true,
useCSS: true,
autoplay: true,
diff --git a/src/pages/home/sections/section1/Section1.css b/src/pages/home/sections/section1/Section1.css
index 1adc5ff..454e2c2 100644
--- a/src/pages/home/sections/section1/Section1.css
+++ b/src/pages/home/sections/section1/Section1.css
@@ -141,7 +141,7 @@
.codeutsava__section1-side-links {
position: absolute;
left: 48px;
- bottom: 4rem;
+ bottom: 5rem;
margin: 0;
padding: 0;
list-style: none;
diff --git a/src/pages/home/sections/section1/Section1.js b/src/pages/home/sections/section1/Section1.js
index 85055e6..c0482d5 100644
--- a/src/pages/home/sections/section1/Section1.js
+++ b/src/pages/home/sections/section1/Section1.js
@@ -3,7 +3,6 @@ import "./Section1.css";
import codeutsavaTitle from "../../../../assets/images/codeutsavaTitle3d.svg";
import discord from "../../../../assets/images/discord.svg";
import wel from "../../../../assets/images/welcome.png";
-import intro_music from "../../../../assets/audio/intro-music.mp3";
import { animate, motion, transform } from "framer-motion";
import {
@@ -19,16 +18,16 @@ const Section1 = () => {
const c1 = "#7f00a6";
const c2 = "#b200ee";
- // React.useEffect(() => {
- // const script = document.createElement("script");
- // script.src = "https://apply.devfolio.co/v2/sdk.js";
- // script.async = true;
- // script.defer = true;
- // document.body.appendChild(script);
- // return () => {
- // document.body.removeChild(script);
- // };
- // }, []);
+ React.useEffect(() => {
+ const script = document.createElement("script");
+ script.src = "https://apply.devfolio.co/v2/sdk.js";
+ script.async = true;
+ script.defer = true;
+ document.body.appendChild(script);
+ return () => {
+ document.body.removeChild(script);
+ };
+ }, []);
const canvasRef = useRef(null);
useEffect(() => {