Basic proxy IP support.

Switched out a couple of <a>s in the Control Panel with <h1>s, we might want to use <h2> here instead.
Added graphs for Nox.
Tweaked header markup for Nox.
Added support for live topic list to Nox.
Added styling for stickies on Nox.
Fixed topic list text overflow on Nox.

common/routes_common.go

@@ -257,11 +257,24 @@ func preRoute(w http.ResponseWriter, r *http.Request) (User, bool) {
 	*usercpy = *user
 
 	// TODO: WIP. Refactor this to eliminate the unnecessary query
+	// TODO: Better take proxies into consideration
 	host, _, err := net.SplitHostPort(r.RemoteAddr)
 	if err != nil {
 		PreError("Bad IP", w, r)
 		return *usercpy, false
 	}
+
+	// TODO: Prefer Cf-Connecting-Ip header, fewer shenanigans
+	if Site.HasProxy {
+		// TODO: Check the right-most IP, might get tricky with multiple proxies, maybe have a setting for the number of hops we jump through
+		xForwardedFor := r.Header.Get("X-Forwarded-For")
+		if xForwardedFor != "" {
+			forwardedFor := strings.Split(xForwardedFor, ",")
+			// TODO: Check if this is a valid IP Address, reject if not
+			host = forwardedFor[len(forwardedFor)-1]
+		}
+	}
+
 	if user == &GuestUser {
 		usercpy.LastIP = host
 		return *usercpy, true

templates/panel_dashboard.html

@@ -3,7 +3,7 @@
 {{template "panel_menu.html" . }}
 	<main id="panel_dashboard_right" class="colstack_right">
 		<div class="colstack_item colstack_head">
-			<div class="rowitem"><a>{{lang "panel_dashboard_head"}}</a></div>
+			<div class="rowitem"><h1>{{lang "panel_dashboard_head"}}</h1></div>
 		</div>
 		<div id="panel_dashboard" class="colstack_grid">
 {{range .GridItems}}

templates/panel_debug.html

@@ -3,7 +3,7 @@
 {{template "panel_menu.html" . }}
 	<main id="panel_dashboard_right" class="colstack_right">
 		<div class="colstack_item colstack_head">
-			<div class="rowitem"><a>{{lang "panel_debug_head"}}</a></div>
+			<div class="rowitem"><h1>{{lang "panel_debug_head"}}</h1></div>
 		</div>
 		<div id="panel_debug" class="colstack_grid">
 			<div class="grid_item grid_stat"><span>{{lang "panel_debug_uptime_label"}}</span></div>

themes/nox/public/main.css

@@ -114,6 +114,8 @@ li a {
 	background-color: #444444;
 	display: flex;
 	padding: 12px;
+}
+.sidebar .rowblock:not(.topic_list):not(.rowhead):not(.opthead) .rowitem {
 	margin-left: 12px;
 }
 .colstack_right .colstack_item.the_form {
@@ -136,7 +138,7 @@ li a {
 	margin-bottom: 8px;
 }
 
-h1, h3 {
+h1, h2, h3, h4, h5 {
 	-webkit-margin-before: 0;
 	-webkit-margin-after: 0;
 	margin-block-start: 0;
@@ -150,14 +152,15 @@ h1, h3 {
 	display: none;
 }
 
-.rowhead, .opthead {
-	margin-left: 18px;
+.rowhead, .opthead, .colstack_head {
+	margin-left: 8px;
 	margin-bottom: 8px;
 }
-.rowhead h1, .opthead h1 {
+.rowhead h1, .opthead h1, .colstack_head h1 {
 	font-size: 23px;
 }
 .sidebar .rowhead {
+	margin-left: 18px;
 	margin-top: 4px;
 	margin-bottom: 8px;
 }
@@ -165,6 +168,23 @@ h1, h3 {
 	font-size: 20px;
 }
 
+h2 {
+	font-size: 18px;
+	margin-top: 12px;
+	margin-bottom: 8px;
+	margin-left: 8px;
+}
+
+.more_topic_block_initial {
+	display: none;
+}
+.more_topic_block_active {
+	display: block;
+}
+.hide_ajax_topic {
+	display: none !important;
+}
+
 .topic_row:not(:last-child) {
 	margin-bottom: 8px;
 }
@@ -176,15 +196,24 @@ h1, h3 {
 .topic_left, .topic_right, .topic_middle {
 	padding: 16px;
 	padding-bottom: 12px;
+	padding-top: 15px;
 	display: flex;
 	width: 33%;
 }
 .topic_middle {
-	padding-top: 15px;
+	line-height: 20px;
 }
 .topic_left {
 	margin-right: auto;
 }
+.topic_left.topic_sticky {
+	border-left: 3px solid gold;
+	border-radius: 3px;
+}
+.new_item .topic_left {
+	border-left: 3px solid rgb(215, 215, 215);
+	border-radius: 3px;
+}
 .topic_left img, .topic_right img {
 	border-radius: 24px;
 	height: 38px;
@@ -195,6 +224,12 @@ h1, h3 {
 .topic_inner_left {
 	display: flex;
 	flex-direction: column;
+	width: 92%;
+}
+.topic_inner_left .rowtopic {
+	white-space: nowrap;
+	text-overflow: ellipsis;
+    overflow: hidden;
 }
 .topic_inner_left .parent_forum {
 	display: none; /* Comment this until we figure out how to make it work */

themes/nox/public/panel.css

@@ -44,6 +44,13 @@
 	padding-bottom: 24px;
 	padding-left: 24px;
 }
+.colstack_right .colstack_head {
+	margin-bottom: 4px;
+}
+.colstack_right .colstack_head h1 {
+	font-size: 21px;
+	color: #BBBBBB;
+}
 .colstack_right .colstack_item.the_form {
 	background-color: #555555;
 }
@@ -97,4 +104,23 @@ button, .formbutton {
 #themeSelector select {
 	background: rgb(90,90,90);
     color: rgb(200,200,200);
-}
+}
+
+.colstack_graph_holder {
+	background-color: #555555;
+	border-radius: 3px;
+	padding: 16px;
+	padding-bottom: 0px;
+	padding-left: 0px;
+}
+.colstack_graph_holder .ct-label {
+	color: rgb(195,195,195);
+	font-size: 13px;
+	white-space: nowrap;
+}
+.colstack_graph_holder .ct-horizontal {
+	margin-top: 3px;
+}
+.colstack_graph_holder .ct-grid {
+	stroke: rgb(125,125,125);
+}

themes/shadow/public/main.css

@@ -971,6 +971,10 @@ input[type=checkbox]:checked + label.poll_option_label .sel {
 #panel_dashboard_right .colstack_head .rowitem {
 	padding: 10px;
 }
+#panel_dashboard_right .colstack_head .rowitem h1 {
+	font-size: 15px;
+	margin-left: auto;
+}
 
 #panel_dashboard_right .colstack_head a {
 	text-align: center;

themes/tempra-conflux/public/panel.css

@@ -9,6 +9,10 @@
 	margin-right: 8px;
 }
 
+#panel_dashboard_right .colstack_head {
+	display: none;
+}
+
 .edit_button:before {
 	content: "{{index .Phrases "panel_edit_button_text"}}";
 }