luci-app-mwan3: add missing graphics boxes again

Add css boxes for mwan3 status again

Signed-off-by: Florian Eckert <fe@dev.tdt.de>

1 files changed, 21 insertions, 1 deletions

diff --git a/applications/luci-app-mwan3/luasrc/view/mwan/overview_status_interface.htm b/applications/luci-app-mwan3/luasrc/view/mwan/overview_status_interface.htm
index c941ad2b46..4ec0edf049 100644
--- a/applications/luci-app-mwan3/luasrc/view/mwan/overview_status_interface.htm
+++ b/applications/luci-app-mwan3/luasrc/view/mwan/overview_status_interface.htm
@@ -15,26 +15,35 @@ XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "status", "mwan", "interface_
 				for ( var iface in status.interfaces)
 				{
 					var state = '';
+					var css = ''
 					switch (status.interfaces[iface].status)
 					{
 						case 'online':
 							state = '<%:Online (tracking active)%>';
+							css = 'success';
 							break;
 						case 'offline':
 							state = '<%:Offline%>';
+							css = 'danger';
 							break;
 						default:
 							state = '<%:Disabled%>';
+							css = 'warning';
 							break;
 					}
 					statusview += String.format(
+						'<div class="alert-message %s">',
+						css
+					);
+					statusview += String.format(
 						'<div><strong>Interface: </strong>%s</div>',
 						iface
 					);
 					statusview += String.format(
-						'<div><strong>Status: </strong>%s</div></br></br>',
+						'<div><strong>Status: </strong>%s</div>',
 						state
 					);
+					statusview += '</div>'
 				}
 				statusDiv.innerHTML = statusview;
 			}
@@ -46,6 +55,17 @@ XHR.poll(5, '<%=luci.dispatcher.build_url("admin", "status", "mwan", "interface_
 	);
 //]]></script>
 
+<style type="text/css">
+	#mwan_status_text > div {
+		display: inline-block;
+		margin: 1rem;
+		padding: 1rem;
+		width: 10rem;
+		float: left;
+		line-height: 125%;
+	}
+</style>
+
 <fieldset id="interface_field" class="cbi-section">
 	<legend><%:MWAN Interfaces%></legend>
 	<div id="mwan_status_text">