1 files changed, 46 insertions, 43 deletions

diff --git a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css
index 8c6f681105..db5304b430 100644
--- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css
+++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css
@@ -40,24 +40,6 @@
 	url("fonts/font.svg") format("svg");
 }
 
-::-webkit-scrollbar {
-	width: 10px;
-	height: 10px;
-	background: transparent;
-}
-
-::-webkit-scrollbar-thumb {
-	background: #9e9e9e;
-}
-
-::-webkit-scrollbar-thumb:hover {
-	background: #757575;
-}
-
-::-webkit-scrollbar-thumb:active {
-	background: #424242;
-}
-
 .table {
 	position: relative;
 	display: table;
@@ -270,7 +252,6 @@ code {
 	font-size-adjust: .35;
 	padding: 1px 3px;
 	color: #101010;
-	border: thin solid #999;
 	border-radius: 2px;
 	background: #ddd;
 }
@@ -550,18 +531,29 @@ header > .fill > .container > .status > * {
 }
 
 .main > .main-left > .nav > .slide > .menu::before {
-	font-weight: 900;
 	position: absolute;
+	top: 30%;
 	right: 17px;
-	content: "\2228";
-	transform: scale(1.3, .75);
+	width: 1rem;
+	height: 1rem;
+	content: "";
+	background-image: url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTAwMCAxMDAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAwIDEwMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGQ9Ik01MDAsNjI1LjJMNzUuMywyNTVMMTAsMzE0LjlMNTAwLDc0NWw0OTAtNDMwLjFMOTI0LjcsMjU1TDUwMCw2MjUuMnoiLz48L2c+PC9zdmc+);
+	background-repeat: no-repeat;
 }
 
 .main > .main-left > .nav > .slide > .menu.active::before {
-	content: "\2227";
+	transform: rotate(-180deg);
+}
+
+body[class*="node-"] > .main > .main-left > .nav > .slide > .menu::before {
+	transition: transform .1s ease-in-out;
 }
 
-.main > .main-left[style$="overflow: hidden;"] > .nav > .slide > .menu::before {
+body[class*="node-"] > .main > .main-left > .nav > .slide > .menu.active::before {
+	transition: transform .2s ease-in-out;
+}
+
+.main > .main-left[style*="overflow: hidden"] > .nav > .slide > .menu::before {
 	display: none;
 }
 
@@ -700,6 +692,8 @@ h5 {
 
 .cbi-section,
 .cbi-section-error,
+#iptables,
+.Firewall form,
 #cbi-network > .cbi-section-node,
 #cbi-wireless > .cbi-section-node,
 #cbi-wireless > #wifi_assoclist_table,
@@ -1779,10 +1773,12 @@ td > .ifacebadge,
 
 #syslog {
 	font-size: small;
+	overflow-y: hidden;
 	width: 100%;
 	min-height: 15rem;
 	margin-bottom: 20px;
 	padding: 1rem;
+	padding-bottom: 2.5rem;
 	resize: none;
 	color: #eee;
 	border: 0;
@@ -2287,16 +2283,12 @@ input[name="nslookup"] {
 
 /* firewall */
 #iptables {
-	font-family: inherit;
-	font-weight: normal;
-	font-style: normal;
-	line-height: 1;
-	min-width: inherit;
-	margin: 0 0 2rem 0;
-	padding: 2rem;
-	border: 0;
-	border-radius: 0;
-	background-color: #fff;
+	margin: 0;
+}
+
+.Firewall form {
+	padding: 0;
+	box-shadow: none;
 }
 
 #cbi-firewall-redirect table *,
@@ -2629,7 +2621,6 @@ input[name="nslookup"] {
 
 	.tr.placeholder > .td,
 	#cbi-firewall .tr > .td,
-	#iptables .tr:nth-child(2) > .td,
 	#cbi-network .tr:nth-child(2) > .td,
 	.cbi-section #wifi_assoclist_table .tr > .td {
 		border-top: 0;
@@ -2723,17 +2714,9 @@ input[name="nslookup"] {
 	}
 
 	.Firewall form {
-		font-family: inherit;
-		font-weight: normal;
-		font-style: normal;
-		line-height: normal;
 		position: static !important;
-		min-width: inherit;
 		margin: 0 0 2rem 0;
 		padding: 2rem;
-		border: 0;
-		border-radius: 0;
-		background-color: #fff;
 		box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 2px 0 rgba(0, 0, 0, .12);
 	}
 
@@ -2923,6 +2906,26 @@ input[name="nslookup"] {
 	}
 }
 
+@media screen and (min-width: 600px) {
+	::-webkit-scrollbar {
+		width: 10px;
+		height: 10px;
+		background: transparent;
+	}
+
+	::-webkit-scrollbar-thumb {
+		background: #9e9e9e;
+	}
+
+	::-webkit-scrollbar-thumb:hover {
+		background: #757575;
+	}
+
+	::-webkit-scrollbar-thumb:active {
+		background: #424242;
+	}
+}
+
 @media screen and (min-width: 1152px) {
 	.cbi-value input[type="password"],
 	.cbi-value input[type="text"] {