some style tweaks

res/static/res/script/compiled/home.js

@@ -17,13 +17,13 @@ var UploadProgressBar = /** @class */ (function () {
         this.uploadDiv.innerText = "Uploading... " + Math.round(progress * 1000) / 10 + "%\n" + this.file.name;
         this.uploadDiv.setAttribute('style', 'background: linear-gradient('
             + 'to right, '
-            + '#111 0%, '
+            + 'var(--file_background_color) 0%, '
             + 'var(--highlight_color) ' + ((progress * 100)) + '%, '
-            + '#111 ' + ((progress * 100) + 1) + '%)');
+            + 'var(--file_background_color) ' + ((progress * 100) + 1) + '%)');
     };
     UploadProgressBar.prototype.onFinished = function (id) {
         finishedUploads[this.queueNum] = id;
-        this.uploadDiv.setAttribute('style', 'background: #111');
+        this.uploadDiv.setAttribute('style', 'background: var(--file_background_color)');
         this.uploadDiv.setAttribute('href', '/u/' + id);
         this.uploadDiv.setAttribute("target", "_blank");
         this.uploadDivJQ.html('<img src="' + apiEndpoint + '/file/' + id + '/thumbnail" alt="' + this.file.name + '"/>'
@@ -31,7 +31,7 @@ var UploadProgressBar = /** @class */ (function () {
             + '<span style="color: var(--highlight_color);">' + window.location.hostname + '/u/' + id + '</span>');
     };
     UploadProgressBar.prototype.onFailure = function (response, error) {
-        this.uploadDiv.setAttribute('style', 'background: #821C40');
+        this.uploadDiv.setAttribute('style', 'background: var(--danger_color)');
         this.uploadDivJQ.html(this.file.name + '<br/>'
             + 'Upload failed after three tries!<br/>'
             + "Message: " + error);

res/static/res/script/history.js

@@ -58,5 +58,5 @@ function historyAddItem(json) {
 		+ ("00" + date.getDate()).slice(-2)
 		+ "</a>";
 
-	$("#uploadedFiles").append($(uploadItem).hide().fadeIn(400));
+	$("#uploadedFiles").append($(uploadItem).hide().fadeIn(2000));
 }

res/static/res/style/layout.css

@@ -207,13 +207,6 @@ pre{
 	overflow-x: hidden;
 	overflow-y: scroll;
 }
-.files_container{
-	position: relative;
-	width: 100%;
-	margin: 0;
-	height: auto;
-	display: inline-block;
-}
 
 .file_button, .file_button:hover{
 	position: relative;
@@ -224,7 +217,7 @@ pre{
 	margin: 6px;
 	padding: 0;
 	overflow: hidden;
-	box-shadow: 0px 0px 6px 2px var(--shadow_color);
+	box-shadow: 0px 0px 6px 2px var(--file_background_color);
 	background-color: var(--file_background_color);
 	color: var(--text_color);
 	word-break: break-all;

res/static/res/typescript/home/home.ts

@@ -33,15 +33,15 @@ class UploadProgressBar implements FileUpload {
 			'style',
 			'background: linear-gradient('
 				+'to right, '
-				+'#111 0%, '
+				+'var(--file_background_color) 0%, '
 				+'var(--highlight_color) '+ ((progress*100)) +'%, '
-				+'#111 '+ ((progress*100)+1) +'%)'
+				+'var(--file_background_color) '+ ((progress*100)+1) +'%)'
 		)
 	}
 	public onFinished(id: string){
 		finishedUploads[this.queueNum] = id
 
-		this.uploadDiv.setAttribute('style', 'background: #111')
+		this.uploadDiv.setAttribute('style', 'background: var(--file_background_color)')
 		this.uploadDiv.setAttribute('href', '/u/'+id)
 		this.uploadDiv.setAttribute("target", "_blank");
 		this.uploadDivJQ.html(
@@ -51,7 +51,7 @@ class UploadProgressBar implements FileUpload {
 		)
 	}
 	public onFailure(response: JQuery.Ajax.ErrorTextStatus, error: string) {
-		this.uploadDiv.setAttribute('style', 'background: #821C40')
+		this.uploadDiv.setAttribute('style', 'background: var(--danger_color)')
 		this.uploadDivJQ.html(
 			this.file.name+'<br/>'
 			+ 'Upload failed after three tries!<br/>'

res/template/history.html

@@ -16,7 +16,7 @@
 			This data is saved locally in your web browser and gets updated every time you upload a file through your current browser.
 			<br/><br/>
 
-			<div id="uploadedFiles" class="files_container"></div>
+			<div id="uploadedFiles" class="highlight_dark border_top border_bottom"></div>
 			{{template "footer"}}
 		</div>
 		<script src="/res/script/history.js"></script>

res/template/home.html

@@ -12,7 +12,7 @@
 		<br/>
 		<div id="body" class="body">
 			{{template "menu" .}}
-			<div class="highlight_middle border_bottom">
+			<div class="highlight_middle border_bottom" style="padding: 0;">
 				<input id="file_input_field" type="file" name="file" multiple="multiple"/>
 				<button id="select_file_button" class="big_button button_highlight">Upload Files</button>
 				<button id="text_button" class="big_button button_highlight" onClick="window.location.href = '/t/'">Upload Text</button><br/>
@@ -61,7 +61,7 @@
 				<br/>Please share responsibly.
 			</p>
 			<p>
-				For other questions you can reach me at 
+				For other questions you can reach me at
 				<a href="mailto:support@pixeldrain.com">support@pixeldrain.com</a>
 			</p>
 			<h2>Funding</h2>

webcontroller/style.go

@@ -188,7 +188,7 @@ var SolarizedDarkStyle = PixeldrainStyleSheet{
 	AccentColorMedium: HSL{192, .81, .14},
 	AccentColorLight:  HSL{192, .95, .17},
 
-	ShadowColor:     HSL{192, .87, .05},
+	ShadowColor:     HSL{192, .87, 0},
 	ShadowSpread:    50,
 	ShadowIntensity: 5,
 }