From ed2e644f09f81116bfe33b670875e5ab5c0c7948 Mon Sep 17 00:00:00 2001
From: Corey Peterson <corey.peterson@ucf.edu>
Date: Tue, 1 Oct 2024 13:19:33 -0400
Subject: [PATCH] Moves dock below playable area while folders remain in their
 normal position. Applies linear gradient directly to BG image.

---
 src/player.html | 5 +++--
 src/player.scss | 5 ++++-
 2 files changed, 7 insertions(+), 3 deletions(-)
diff --git a/src/player.html b/src/player.html
index 12559e1..71531e3 100644
--- a/src/player.html
+++ b/src/player.html
@@ -21,7 +21,9 @@
 		<!-- MAIN WIDGET SCRIPT -->
 		<script src="player.js"></script>
 	</head>
-	<body ng-app="SortItOutEngine" ng-controller="SortItOutEngineCtrl" ng-cloak ng-style="{'background-image': 'url(' + backgroundImage + ')'}">
+	<body id="app-body" ng-app="SortItOutEngine" ng-controller="SortItOutEngineCtrl" ng-cloak ng-style="{
+			'background-image': 'linear-gradient(rgba(0,0,0,0) 0%, rgba(0,0,0,0) 75%, rgba(0,0,0,0.33) 100%), url('+ backgroundImage + ')'
+		}">
 		<div id="content"
 			hm-panmove="panMove(standardizeEvent($event), false)"
 			hm-panend="mouseUp(standardizeEvent($event), false)"
@@ -175,7 +177,6 @@ <h1 id="title">{{title}}</h1>
 			</div>
 
 			<div id="dock-main" class="dock" tabindex="-1">
-				<div id="dock-main-background" class="dock" ng-click="hideFolderPreview()" tabindex="-1"></div>
 				<div class="folder"
 					ng-class="{opened: folderPreviewIndex == $index}"
 					ng-repeat="folder in folders"
diff --git a/src/player.scss b/src/player.scss
index d2be1a2..f0e73c0 100644
--- a/src/player.scss
+++ b/src/player.scss
@@ -7,6 +7,8 @@ body {
 	background-position: center center;
 	height: 100vh;
 	font-family: "Lato";
+
+	overflow: hidden;
 }
 
 .screenreader-assist {
@@ -283,7 +285,7 @@ button.cancel-submit-button {
 .dock {
 	position: absolute;
 	height: 125px;
-	bottom: 0;
+	bottom: -125px;
 	left: 0;
 	right: 0;
 	display: flex;
@@ -294,6 +296,7 @@ button.cancel-submit-button {
 	}
 
 	.folder {
+		top: -125px;
 		height: 100%;
 		width: 150px;
 		position: relative;
