Merge pull request #728 from aslams2020/NavFooterIcons

✔️Added Icons to All Non-Home Pages !
ChromeGaming · Aug 7, 2024 · 8611149 · 8611149
2 parents c5279e6 + 4cfb615
commit 8611149
Show file tree

Hide file tree

Showing 4 changed files with 65 additions and 35 deletions.
diff --git a/pages/FAQs.html b/pages/FAQs.html
@@ -6,6 +6,22 @@
 		<!-- displays site properly based on user's device -->
 
 		<link rel="icon" href="../assets/favicon.ico" type="image/x-icon" />
+		<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=Anton&display=swap"
+			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=Tiny5&display=swap"
+			rel="stylesheet"
+		/>
+		<link
+		rel="stylesheet"
+		href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
+	/>
 		<!-- <link rel="stylesheet" href="../styles/mainstyle.css" /> -->
 		<link rel="stylesheet" href="../styles/global.css" />
 		<link rel="stylesheet" href="../styles/mainstyle.css" />
@@ -29,13 +45,11 @@
 				</div>
 
 				<ul class="nav-links" id="nav-links-toggled">
-					<li><a href="../index.html">Home</a></li>
-					<li><a href="../pages/about.html">About Us</a></li>
-					<li><a href="../pages/FAQs.html">FAQs</a></li>
-					<li><a href="../pages/contributors.html">Contributors</a></li>
-					<button class="start">
-						<a href="../pages/game.html">Let's Go</a>
-					</button>
+					<li><a href="../index.html"><i class="fas fa-home"></i> Home</a></li>
+					<li><a href="../pages/about.html"><i class="fas fa-info-circle"></i> About Us</a></li>
+					<li><a href="../pages/FAQs.html"><i class="fas fa-question-circle"></i> FAQs</a></li>
+					<li><a href="../pages/contributors.html"><i class="fas fa-users"></i> Contributors</a></li>
+					<button class="start"><a href="../pages/game.html"><i class="fas fa-gamepad"></i> Let's Go</a></button>
 				</ul>
 				<!-- <button class="navbar-toggler" id="navbar-toggler" type="button" onclick="toggleNavBar()">
             <span class="toggler-icon"></span>
@@ -153,10 +167,10 @@ <h1 id="faq-head">
 
 		<div class="author">
 			<div class="fotbar">
-				<a href="howtoplay.html"> HowToPlay?</a>
-				<a href="termsofservice.html"> TermsOfService</a>
-				<a href="privacypolicy.html"> PrivacyPolicy</a>
-				<a href="licensing.html"> Licensing</a>
+				<a href="howtoplay.html"><i class="fas fa-gamepad"></i> HowToPlay?</a>
+				<a href="termsofservice.html"><i class="fas fa-file-contract"></i> TermsOfService</a>
+				<a href="privacypolicy.html"><i class="fas fa-user-shield"></i> PrivacyPolicy</a>
+				<a href="licensing.html"><i class="fas fa-copyright"></i> Licensing</a>
 			</div>
 			<p>
 				Created with ❤️ by

diff --git a/pages/about.html b/pages/about.html
@@ -55,12 +55,12 @@
 			</div>
 
 			<ul class="nav-links" id="nav-links-toggled">
-				<li><a href="../index.html">Home</a></li>
-				<li><a href="../pages/about.html">About Us</a></li>
-				<li><a href="../pages/FAQs.html">FAQs</a></li>
-				<li><a href="../pages/contributors.html">Contributors</a></li>
+				<li><a href="../index.html"><i class="fas fa-home"></i> Home</a></li>
+				<li><a href="../pages/about.html"><i class="fas fa-info-circle"></i> About Us</a></li>
+				<li><a href="../pages/FAQs.html"><i class="fas fa-question-circle"></i> FAQs</a></li>
+				<li><a href="../pages/contributors.html"><i class="fas fa-users"></i> Contributors</a></li>
 				<button class="start">
-					<a href="../pages/game.html">Let's Go</a>
+					<a href="../pages/game.html"><i class="fas fa-gamepad"></i> Let's Go</a>
 				</button>
 			</ul>
 			<!-- <button class="navbar-toggler" id="navbar-toggler" type="button" onclick="toggleNavBar()">
@@ -205,10 +205,10 @@ <h3 class="card-title">How to Play</h3>
 
 		<div class="author">
 			<div class="fotbar">
-				<a href="howtoplay.html">HowToPlay?</a>
-				<a href="termsofservice.html">TermsOfService</a>
-				<a href="privacypolicy.html">PrivacyPolicy</a>
-				<a href="licensing.html">Licensing</a>
+				<a href="howtoplay.html"><i class="fas fa-gamepad"></i> HowToPlay?</a>
+				<a href="termsofservice.html"><i class="fas fa-file-contract"></i> TermsOfService</a>
+				<a href="privacypolicy.html"><i class="fas fa-user-shield"></i>  PrivacyPolicy</a>
+				<a href="licensing.html"><i class="fas fa-copyright"></i> Licensing</a>
 			</div>
 			<p>
 				Created with ❤️ by

diff --git a/pages/contributors.html b/pages/contributors.html
@@ -22,11 +22,11 @@
                 <a href="../index.html">Dots & Boxes ⚄</a>
             </div>
             <ul class="nav-links" id="nav-links-toggled">
-                <li><a href="../index.html">Home</a></li>
-                <li><a href="../pages/about.html">About Us</a></li>
-                <li><a href="../pages/FAQs.html">FAQs</a></li>
-                <li><a href="../pages/contributors.html">Contributors</a></li>
-                <button class="start"><a href="../pages/game.html">Let's Go</a></button>
+                <li><a href="../index.html"><i class="fas fa-home"></i> Home</a></li>
+                <li><a href="../pages/about.html"><i class="fas fa-info-circle"></i> About Us</a></li>
+                <li><a href="../pages/FAQs.html"><i class="fas fa-question-circle"></i> FAQs</a></li>
+                <li><a href="../pages/contributors.html"><i class="fas fa-users"></i> Contributors</a></li>
+                <button class="start"><a href="../pages/game.html"><i class="fas fa-gamepad"></i> Let's Go</a></button>
             </ul>
             <nav class="mobile-menu">
                 <div class="mobile-menu__trigger"><span></span></div>
@@ -56,10 +56,10 @@ <h1 class="text-center text-3xl font-semibold mb-8" style="background-color: #33
 
     <div class="author">
         <div class="fotbar">
-            <a href="howtoplay.html"> HowToPlay?</a>
-            <a href="termsofservice.html"> TermsOfService</a>
-            <a href="privacypolicy.html"> PrivacyPolicy</a>
-            <a href="licensing.html"> Licensing</a>
+            <a href="howtoplay.html"><i class="fas fa-gamepad"></i> HowToPlay?</a>
+            <a href="termsofservice.html"><i class="fas fa-file-contract"></i> TermsOfService</a>
+            <a href="privacypolicy.html"><i class="fas fa-user-shield"></i> PrivacyPolicy</a>
+            <a href="licensing.html"><i class="fas fa-copyright"></i> Licensing</a>
         </div>
         <p>Created with ❤️ by <a href="https://github.com/ChromeGaming">Chrome Gaming</a></p>
         <div class="social-icons">

diff --git a/pages/howtoplay.html b/pages/howtoplay.html
@@ -4,6 +4,22 @@
 		<meta charset="UTF-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 		<title>How to Play - Dot Box</title>
+		<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=Anton&display=swap"
+			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=Tiny5&display=swap"
+			rel="stylesheet"
+		/>
+		<link
+		rel="stylesheet"
+		href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
+	/>
 		<link rel="stylesheet" href="../styles/mainstyle.css" />
 		<link rel="stylesheet" href="/styles/global.css" />
 		<link rel="stylesheet" href="../styles/howtoplay.css" />
@@ -34,12 +50,12 @@
 					</div>
 
 					<ul class="nav-links" id="nav-links-toggled">
-						<li><a href="../index.html">Home</a></li>
-						<li><a href="../pages/about.html">About Us</a></li>
-						<li><a href="../pages/FAQs.html">FAQs</a></li>
-						<li><a href="../pages/contributors.html">Contributors</a></li>
+						<li><a href="../index.html"><i class="fas fa-home"></i>Home</a></li>
+						<li><a href="../pages/about.html"><i class="fas fa-info-circle"></i>About Us</a></li>
+						<li><a href="../pages/FAQs.html"><i class="fas fa-question-circle"></i>FAQs</a></li>
+						<li><a href="../pages/contributors.html"><i class="fas fa-users"></i>Contributors</a></li>
 						<button class="start">
-							<a href="../pages/game.html">Let's Go</a>
+							<a href="../pages/game.html"><i class="fas fa-gamepad"></i>Let's Go</a>
 						</button>
 					</ul>
 					<!-- <button class="navbar-toggler" id="navbar-toggler" type="button" onclick="toggleNavBar()">
@@ -138,7 +154,7 @@ <h2 class="tut-head">Tutorial Video</h2>
 						- In case of a tie, the player who completed the last box wins.<br />
 						- Optionally, a tie can be broken by the number of consecutive boxes
 						completed.
-					</li>
+					</li> 
 					<li>
 						<strong>Strategies: 🧠</strong><br />
 						- Try to force your opponent into a position where they have to give