From 4312ed9181897cd3941febb8ce13cf4d748eec3b Mon Sep 17 00:00:00 2001
From: BNoiZe <roman@schmerold.at>
Date: Sat, 19 Oct 2013 09:02:12 +0200
Subject: [PATCH] Many small fixes and beautifications

---
 install/templates/assets/css/install.css      | 109 +++++++----
 install/templates/lngform.tpl                 |  22 ++-
 .../Sparkle/admin/admins/admins_admin.tpl     |  12 +-
 .../admin/customers/customers_customer.tpl    |  14 +-
 .../admin/settings/settings_overview.tpl      |  21 +-
 templates/Sparkle/assets/css/main.css         | 183 ++++++++----------
 templates/Sparkle/assets/img/logo_grey.png    | Bin 0 -> 3586 bytes
 templates/Sparkle/footer.tpl                  |   2 +-
 templates/Sparkle/misc/form/table_end.tpl     |  14 +-
 9 files changed, 197 insertions(+), 180 deletions(-)
 create mode 100644 templates/Sparkle/assets/img/logo_grey.png

diff --git a/install/templates/assets/css/install.css b/install/templates/assets/css/install.css
index a31b0c6b..bd23bfb7 100755
--- a/install/templates/assets/css/install.css
+++ b/install/templates/assets/css/install.css
@@ -131,9 +131,8 @@ p {
 
 .installsec label {
 	float:left;
-	width:26em;
-	margin-right:1em;
-	margin-top:6px;
+	margin-right:0;
+	margin-top:8px;
 	text-align:left;
 }
 
@@ -420,6 +419,7 @@ input {
 	height:22px;
 	border: 1px solid #d9d9d9;
 	margin-bottom: 5px;
+	border-radius: 3px;
 }
 
 textarea {
@@ -427,70 +427,73 @@ textarea {
 	padding:4px 4px 2px 24px;
 	border:1px solid #d9d9d9;
 	margin-bottom: 5px;
+	border-radius: 3px;
 }
 
 input[type="password"] {
 	background:#fff url(../img/password.png) no-repeat 5px 4px;
 }
 
+/*
+ *  BUTTONS
+ */
 input[type="button"],input[type="submit"],input[type="reset"] {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) );
-	background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5');
-	background-color:#79bbff;
-	-moz-border-radius:5px;
-	-webkit-border-radius:5px;
-	border-radius:5px;
-	display:inline-block;
-	color:#ffffff;
-	padding:2px 24px 2px 24px;
-	text-decoration:none;
-	text-shadow:1px 1px 0px #528ecc;
+	margin: 0 5px;
+	padding: 5px 14px;
+	outline: 0;
+	border: 0;
+	background-color: #eee;
+	min-width: 80px;
 	height: 26px;
-	margin: 0 3px 0 3px;
+	background-image: none;
+	border-width: 0px;
+}
+.loginsec input[type="button"], .loginsec input[type="submit"], .loginsec input[type="reset"] {
+	margin: 0 1px;
 }
 input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
-	background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
-	background-color:#378de5;
+    color: #333;
+    background-color: #dcdcdc;
+}
+input[type="button"]:active,input[type="submit"]:active,input[type="reset"]:active {
+    -webkit-box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.25);
+    -moz-box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.25);
+    box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.25);
+    color: white !important;
 }
-
 input[type="submit"],input[class="yesbutton"] {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) );
-	background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b');
-	background-color:#9dce2c;
-	text-shadow:1px 1px 0px #aade7c;
+    color: white;
+    background-color: #35aa47;
 }
 input[type="submit"]:hover,input[class="yesbutton"]:hover {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) );
-	background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c');
-	background-color:#8cb82b;
+	color: white;
+    background-color: #1d943b;
+}
+input[class="submit"]:active,input[class="yesbutton"]:active {
+	background-color: #35aa47;
 }
-
 input[class="nobutton"],input[type="reset"] {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
-	background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
-	background-color:#fe1a00;
-	text-shadow:1px 1px 0px #b23e35;
+    color: white;
+    background-color: #d84a38;
 }
 input[class="nobutton"]:hover,input[type="reset"]:hover {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
-	background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
-	background-color:#ce0100;
+	color: white;
+    background-color: #c53727;
 }
+input[class="nobutton"]:active,input[type="reset"]:active {
+    background-color: #dd4b39;
+}
+
 
 input[type="checkbox"] {
 	background:#dae7ee;
 	padding: 0;
-	margin: 0 20px 0 0;
+	margin: 0 5px 0 0;
+	vertical-align: middle;
+	height: 26px;
 }
 
-input[type="radio"] { /*the span element that immediately follow the radio button */
+input[type="radio"] {
 	margin: 0 10px 0 10px;
 	height:22px;
 }
@@ -500,6 +503,18 @@ select {
 	padding:4px;
 	border:1px solid #d9d9d9;
 	margin-bottom: 5px;
+	min-width: 100px;
+}
+select.dropdown {
+	padding: 2px 4px 2px 24px;
+	height: 26px;
+	border: 1px solid #d9d9d9;
+	margin-bottom: 5px;
+	border-radius: 3px;
+	background: url(../../../../templates/Sparkle/assets/img/icons/down.png) no-repeat 9px;
+	-webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
 }
 
 .maintable {
@@ -528,4 +543,14 @@ select {
 	display:block;
 	margin-bottom:.5em;
 	font-size:120%;
+}
+.installprogress {
+	width: 100%;
+	background-color:#e4e4e4;
+	height:5px;
+	border-bottom:1px solid #d1d5d8;
+}
+.installprogress .bar {
+	background-color: #35aa47;
+	height:5px;
 }
\ No newline at end of file
diff --git a/install/templates/lngform.tpl b/install/templates/lngform.tpl
index cd655c95..c1e52ceb 100755
--- a/install/templates/lngform.tpl
+++ b/install/templates/lngform.tpl
@@ -1,14 +1,20 @@
 		<form action="{$formaction}" method="get">
 			<fieldset>
 				<legend>{$this->_lng['install']['lngtitle']}</legend>
-				<p>
-					<label for="language">{$this->_lng['install']['language']}:</label>&nbsp;
-					<select name="language" id="language">
-						{$language_options}
-					</select>
-					<input type="hidden" name="check" value="1" />
-					<input type="submit" name="chooselang" value="{$this->_lng['install']['lngbtn_go']}" />
-				</p>
+				<table class="noborder">
+					<tr>
+						<td>
+							<label for="language">{$this->_lng['install']['language']}:</label>
+						</td>
+						<td align="right">
+							<select name="language" id="language" class="dropdown">
+								{$language_options}
+							</select>
+							<input type="hidden" name="check" value="1" />
+							<input type="submit" name="chooselang" value="{$this->_lng['install']['lngbtn_go']}" />
+						</td>
+					</tr>
+				</table>
 			</fieldset>
 		</form>
 		<hr class="line">
\ No newline at end of file
diff --git a/templates/Sparkle/admin/admins/admins_admin.tpl b/templates/Sparkle/admin/admins/admins_admin.tpl
index adbdc8cf..834de832 100644
--- a/templates/Sparkle/admin/admins/admins_admin.tpl
+++ b/templates/Sparkle/admin/admins/admins_admin.tpl
@@ -19,16 +19,16 @@
 				<span>Webspace:</span>
 				<if $row['diskspace'] != 'UL'>
 					<if (($row['diskspace']/100)*(int)$settings['system']['report_webmax']) < $row['diskspace_used']>
-						<div class="progress progress-danger progress-striped">
+						<div class="progress progress-danger">
 							<div class="bar" style="width: {$disk_percent}%"></div>
 						</div>
 					<else>
-						<div class="progress progress-striped">
+						<div class="progress">
 							<div class="bar" style="width: {$disk_percent}%"></div>
 						</div>
 					</if>
 				<else>
-					<div class="progress progress-striped">
+					<div class="progress">
 							<div class="bar" style="width: 0%"></div>
 					</div>
 				</if>
@@ -37,16 +37,16 @@
 				<span>Traffic:</span>
 				<if $row['traffic'] != 'UL'>
 					<if (($row['traffic']/100)*(int)$settings['system']['report_trafficmax']) < $row['traffic_used']>
-						<div class="progress progress-danger progress-striped">
+						<div class="progress progress-danger">
 							<div class="bar" style="width: {$traffic_percent}%"></div>
 						</div>
 					<else>
-						<div class="progress progress-striped">
+						<div class="progress">
 							<div class="bar" style="width: {$traffic_percent}%"></div>
 						</div>
 					</if>
 				<else>
-					<div class="progress progress-striped">
+					<div class="progress">
 						<div class="bar" style="width: 0%"></div>
 					</div>
 				</if>
diff --git a/templates/Sparkle/admin/customers/customers_customer.tpl b/templates/Sparkle/admin/customers/customers_customer.tpl
index 4c7cc4f4..aee1176b 100644
--- a/templates/Sparkle/admin/customers/customers_customer.tpl
+++ b/templates/Sparkle/admin/customers/customers_customer.tpl
@@ -26,17 +26,17 @@
 				<span>Webspace:</span>
 				<if $row['diskspace'] != 'UL'>
 					<if (($row['diskspace']/100)*(int)$settings['system']['report_webmax']) < $row['diskspace_used']>
-						<div class="progress progress-danger progress-striped">
+						<div class="progress progress-danger">
 							<div class="bar" style="width: {$disk_percent}%"></div>
 						</div>
 					<else>
-						<div class="progress progress-striped">
+						<div class="progress">
 							<div class="bar" style="width: {$disk_percent}%"></div>
 						</div>
 					</if>
 				<else>
-					<div class="progress progress-striped">
-							<div class="bar" style="width: 0%"></div>
+					<div class="progress">
+							<div class="bar" style="width: 0px"></div>
 					</div>
 				</if>
 			</span>
@@ -44,16 +44,16 @@
 				<span>Traffic:</span>
 				<if $row['traffic'] != 'UL'>
 					<if (($row['traffic']/100)*(int)$settings['system']['report_trafficmax']) < $row['traffic_used']>
-						<div class="progress progress-danger progress-striped">
+						<div class="progress progress-danger">
 							<div class="bar" style="width: {$traffic_percent}%"></div>
 						</div>
 					<else>
-						<div class="progress progress-striped">
+						<div class="progress">
 							<div class="bar" style="width: {$traffic_percent}%"></div>
 						</div>
 					</if>
 				<else>
-					<div class="progress progress-striped">
+					<div class="progress">
 						<div class="bar" style="width: 0%"></div>
 					</div>
 				</if>
diff --git a/templates/Sparkle/admin/settings/settings_overview.tpl b/templates/Sparkle/admin/settings/settings_overview.tpl
index 8a386960..2a5ce287 100644
--- a/templates/Sparkle/admin/settings/settings_overview.tpl
+++ b/templates/Sparkle/admin/settings/settings_overview.tpl
@@ -9,12 +9,23 @@
 		
 		<section class="fullform bradius">
         	<table class="formtable">
+			<thead>
+				<tr>
+					<th class="maintitle_apply_right" nowrap="nowrap" colspan="3" style="text-align: right !important;">
+						<input class="bottom" type="reset" value="{$lng['panel']['reset']}" /><input class="bottom" type="submit" value="{$lng['panel']['save']}" />
+					</th>
+				</tr>
+			</thead>
+			<tbody>
 			$fields
-			<tr>
-				<td class="maintitle_apply_right" nowrap="nowrap" colspan="2">
-					<input class="bottom" type="reset" value="{$lng['panel']['reset']}" /><input class="bottom" type="submit" value="{$lng['panel']['save']}" />
-				</td>
-			</tr>
+			</tbody>
+			<tfoot>
+				<tr>
+					<td class="maintitle_apply_right" nowrap="nowrap" colspan="3" style="text-align: right !important;">
+						<input class="bottom" type="reset" value="{$lng['panel']['reset']}" /><input class="bottom" type="submit" value="{$lng['panel']['save']}" />
+					</td>
+				</tr>
+			</tfoot>
 		</table>
 		</section>
 </article>
diff --git a/templates/Sparkle/assets/css/main.css b/templates/Sparkle/assets/css/main.css
index 8332a60d..9394de63 100644
--- a/templates/Sparkle/assets/css/main.css
+++ b/templates/Sparkle/assets/css/main.css
@@ -79,7 +79,7 @@ td a {
 }
 .topheader_navigation {
 	float: right;
-	margin: 15px 50px 0 0;
+	margin: 14px 50px 0 0;
 }
 
 /* TOPHEADER NAV */
@@ -106,6 +106,7 @@ ul.topheadernav li ul {
 	padding: 5px 10px;
 	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
 	margin-left: -10px;
+	border-radius: 3px;
 }
 ul.topheadernav li:hover ul {
 	display: block;
@@ -140,6 +141,10 @@ footer {
 footer a,footer a:active,footer a:visited {
 	color: #888;
 }
+footer img {
+	margin: 0 2px 3px 0;
+	height: 13px;
+}
 
 .login, .install {
 	background-color:#fff;
@@ -609,6 +614,7 @@ input {
 	height:22px;
 	border: 1px solid #d9d9d9;
 	margin-bottom: 5px;
+	border-radius: 3px;
 }
 
 textarea {
@@ -616,74 +622,89 @@ textarea {
 	padding:4px 4px 2px 24px;
 	border:1px solid #d9d9d9;
 	margin-bottom: 5px;
+	border-radius: 3px;
 }
 
 input[type="password"] {
 	background:#fff url(../img/icons/password.png) no-repeat 5px 4px;
 }
 
+/*
+ *  BUTTONS
+ */
 input[type="button"],input[type="submit"],input[type="reset"] {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) );
-	background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5');
-	background-color:#79bbff;
-	-moz-border-radius:5px;
-	-webkit-border-radius:5px;
-	border-radius:5px;
-	display:inline-block;
-	color:#ffffff;
-	padding:2px 24px 2px 24px;
-	text-decoration:none;
-	text-shadow:1px 1px 0px #528ecc;
+	margin: 0 5px;
+	padding: 5px 14px;
+	outline: 0;
+	border: 0;
+	background-color: #eee;
+	min-width: 80px;
 	height: 26px;
-	margin: 0 3px 0 3px;
+	background-image: none;
+	border-width: 0px;
+}
+.loginsec input[type="button"], .loginsec input[type="submit"], .loginsec input[type="reset"] {
+	margin: 0 1px;
 }
 input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
-	background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
-	background-color:#378de5;
+    color: #333;
+    background-color: #dcdcdc;
+}
+input[type="button"]:active,input[type="submit"]:active,input[type="reset"]:active {
+    -webkit-box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.25);
+    -moz-box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.25);
+    box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.25);
+    color: white !important;
 }
-
 input[type="submit"],input[class="yesbutton"] {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) );
-	background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b');
-	background-color:#9dce2c;
-	text-shadow:1px 1px 0px #aade7c;
+    color: white;
+    background-color: #35aa47;
 }
 input[type="submit"]:hover,input[class="yesbutton"]:hover {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) );
-	background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c');
-	background-color:#8cb82b;
+	color: white;
+    background-color: #1d943b;
+}
+input[class="submit"]:active,input[class="yesbutton"]:active {
+	background-color: #35aa47;
 }
-
 input[class="nobutton"],input[type="reset"] {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
-	background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
-	background-color:#fe1a00;
-	text-shadow:1px 1px 0px #b23e35;
+    color: white;
+    background-color: #d84a38;
 }
 input[class="nobutton"]:hover,input[type="reset"]:hover {
-	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
-	background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
-	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
-	background-color:#ce0100;
+	color: white;
+    background-color: #c53727;
+}
+input[class="nobutton"]:active,input[type="reset"]:active {
+    background-color: #dd4b39;
 }
 
 input[type="checkbox"] {
 	background:#dae7ee;
 	padding: 0;
 	margin: 0 5px 0 0;
+	vertical-align: middle;
+	height: 26px;
 }
 
 select {
-	background:#fff;
-	padding:4px;
-	border:1px solid #d9d9d9;
-	margin-bottom: 5px;
+	padding: 2px 4px 2px 24px;
+	height: 28px;
+	border: 1px solid #d9d9d9;
+	margin: 0 5px 5px 0 !important;
+	border-radius: 3px;
+	background: url(../img/icons/down.png) no-repeat 9px;
+	-webkit-appearance: none;
+    -moz-appearance: none;
+    appearance: none;
+    min-width: 170px;
+	text-indent: 0.01px;          /* Removes default arrow from firefox*/
+	text-overflow: "";
+}
+select[multiple="multiple"] {
+	height: auto;
+	background-image: none;
+	padding: 4px;
 }
 
 .customer_add {
@@ -732,10 +753,12 @@ select {
 	padding: 4px 0px 4px 8px;
 }
 
-.cronjobtask {
-	list-style:url(../img/icons/clock.png) inside;
-	margin:0;
-	padding:0;
+.cronjobtask li {
+	background-image: url(../img/icons/clock.png);
+	background-repeat: no-repeat;
+	background-position: 0px center; 
+	padding-left: 18px; 
+	height: 18px;
 }
 
 .overviewheading {
@@ -756,82 +779,32 @@ select {
 	margin:2px 0 2px 0;
 	overflow:hidden;
 	background-color:#f7f7f7;
-	background-image:-moz-linear-gradient(top,#f5f5f5,#f9f9f9);
-	background-image:-ms-linear-gradient(top,#f5f5f5,#f9f9f9);
-	background-image:-webkit-gradient(linear,0 0,0 100%,from(#f5f5f5),to(#f9f9f9));
-	background-image:-webkit-linear-gradient(top,#f5f5f5,#f9f9f9);
-	background-image:-o-linear-gradient(top,#f5f5f5,#f9f9f9);
-	background-image:linear-gradient(top,#f5f5f5,#f9f9f9);
-	background-repeat:repeat-x;
-	-webkit-border-radius:4px;
-	-moz-border-radius:4px;
-	border-radius:4px;
-	filter:progid:dximagetransform.microsoft.gradient(startColorstr='#f5f5f5',endColorstr='#f9f9f9',GradientType=0);
+	-webkit-border-radius:3px;
+	-moz-border-radius:3px;
+	border-radius:3px;
 	-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);
 	-moz-box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);
 	box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);
 }
 .progress .bar {
-	width:0;
+	width:1px;
 	height:18px;
 	font-size:12px;
 	color:#fff;
 	text-align:center;
 	text-shadow:0 -1px 0 rgba(0,0,0,0.25);
 	background-color:#0e90d2;
-	background-image:-moz-linear-gradient(top,#149bdf,#0480be);
-	background-image:-webkit-gradient(linear,0 0,0 100%,from(#149bdf),to(#0480be));
-	background-image:-webkit-linear-gradient(top,#149bdf,#0480be);
-	background-image:-o-linear-gradient(top,#149bdf,#0480be);
-	background-image:linear-gradient(top,#149bdf,#0480be);
-	background-image:-ms-linear-gradient(top,#149bdf,#0480be);
-	background-repeat:repeat-x;
-	filter:progid:dximagetransform.microsoft.gradient(startColorstr='#149bdf',endColorstr='#0480be',GradientType=0);
 	-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);
 	-moz-box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);
 	box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);
-	-webkit-box-sizing:border-box;
-	-moz-box-sizing:border-box;
-	-ms-box-sizing:border-box;
-	box-sizing:border-box;
-	-webkit-transition:width .6s ease;
-	-moz-transition:width .6s ease;
-	-ms-transition:width .6s ease;
-	-o-transition:width .6s ease;
-	transition:width .6s ease;
-}
-.progress-striped .bar {
-	background-color:#149bdf;
-	background-image:-o-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-webkit-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-moz-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-ms-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));
-	background-image:linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	-webkit-background-size:40px 40px;
-	-moz-background-size:40px 40px;
-	-o-background-size:40px 40px;
-	background-size:40px 40px;
+	-webkit-transition: width 6s ease;
+	-moz-transition: width 6s ease;
+	-ms-transition: width 6s ease;
+	-o-transition: width 6s ease;
+	transition: width 6s ease;
 }
 .progress-danger .bar {
 	background-color:#dd514c;
-	background-image:-moz-linear-gradient(top,#ee5f5b,#c43c35);
-	background-image:-ms-linear-gradient(top,#ee5f5b,#c43c35);
-	background-image:-webkit-gradient(linear,0 0,0 100%,from(#ee5f5b),to(#c43c35));
-	background-image:-webkit-linear-gradient(top,#ee5f5b,#c43c35);
-	background-image:-o-linear-gradient(top,#ee5f5b,#c43c35);
-	background-image:linear-gradient(top,#ee5f5b,#c43c35);
-	background-repeat:repeat-x;
-	filter:progid:dximagetransform.microsoft.gradient(startColorstr='#ee5f5b',endColorstr='#c43c35',GradientType=0);
-}
-.progress-danger.progress-striped .bar {
-	background-color:#ee5f5b;
-	background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));
-	background-image:-webkit-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-moz-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-ms-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:-o-linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
-	background-image:linear-gradient(-45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);
 }
 
 .maintable {
diff --git a/templates/Sparkle/assets/img/logo_grey.png b/templates/Sparkle/assets/img/logo_grey.png
new file mode 100644
index 0000000000000000000000000000000000000000..7c90090da56ac41fd7eadc9117e9fd3f9ebee9b6
GIT binary patch
literal 3586
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
IM6N<$f(FpR8vp<R

literal 0
HcmV?d00001

diff --git a/templates/Sparkle/footer.tpl b/templates/Sparkle/footer.tpl
index b42f5c28..5a6b6f70 100644
--- a/templates/Sparkle/footer.tpl
+++ b/templates/Sparkle/footer.tpl
@@ -2,7 +2,7 @@
 	</div>
 </if>
 <footer>
-	<span>Froxlor 
+	<span><img src="templates/{$theme}/assets/img/logo_grey.png" alt="Froxlor" /> 
 		<if ($settings['admin']['show_version_login'] == '1' && $filename == 'index.php') || ($filename != 'index.php' && $settings['admin']['show_version_footer'] == '1')>
 			{$version}{$branding}
 		</if>
diff --git a/templates/Sparkle/misc/form/table_end.tpl b/templates/Sparkle/misc/form/table_end.tpl
index 4056f237..003af593 100644
--- a/templates/Sparkle/misc/form/table_end.tpl
+++ b/templates/Sparkle/misc/form/table_end.tpl
@@ -1,6 +1,8 @@
-<tr>
-	<td colspan="2" style="text-align:right;">
-		<input type="reset" value="{$lng['panel']['reset']}" />
-		<input type="submit" value="{$lng['panel']['save']}" />
-	</td>
-</tr>
+<tfoot>
+	<tr>
+		<td colspan="2" style="text-align:right;">
+			<input type="reset" value="{$lng['panel']['reset']}" />
+			<input type="submit" value="{$lng['panel']['save']}" />
+		</td>
+	</tr>
+</tfoot>