dezzo8
diff --git a/‎.DS_Store
0 Bytes b/‎.DS_Store
0 Bytes
diff --git a/‎index.html
Lines changed: 19 additions & 1 deletion b/‎index.html
Lines changed: 19 additions & 1 deletion
diff --git a/‎resources/.DS_Store
6 KB b/‎resources/.DS_Store
6 KB
diff --git a/‎resources/css/main.css b/‎resources/css/main.css
diff --git a/‎resources/js/script.js b/‎resources/js/script.js
@@ -6,21 +6,39 @@
 	<title>Off Limits Events</title>
 
 	<!-- MY CSS -->
+	<link rel="stylesheet" type="text/css" href="resources/css/main.css">
 
 	<!-- VENDOR CSS -->
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+	<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
     <link type="text/css" rel="stylesheet" href="vendors/css/materialize.css"  media="screen,projection"/>
 
     <!--Let browser know website is optimized for mobile-->
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
 
 	<!-- MY JS -->
+	<script type="text/javascript" src="resources/js/script.js"></script>
 
 	<!-- VENDOR JS -->
 	<script type="text/javascript" src="vendors/js/materialize.js"></script>
+	<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js"></script>
+	<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ScrollTrigger.min.js"></script>
+	<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ScrollToPlugin.min.js"></script>
+	<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/TextPlugin.min.js"></script>
+	<script>
+	 // use a script tag or an external JS file
+	 document.addEventListener("DOMContentLoaded", (event) => {
+	  gsap.registerPlugin(ScrollTrigger,ScrollToPlugin,TextPlugin)
+	  gsap.set({title}, {opacity:0})
+	  gsap.to({title}, {opacity:1, duration:1, ease: "sine.inOut"})
+	 });
+
+	</script>
 
 </head>
 <body>
-<h1>OFF GIBLITS</h1>
+<h1 id="title">OFF GIBLITS</h1>
 </body>
 </html>