📦 Updated

Author: CSFelix

index.html

@@ -451,6 +451,19 @@ <h2 class="skillsTitle">Live Projects</h2>
 					    <img src="./assets/icons/world-wide-web.avif" class="character" alt="Live Projects 2" width="200px" height="200px" />
 					</div>
 
+					<!--
+						**************
+						** Datasets **
+						**************
+					-->
+					<div id="datasetsBtn" class="skillsCard">
+						<div class="wrapper">
+					      <img src="./assets/icons/projects/cards/table.avif" class="cover-image" alt="Datasets 1" width="200px" height="200px" />
+					    </div>
+					    <h2 class="skillsTitle">Datasets</h2>
+					    <img src="./assets/icons/panda.avif" class="character" alt="Datasets 2" width="200px" height="200px" />
+					</div>
+
 					<!--
 						*******************
 						** ML Algorithms **
@@ -843,6 +856,75 @@ <h3>Coming soon...</h3>
 
 		</div>
 
+		<!-- Datasets -->
+		<div id="datasetsModal" class="modal">
+		  
+		  <div class="modalContent">
+
+		  	<!-- close button -->
+		    <span id="datasetsClose" class="close">&times;</span>
+
+		    <!-- title -->
+		    <div class="modalTitle">
+		    	<img src="./assets/icons/panda.avif" alt="Datasets Logo" width="200px" height="200px" />
+		    	&nbsp
+		    	<span>Datasets</span>
+		    </div>
+
+		    <br />
+
+		    <!-- items -->
+		    <div class="modalItems">
+		    	<video width="250px" height="auto" loop muted autoplay>
+					<source src="./assets/stickers/robot/projects.mp4" type="video/mp4" />
+				</video>
+		    	&nbsp
+
+		    	<!-- cards -->
+		    	<div class="cardsGroup">
+
+		    		<!-- First Project -->
+		    		<a href="https://www.kaggle.com/datasets/dsfelix/us-stores-sales" target="_blank">
+		    			<div class="card" data-tilt>
+		    				<img src="./assets/icons/projects/coupon.avif" alt="US Store Sales" width="200px" height="200px">
+
+		    				<span>US Store Sales</span>
+		    			</div>
+		    		</a>
+
+		    		<!-- Second Project -->
+		    		<a href="https://www.kaggle.com/datasets/dsfelix/jojo-stands-stats" target="_blank">
+		    			<div class="card" data-tilt>
+		    				<img src="./assets/icons/projects/jojo.avif" alt="JoJo Stands Stats" width="200px" height="200px">
+
+		    				<span>JoJo Stands Stats</span>
+		    			</div>
+		    		</a>
+
+		    		<!-- Third Project -->
+		    		<a href="https://www.kaggle.com/datasets/dsfelix/employees-payroll-in-los-angeles" target="_blank">
+		    			<div class="card" data-tilt>
+		    				<img src="./assets/icons/projects/acquisition.avif" alt="Employees Payroll in Los Angeles" width="200px" height="200px">
+
+		    				<span>Employees Payroll in Los Angeles</span>
+		    			</div>
+		    		</a>
+
+		    		<!-- Fourth Project -->
+		    		<a href="https://www.kaggle.com/datasets/dsfelix/employees-annual-salary-in-chicago" target="_blank">
+		    			<div class="card" data-tilt>
+		    				<img src="./assets/icons/projects/salary.avif" alt="Employees Annual Salary in Chicago" width="200px" height="200px">
+
+		    				<span>Employees Annual Salary in Chicago</span>
+		    			</div>
+		    		</a>
+		    	</div>
+		    </div>
+		  </div>
+
+		</div>
+
+
 		<!-- ML Algorithms -->
 		<div id="mlAlgorithmsModal" class="modal">