From 0a16c8e7086e04caaa807e43335f21f81be485fa Mon Sep 17 00:00:00 2001
From: Gnarwhal <git.aspect893@passmail.net>
Date: Fri, 22 Jan 2021 03:12:42 -0500
Subject: [PATCH] Added box-shadows

---
 front_end/index.html       | 12 ++++++------
 front_end/styles/index.css | 18 ++++++++++++++++--
 2 files changed, 22 insertions(+), 8 deletions(-)

diff --git a/front_end/index.html b/front_end/index.html
index a5e549f..6e85874 100644
--- a/front_end/index.html
+++ b/front_end/index.html
@@ -88,8 +88,8 @@
 					<p class="page-header-text">Achievements</p>
 					<div class="page-header-separator"></div>
 					<div class="list-page-search">
-						<label for="game-search">Search</label>
-						<input id="game-search" type="text" placeholder="Name, Keyword, etc..." name="game-search" />
+						<label for="achievement-search">Search</label>
+						<input id="achievement-search" type="text" placeholder="Name, Keyword, etc..." name="achievement-search" />
 					</div>
 					<div class="list-page-partitions">
 						<div class="list-page-filter-partition">
@@ -265,19 +265,19 @@
 						<div class="page-subheader-separator"></div>
 						<div class="profile-game-entry">
 							<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
-							<p class="profile-game-entry-name">Lorem Ipsum</p>
+							<p class="profile-game-entry-name">Latin</p>
 						</div>
 						<div class="profile-game-entry">
 							<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
-							<p class="profile-game-entry-name">Lorem Ipsum</p>
+							<p class="profile-game-entry-name">Latin</p>
 						</div>
 						<div class="profile-game-entry">
 							<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
-							<p class="profile-game-entry-name">Lorem Ipsum</p>
+							<p class="profile-game-entry-name">Latin</p>
 						</div>
 						<div class="profile-game-entry">
 							<img class="profile-game-entry-icon" src="res/dummy_game.png" alt="Some Game Icon" />
-							<p class="profile-game-entry-name">Lorem Ipsum</p>
+							<p class="profile-game-entry-name">Latin</p>
 						</div>
 					</div>
 					<div id="profile-achievements">
diff --git a/front_end/styles/index.css b/front_end/styles/index.css
index 3d3816e..ce657cc 100644
--- a/front_end/styles/index.css
+++ b/front_end/styles/index.css
@@ -1,4 +1,5 @@
 :root {
+	--background-dark: #111115;
 	--background: #22222A;
 	--foreground: #EEEEEE;
 	--distinction: #44444F;
@@ -20,7 +21,7 @@
 }
 
 html, body {
-	background-color: var(--background);
+	background-color: var(--background-dark);
 
 	margin: 0;
 	border: 0;
@@ -32,6 +33,8 @@ html, body {
 }
 
 #navbar {
+	z-index: 1;
+
 	position: fixed;
 
 	background-color: var(--navbar-background);
@@ -45,6 +48,8 @@ html, body {
 	flex-direction: row;
 	justify-content: space-between;
 	align-items: center;
+
+	box-shadow: 0px 0px 5px 10px rgba(0, 0, 0, 0.5);
 }
 
 #navbar-left {
@@ -108,12 +113,19 @@ html, body {
 }
 
 .page {
+	z-index: 0;
+
 	box-sizing: border-box;
 
 	padding: 0px 64px;
 
 	width: 100%;
-	height: max-content;
+	height: 100%;
+
+	background-color: var(--background);
+	box-shadow: 0px 0px 5px 10px rgba(0, 0, 0, 0.5);
+
+	overflow-y: auto;
 
 	display: none;
 }
@@ -449,6 +461,8 @@ html, body {
 
 #profile-page {
 	max-width: 1920px;
+
+	display: block;
 }
 
 #profile-section-1 {