Some style fixes

res/static/script/Toolbar.js

@@ -189,6 +189,10 @@ var DetailsWindow = {
 			this.detailsButton.classList.add("button_highlight")
 			this.visible = true;
 
+			// This is a workaround for a chrome bug which makes it so hidden
+			// windows can't be scrolled after they are shown
+			this.popupDiv.focus();
+
 			if (this.graph === 0) {
 				this.renderGraph();
 			}
@@ -301,6 +305,9 @@ var DetailsWindow = {
 								scaleLabel: {
 									display: true,
 									labelString: "Downloads"
+								},
+								gridLines: {
+									color: "rgba(100, 255, 100, .1)"
 								}
 							}, {
 								type: "linear",
@@ -312,7 +319,14 @@ var DetailsWindow = {
 									labelString: "Views"
 								},
 								gridLines: {
-									color: "rgba(0, 0, 0, 0)"
+									color: "rgba(128, 128, 255, .2)"
+								}
+							}
+						],
+						xAxes: [
+							{
+								gridLines: {
+									display: false
 								}
 							}
 						]

res/static/style/viewer.css

@@ -194,8 +194,10 @@ body{
 .popup {
 	position: fixed;
 	visibility: hidden;
+	display: flex;
+	flex-direction: column;
 	opacity: 0;
-	transition: visibility 1s, opacity 1s;
+	transition: visibility .5s, opacity .5s;
 	background-color: var(--body_color);
 	border-color: var(--accent_color_dark_border);
 	max-height: 100%;
@@ -207,13 +209,18 @@ body{
 	box-sizing: border-box;
 	text-align: left;
 	box-shadow: var(--shadow_color) 0px 0px 50px;
+	overflow: hidden;
 }
-.popup .highlight_light {
+.popup > .highlight_light {
 	font-size: 1.2em;
 }
+.popup > .content_area {
+	flex: 1;
+	overflow-y: scroll;
+	padding: 10px;
+}
 
 .details_popup{
-	overflow-y: scroll;
 	width: 1500px;
 	height: 800px;
 	z-index: 100;

res/template/account/file_manager.html

@@ -22,7 +22,6 @@
 			}
 			.file_manager > .nav_bar :first-child   {margin-left:  5px;}
 			.file_manager > .nav_bar :last-child    {margin-right: 5px;}
-			.file_manager > .nav_bar > button       {flex: 0;}
 			.file_manager > .nav_bar > .breadcrumbs {flex: 1; margin: 1px 10px; min-width: 100px;}
 			.file_manager > .status_bar             {text-align: left;}
 			.file_manager > .directory_area {

res/template/admin.html

@@ -20,7 +20,7 @@
 			<script src="/res/script/jquery.js"></script>
 			<script src="/res/misc/chartjs/Chart.min.js"></script>
 			<script>
-			$.get(apiEndpoint+"/admin/files/timeseries/10", function(response){
+			$.get(apiEndpoint+"/admin/files/timeseries/14", function(response){
 				console.log(response);
 				if (response.success) {
 					var ctx = document.getElementById('bandwidth_chart');
@@ -35,7 +35,7 @@
 								labels: response.labels,
 								datasets: [
 									{
-										label: "Downloads",
+										label: "Bandwidth",
 										backgroundColor: "rgba(100, 255, 100, .1)",
 										borderColor: "rgba(100, 255, 100, .8)",
 										borderWidth: 2,
@@ -44,7 +44,7 @@
 										data: response.downloads
 									}, {
 										label: "Views",
-										backgroundColor: "rgba(128, 128, 255, .1)",
+										backgroundColor: "rgba(128, 128, 255, .2)",
 										borderColor: "rgba(128, 128, 255, .8)",
 										borderWidth: 2,
 										fill: true,
@@ -71,6 +71,14 @@
 											scaleLabel: {
 												display: true,
 												labelString: "Bandwidth"
+											},
+											ticks: {
+												callback: function(value, index, values) {
+													return (value/1e9) + " GB";
+												}
+											},
+											gridLines: {
+												color: "rgba(100, 255, 100, .1)"
 											}
 										}, {
 											type: "linear",
@@ -82,7 +90,14 @@
 												labelString: "Views"
 											},
 											gridLines: {
-												color: "rgba(0, 0, 0, 0)"
+												color: "rgba(128, 128, 255, .2)"
+											}
+										}
+									],
+									xAxes: [
+										{
+											gridLines: {
+												display: false
 											}
 										}
 									]

res/template/file_viewer.html

@@ -112,6 +112,7 @@
 				File Info
 				<button style="position: absolute; top: 3px; right: 3px;" class="button_red" onclick="DetailsWindow.toggle();">X</button>
 			</div>
+			<div class="content_area">
 				<span id="info_file_details"></span>
 				<span id="info_about">
 					<h3>Downloads and views</h3>
@@ -153,6 +154,7 @@
 					<br/>
 				</span>
 			</div>
+		</div>
 		<div id="captcha_popup" class="popup captcha_popup border_bottom">
 			<div id="captcha_popup_title" class="highlight_light border_top border_bottom"></div>
 			<div id="captcha_popup_content"></div>