diff --git a/src/webui/www/private/addpeers.html b/src/webui/www/private/addpeers.html
index 4a23ace3d..e0639a5f3 100644
--- a/src/webui/www/private/addpeers.html
+++ b/src/webui/www/private/addpeers.html
@@ -4,6 +4,7 @@
QBT_TR(Add Peers)QBT_TR[CONTEXT=PeersAdditionDialog]
+
diff --git a/src/webui/www/private/addtrackers.html b/src/webui/www/private/addtrackers.html
index 5bf5670cf..4618820dc 100644
--- a/src/webui/www/private/addtrackers.html
+++ b/src/webui/www/private/addtrackers.html
@@ -4,6 +4,7 @@
QBT_TR(Add trackers)QBT_TR[CONTEXT=TrackersAdditionDialog]
+
diff --git a/src/webui/www/private/confirmdeletion.html b/src/webui/www/private/confirmdeletion.html
index 6ce0174e8..12c5ce49e 100644
--- a/src/webui/www/private/confirmdeletion.html
+++ b/src/webui/www/private/confirmdeletion.html
@@ -4,6 +4,7 @@
QBT_TR(Remove torrent(s))QBT_TR[CONTEXT=confirmDeletionDlg]
+
diff --git a/src/webui/www/private/confirmfeeddeletion.html b/src/webui/www/private/confirmfeeddeletion.html
index dba355316..40661d155 100644
--- a/src/webui/www/private/confirmfeeddeletion.html
+++ b/src/webui/www/private/confirmfeeddeletion.html
@@ -4,6 +4,7 @@
QBT_TR(Deletion confirmation)QBT_TR[CONTEXT=RSSWidget]
+
diff --git a/src/webui/www/private/confirmruleclear.html b/src/webui/www/private/confirmruleclear.html
index 6ea5ce63e..98f326ba3 100644
--- a/src/webui/www/private/confirmruleclear.html
+++ b/src/webui/www/private/confirmruleclear.html
@@ -4,6 +4,7 @@
QBT_TR(Clear downloaded episodes)QBT_TR[CONTEXT=AutomatedRssDownloader]
+
diff --git a/src/webui/www/private/confirmruledeletion.html b/src/webui/www/private/confirmruledeletion.html
index 6418ff122..fc05af54c 100644
--- a/src/webui/www/private/confirmruledeletion.html
+++ b/src/webui/www/private/confirmruledeletion.html
@@ -4,6 +4,7 @@
QBT_TR(Rule deletion confirmation)QBT_TR[CONTEXT=AutomatedRssDownloader]
+
diff --git a/src/webui/www/private/css/Layout.css b/src/webui/www/private/css/Layout.css
index 1e30090d1..4e9cbe8a7 100644
--- a/src/webui/www/private/css/Layout.css
+++ b/src/webui/www/private/css/Layout.css
@@ -18,11 +18,6 @@ Required by:
/* Layout
---------------------------------------------------------------- */
-html,
-body {
- background: #fff;
-}
-
body {
margin: 0; /* Required */
}
@@ -36,12 +31,7 @@ body {
position: relative;
}
-#desktopHeader {
- background: #f2f2f2;
-}
-
#desktopTitlebarWrapper {
- background: #718ba6 url("../images/bg-header.gif") repeat-x;
height: 45px;
overflow: hidden;
position: relative;
@@ -55,7 +45,6 @@ body {
}
#desktopTitlebar h1.applicationTitle {
- color: #fff;
display: none;
font-size: 20px;
font-weight: bold;
@@ -65,7 +54,6 @@ body {
}
#desktopTitlebar h2.tagline {
- color: #d4dce4;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
@@ -75,12 +63,10 @@ body {
}
#desktopTitlebar h2.tagline .taglineEm {
- color: #fff;
font-weight: bold;
}
#topNav {
- color: #d4dce4;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
padding: 13px 10px 0 0;
@@ -91,7 +77,6 @@ body {
}
#topNav a {
- color: #fff;
font-weight: normal;
}
@@ -101,11 +86,12 @@ body {
/* Navbar */
+#Filters_pad {
+ padding: 0 1px!important;
+}
+
#desktopNavbar {
- background: #f2f2f2;
- /*background-color: #ccc;*/
- border-bottom: 1px solid #3f3f3f;
- height: 20px;
+ background-color: var(--color-background-default);
margin: 0 0px;
overflow: hidden; /* Remove this line if you want the menu to be backward compatible with Firefox 2 */
}
@@ -126,14 +112,14 @@ body {
}
#desktopNavbar ul li a {
- color: #333;
+ color: var(--color-text-default);
font-weight: normal;
- padding: 2px 10px 6px;
+ padding: 4px 10px;
}
#desktopNavbar ul li a:hover {
- background-color: #fff;
- color: #333;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
}
#desktopNavbar ul li a.arrow-right,
@@ -144,10 +130,9 @@ body {
}
#desktopNavbar li ul {
- background: #fff url("../images/bg-dropdown.gif") repeat-y;
- border: 1px solid #3f3f3f;
+ background-color: var(--color-background-default);
+ border: 1px solid var(--color-border-default);
left: -999em;
- margin-top: -6px;
position: absolute;
z-index: 8000;
}
@@ -165,7 +150,6 @@ body {
}
#desktopNavbar li ul li .check {
- background: #555;
font-size: 1px;
height: 5px;
left: 6px;
@@ -177,21 +161,16 @@ body {
}
#desktopNavbar li ul li a {
- color: #3f3f3f;
+ color: var(--color-text-default);
font-weight: normal;
min-width: 120px;
- padding: 1px 10px 1px 20px;
+ padding: 4px 10px 4px 25px;
position: relative;
}
#desktopNavbar li ul li a:hover {
- background: #6c98d9;
- border-radius: 2px;
- color: #fff;
-}
-
-#desktopNavbar li ul li a:hover .check {
- background: #fff;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
}
/* lists nested under hovered list items */
@@ -210,14 +189,14 @@ body {
}
li.divider {
- border-top: 1px solid #ebebeb;
+ border-top: 1px solid var(--color-border-default);
margin-top: 2px;
padding-top: 3px;
}
#pageWrapper {
- border-bottom: 1px solid #909090;
- border-top: 1px solid #909090;
+ border-bottom: 1px solid var(--color-border-default);
+ border-top: 1px solid var(--color-border-default);
overflow: hidden; /* This can be set to hidden or auto */
position: relative;
/*height: 100%;*/
@@ -235,7 +214,6 @@ li.divider {
}
#desktopFooter {
- background: #f2f2f2;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
height: 24px;
@@ -256,8 +234,7 @@ li.divider {
/* Panels */
.panel {
- background: #f8f8f8;
- border-bottom: 1px solid #b9b9b9;
+ border-bottom: 1px solid var(--color-border-default);
overflow: auto;
position: relative;
}
@@ -266,10 +243,6 @@ li.divider {
border-bottom: 0;
}
-.panelAlt {
- background: #f2f2f2;
-}
-
.bottomPanel {
border-bottom: 0;
}
@@ -278,14 +251,8 @@ li.divider {
padding: 8px;
}
-#mainPanel {
- background: #fff;
-}
-
.panel-header {
- background: #f1f1f1 url("../images/bg-panel-header.gif") repeat-x;
- border-bottom: 1px solid #d3d3d3;
- height: 30px;
+ border-bottom: 1px solid var(--color-border-default);
overflow: hidden;
position: relative;
}
@@ -294,13 +261,7 @@ li.divider {
padding-top: 2px;
}
-.panel-headerContent.tabs {
- background: url("../images/tabs.gif") repeat-x;
- background-position: left -68px;
-}
-
.panel-header h2 {
- color: #333;
display: inline-block;
font-size: 12px;
height: 22px;
@@ -326,7 +287,6 @@ li.divider {
/* Column and Panel Handles */
.horizontalHandle {
- background: #eee url("../images/bg-handle-horizontal.gif") repeat-x;
font-size: 1px;
height: 4px;
line-height: 1px;
@@ -348,8 +308,9 @@ li.divider {
}
.columnHandle {
- background: #c3c3c3 url("../images/handle-icon.gif") center center no-repeat;
- border: 1px solid #909090;
+ background: url("../images/handle-icon.gif") center center no-repeat;
+ /*border: 1px solid #909090;*/
+ border: 1px solid var(--color-border-default);
border-bottom: 0;
border-top: 0;
float: left;
diff --git a/src/webui/www/private/css/Tabs.css b/src/webui/www/private/css/Tabs.css
index 34f80748f..3572680c0 100644
--- a/src/webui/www/private/css/Tabs.css
+++ b/src/webui/www/private/css/Tabs.css
@@ -18,10 +18,7 @@ Required by:
/* Toolbar Tabs */
.toolbarTabs {
- background: url("../images/tabs.gif") repeat-x;
- background-position: left -70px;
overflow: visible;
- padding: 0 5px 2px 2px;
}
.tab-menu {
@@ -33,32 +30,23 @@ Required by:
}
.tab-menu li {
- background: url("../images/tabs.gif") repeat-x;
- background-position: left -35px;
cursor: pointer;
float: left;
- margin: 0 0 5px;
-}
-
-.tab-menu li.selected {
- background: url("../images/tabs.gif") repeat-x;
- background-position: left 0;
}
.tab-menu li a {
- background: url("../images/tabs.gif") repeat-x;
- background-position: right -35px;
- color: #181818;
+ background-color: var(--color-background-default);
+ border-radius: 5px 5px 0 0;
+ color: var(--color-text-default);
display: block;
font-weight: normal;
margin-left: 8px;
- padding: 6px 15px 5px 9px;
+ padding: 5px 16px;
text-align: center;
}
.tab-menu li.selected a {
- background: url("../images/tabs.gif") repeat-x;
- background-position: right 0;
- color: #181818;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
font-weight: bold;
}
diff --git a/src/webui/www/private/css/Window.css b/src/webui/www/private/css/Window.css
index d211dd980..1509b47cc 100644
--- a/src/webui/www/private/css/Window.css
+++ b/src/webui/www/private/css/Window.css
@@ -19,12 +19,15 @@ Required by:
---------------------------------------------------------------- */
.mocha {
- background-color: #e5e5e5;
+ background-color: var(--color-background-default);
display: none;
overflow: hidden;
}
.mochaOverlay {
+ background-color: var(--color-background-default);
+ border-radius: 5px;
+ height: auto!important; /* #19844 also fixes out of block issue */
left: 0;
position: absolute; /* This is also set in theme.js in order to make theme transitions smoother */
top: 0;
@@ -42,13 +45,13 @@ Required by:
*/
.mochaTitlebar {
- background: url("../images/spacer.gif?from=fafafa&to=e5e5e5");
+ background-color: var(--color-background-default);
+ border-radius: 5px;
overflow: hidden;
width: 100%;
}
.mochaTitlebar h3 {
- color: #888;
font-size: 12px;
font-weight: bold;
line-height: 15px;
@@ -56,14 +59,9 @@ Required by:
padding: 5px 10px 4px 12px;
}
-.mocha.isFocused .mochaTitlebar h3 {
- color: #181818;
-}
-
.mochaToolbarWrapper {
- background: #f1f1f1;
- border-top: 1px solid #d9d9d9;
- height: 29px;
+ background-color: var(--color-background-popup);
+ height: auto !important;
overflow: hidden;
position: relative;
width: 100%; /* For IE */
@@ -71,22 +69,24 @@ Required by:
div.mochaToolbarWrapper.bottom {
border: 0;
- border-bottom: 1px solid #d9d9d9;
+ border-bottom: 1px solid var(--color-border-default);
}
.mochaToolbar {
- border-top: 1px solid #fff;
+ border-top: 1px solid var(--color-border-default);
+ height: auto !important;
+ padding-top: 4px;
width: 100%; /* For IE */
}
.mochaContentBorder {
- border-bottom: 1px solid #dadada;
- border-top: 1px solid #dadada;
+ border-bottom: 1px solid var(--color-border-default);
+ border-top: 1px solid var(--color-border-default);
}
/* Has a fixed height and scrollbars if required. */
.mochaContentWrapper {
- background: #fff;
+ background-color: var(--color-background-popup);
font-size: 12px;
overflow: auto;
}
@@ -115,13 +115,12 @@ div.mochaToolbarWrapper.bottom {
/* Bottom right resize handle */
.mocha .cornerSE {
- background: #fefefe; /* This is the color of the visible resize handle */
+ background-color: var(--color-background-default);
height: 20px;
width: 20px;
}
.mochaCanvasHeader {
- background: transparent;
left: 0;
overflow: hidden;
position: absolute;
@@ -131,7 +130,6 @@ div.mochaToolbarWrapper.bottom {
}
.mochaControls {
- background: transparent;
height: 14px;
position: absolute;
right: 8px;
@@ -141,7 +139,6 @@ div.mochaToolbarWrapper.bottom {
}
.mochaCanvasControls {
- background: transparent;
position: absolute;
right: 8px;
top: 8px;
@@ -159,8 +156,8 @@ div.mochaToolbarWrapper.bottom {
.mochaMinimizeButton,
.mochaMaximizeButton,
.mochaCloseButton {
- background-color: #fff;
- color: #666;
+ background-color: var(--color-background-default);
+ color: var(--color-text-default);
cursor: pointer;
float: right;
font-size: 1px;
diff --git a/src/webui/www/private/css/dynamicTable.css b/src/webui/www/private/css/dynamicTable.css
index f54c35692..307d97a5f 100644
--- a/src/webui/www/private/css/dynamicTable.css
+++ b/src/webui/www/private/css/dynamicTable.css
@@ -5,27 +5,23 @@
**************************************************************/
-.dynamicTable tbody tr {
- background-color: #fff;
-}
-
.dynamicTable tbody tr:nth-child(even),
.dynamicTable tbody tr.alt {
- background-color: #eee;
+ background-color: var(--color-background-default);
}
#transferList .dynamicTable td {
- padding: 0 2px;
+ padding: 2px;
}
.dynamicTable tbody tr.selected {
- background-color: #354158;
- color: #fff;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
}
.dynamicTable tbody tr:hover {
- background-color: #ee6600;
- color: #fff;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
}
#transferList tr:hover {
@@ -50,22 +46,18 @@ tr.dynamicTableHeader {
}
.dynamicTable th {
- background-color: #eee;
- border-right: 1px solid #ccc;
+ border-right: 1px solid var(--color-border-default);
box-sizing: border-box;
padding: 4px;
white-space: nowrap;
}
.dynamicTable td {
- padding: 0px 4px;
+ border-bottom: 1px solid transparent;
+ padding: 0 4px;
white-space: nowrap;
}
-.dynamicTable thead tr {
- background-color: #eee;
-}
-
.dynamicTable th,
.dynamicTable td {
overflow: hidden;
diff --git a/src/webui/www/private/css/palette.css b/src/webui/www/private/css/palette.css
new file mode 100644
index 000000000..6d933505b
--- /dev/null
+++ b/src/webui/www/private/css/palette.css
@@ -0,0 +1,41 @@
+/* Adaptive color palette #19844 */
+
+/* Default rules */
+* {
+ --color-text-blue: hsl(210deg 100% 55%);
+ --color-text-orange: hsl(26deg 100% 45%);
+ --color-text-red: hsl(0deg 100% 65%);
+ --color-text-green: hsl(110deg 94% 27%);
+ --color-text-white: hsl(0deg 0% 100%);
+ --color-text-disabled: hsl(0deg 0% 60%);
+ --color-text-default: hsl(0deg 0% 33%);
+ --color-background-blue: hsl(210deg 42% 48%);
+ --color-background-popup: hsl(0deg 0% 100%);
+ --color-background-default: hsl(0deg 0% 94%);
+ --color-border-default: hsl(0deg 0% 85%);
+}
+
+:root {
+ color-scheme: light dark;
+}
+
+/* Light corrections */
+@media (prefers-color-scheme: light) {
+ :root {
+ color-scheme: light;
+ }
+}
+
+/* Dark corrections */
+@media (prefers-color-scheme: dark) {
+ :root {
+ color-scheme: dark;
+ }
+
+ * {
+ --color-text-default: hsl(0deg 0% 90%);
+ --color-background-popup: hsl(0deg 0% 20%);
+ --color-background-default: hsl(0deg 0% 30%);
+ --color-border-default: hsl(0deg 0% 33%);
+ }
+}
diff --git a/src/webui/www/private/css/style.css b/src/webui/www/private/css/style.css
index 7f7f201bd..59b2fbe5d 100644
--- a/src/webui/www/private/css/style.css
+++ b/src/webui/www/private/css/style.css
@@ -15,7 +15,7 @@ a img,
/* Structure */
body {
- color: #555;
+ color: var(--color-text-default);
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
@@ -36,7 +36,6 @@ body {
h2,
h3,
h4 {
- color: #333;
font-size: 12px;
font-weight: bold;
margin: 0;
@@ -44,13 +43,13 @@ h4 {
}
h2 {
- color: #555;
+ color: var(--color-text-default);
font-size: 14px;
font-weight: bold;
}
#mochaPage h3 {
- border-bottom: 1px solid #bbb;
+ border-bottom: 1px solid var(--color-border-default);
display: block;
font-size: 12px;
margin: 0 0 8px;
@@ -59,7 +58,7 @@ h2 {
#error_div,
#rename_error {
- color: #f00;
+ color: var(--color-text-red);
float: left;
font-size: 14px;
font-weight: bold;
@@ -70,7 +69,7 @@ h4 {
}
a {
- color: #e60;
+ color: var(--color-text-orange);
cursor: pointer;
text-decoration: none;
}
@@ -99,12 +98,19 @@ dd {
padding: 0 0 9px;
}
+/* Forms */
+
+fieldset {
+ border: 1px solid var(--color-border-default);
+ border-radius: 5px;
+}
+
/* Code */
pre {
- background-color: #f6f6f6;
- border: 1px solid #d1d7dc;
- color: #006600;
+ background-color: var(--color-background-default);
+ border: 1px solid var(--color-border-default);
+ color: var(--color-text-green);
display: block;
font-family: "Courier New", Courier, monospace;
font-size: 11px;
@@ -117,9 +123,9 @@ pre {
/* Dividers */
hr {
- background-color: #ddd;
+ background-color: var(--color-background-default);
border: 0px;
- color: #ccc;
+ color: var(--color-text-default);
height: 1px;
}
@@ -147,22 +153,22 @@ hr {
#Filters ul img {
height: 16px;
- padding: 2px 4px;
+ padding: 0 4px;
vertical-align: middle;
width: 16px;
}
.selectedFilter {
- background-color: #415a8d;
- color: #ffffff;
+ background-color: var(--color-background-blue)!important; /* important prevents hover effect on click, @TODO CSS optimization */
+ color: var(--color-text-white)!important;
}
.selectedFilter a {
- color: #ffffff;
+ color: var(--color-text-white)!important; /* @TODO original re-definition below */
}
#properties {
- background-color: #e5e5e5;
+ background-color: var(--color-background-default);
}
a.propButton {
@@ -184,15 +190,15 @@ a.propButton img {
/* context menu specific */
.contextMenu {
- background: #eee;
- border: 1px solid #999;
+ background-color: var(--color-background-default);
+ border: 1px solid var(--color-border-default);
display: none;
list-style-type: none;
padding: 0;
}
.contextMenu .separator {
- border-top: 1px solid #999;
+ border-top: 1px solid var(--color-border-default);
}
.contextMenu li {
@@ -201,7 +207,7 @@ a.propButton img {
}
.contextMenu li a {
- color: #000;
+ color: var(--color-text-default);
display: block;
font-family: tahoma, arial, sans-serif;
font-size: 12px;
@@ -211,21 +217,21 @@ a.propButton img {
}
.contextMenu li a:hover {
- background-color: #ddd;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
}
.contextMenu li a.disabled {
- color: #ccc;
font-style: italic;
}
.contextMenu li a.disabled:hover {
- background-color: #eee;
+ color: var(--color-text-disabled);
}
.contextMenu li ul {
- background: #eee;
- border: 1px solid #999;
+ background: var(--color-background-default);
+ border: 1px solid var(--color-border-default);
left: -999em;
list-style-type: none;
margin: -29px 0 0 100%;
@@ -259,6 +265,7 @@ a.propButton img {
.contextMenu li img {
height: 16px;
margin-bottom: -4px;
+ margin-right: 0.5em; /*#19844 return missed padding */
width: 16px;
}
@@ -328,7 +335,7 @@ a.propButton img {
/* Mocha Customization */
#mochaToolbar {
- height: 29px;
+ height: auto !important;
margin-top: 5px;
overflow-y: hidden;
position: relative;
@@ -354,17 +361,20 @@ a.propButton img {
}
#torrentsFilterToolbar {
- float: right;
- margin-right: 30px;
+ display: inline-block;
+ vertical-align: top;
}
#torrentsFilterInput {
+ background-color: var(--color-background-default);
background-image: url("../images/edit-find.svg");
background-position: left;
background-repeat: no-repeat;
background-size: 1.5em;
- padding-left: 2em;
- width: 160px;
+ border: 1px solid var(--color-border-default);
+ border-radius: 3px;
+ min-width: 160px;
+ padding: 4px 4px 4px 25px;
}
#torrentFilesFilterToolbar {
@@ -403,7 +413,7 @@ label.partial {
}
fieldset.settings {
- border: solid 1px black;
+ border: 1px solid var(--color-border-default);
border-radius: 8px;
padding: 4px 4px 4px 10px;
}
@@ -455,19 +465,16 @@ ul.filterList {
}
ul.filterList a {
- color: inherit;
+ color: var(--color-text-default);
display: block;
overflow: hidden;
+ padding: 4px 6px;
text-overflow: ellipsis;
white-space: nowrap;
}
ul.filterList li:hover {
- background-color: #e60;
-}
-
-ul.filterList li:hover a {
- color: white;
+ background-color: var(--color-background-default);
}
td.generalLabel {
@@ -532,7 +539,6 @@ td.generalLabel {
}
.select-watched-folder-editable {
- background-color: white;
border: solid grey 1px;
height: 20px;
position: relative;
@@ -623,27 +629,18 @@ td.statusBarSeparator {
}
.red {
- color: red;
+ color: var(--color-text-red);
}
.green {
- color: green;
+ color: var(--color-text-green);
}
.searchPluginsTableRow {
cursor: pointer;
}
-#torrentFilesTableDiv .dynamicTable tr.nonAlt {
- background-color: #fff;
-}
-
-#torrentFilesTableDiv .dynamicTable tr.nonAlt.selected {
- background-color: #354158;
- color: #fff;
-}
-
#torrentFilesTableDiv .dynamicTable tr.nonAlt:hover {
- background-color: #ee6600;
- color: #fff;
+ background-color: var(--color-background-blue);
+ color: var(--color-text-white);
}
diff --git a/src/webui/www/private/download.html b/src/webui/www/private/download.html
index 913a10001..e06554cc0 100644
--- a/src/webui/www/private/download.html
+++ b/src/webui/www/private/download.html
@@ -4,6 +4,7 @@
QBT_TR(Add Torrent Links)QBT_TR[CONTEXT=downloadFromURL]
+
diff --git a/src/webui/www/private/downloadlimit.html b/src/webui/www/private/downloadlimit.html
index fa49266dd..d60af2ac2 100644
--- a/src/webui/www/private/downloadlimit.html
+++ b/src/webui/www/private/downloadlimit.html
@@ -4,6 +4,7 @@
QBT_TR(Torrent Download Speed Limiting)QBT_TR[CONTEXT=TransferListWidget]
+
diff --git a/src/webui/www/private/edittracker.html b/src/webui/www/private/edittracker.html
index 17d2a92d2..51a68c982 100644
--- a/src/webui/www/private/edittracker.html
+++ b/src/webui/www/private/edittracker.html
@@ -4,6 +4,7 @@
QBT_TR(Tracker editing)QBT_TR[CONTEXT=TrackerListWidget]
+
diff --git a/src/webui/www/private/images/bg-dropdown.gif b/src/webui/www/private/images/bg-dropdown.gif
deleted file mode 100644
index b598f9dd0..000000000
Binary files a/src/webui/www/private/images/bg-dropdown.gif and /dev/null differ
diff --git a/src/webui/www/private/images/bg-handle-horizontal.gif b/src/webui/www/private/images/bg-handle-horizontal.gif
deleted file mode 100644
index 27fd405ba..000000000
Binary files a/src/webui/www/private/images/bg-handle-horizontal.gif and /dev/null differ
diff --git a/src/webui/www/private/images/bg-header.gif b/src/webui/www/private/images/bg-header.gif
deleted file mode 100644
index 6f44fb91f..000000000
Binary files a/src/webui/www/private/images/bg-header.gif and /dev/null differ
diff --git a/src/webui/www/private/images/bg-panel-header.gif b/src/webui/www/private/images/bg-panel-header.gif
deleted file mode 100644
index ea746f0d2..000000000
Binary files a/src/webui/www/private/images/bg-panel-header.gif and /dev/null differ
diff --git a/src/webui/www/private/images/tabs.gif b/src/webui/www/private/images/tabs.gif
deleted file mode 100644
index c8b5b0c64..000000000
Binary files a/src/webui/www/private/images/tabs.gif and /dev/null differ
diff --git a/src/webui/www/private/index.html b/src/webui/www/private/index.html
index 768ffac2f..09188c6c5 100644
--- a/src/webui/www/private/index.html
+++ b/src/webui/www/private/index.html
@@ -8,6 +8,7 @@
qBittorrent Web UI
+
diff --git a/src/webui/www/private/newcategory.html b/src/webui/www/private/newcategory.html
index 63186e013..b5c147a1e 100644
--- a/src/webui/www/private/newcategory.html
+++ b/src/webui/www/private/newcategory.html
@@ -4,6 +4,7 @@
QBT_TR(New Category)QBT_TR[CONTEXT=TransferListWidget]
+
diff --git a/src/webui/www/private/newfeed.html b/src/webui/www/private/newfeed.html
index 4f6204a9d..12fd3c9d5 100644
--- a/src/webui/www/private/newfeed.html
+++ b/src/webui/www/private/newfeed.html
@@ -4,6 +4,7 @@
QBT_TR(Please type a RSS feed URL)QBT_TR[CONTEXT=RSSWidget]
+
diff --git a/src/webui/www/private/newfolder.html b/src/webui/www/private/newfolder.html
index cc1259b8d..7d064241c 100644
--- a/src/webui/www/private/newfolder.html
+++ b/src/webui/www/private/newfolder.html
@@ -4,6 +4,7 @@
QBT_TR(Please choose a folder name)QBT_TR[CONTEXT=RSSWidget]
+
diff --git a/src/webui/www/private/newrule.html b/src/webui/www/private/newrule.html
index 99cb8ba78..5bf6dc764 100644
--- a/src/webui/www/private/newrule.html
+++ b/src/webui/www/private/newrule.html
@@ -4,6 +4,7 @@
QBT_TR(New rule name)QBT_TR[CONTEXT=AutomatedRssDownloader]
+
diff --git a/src/webui/www/private/newtag.html b/src/webui/www/private/newtag.html
index 16b779ce3..2ca8d7aa5 100644
--- a/src/webui/www/private/newtag.html
+++ b/src/webui/www/private/newtag.html
@@ -4,6 +4,7 @@
QBT_TR(Add Tags)QBT_TR[CONTEXT=TransferListWidget]
+
diff --git a/src/webui/www/private/rename.html b/src/webui/www/private/rename.html
index 1284812db..0afa7a665 100644
--- a/src/webui/www/private/rename.html
+++ b/src/webui/www/private/rename.html
@@ -4,6 +4,7 @@
QBT_TR(Rename)QBT_TR[CONTEXT=TransferListWidget]
+
diff --git a/src/webui/www/private/rename_feed.html b/src/webui/www/private/rename_feed.html
index 141e1a01f..898310994 100644
--- a/src/webui/www/private/rename_feed.html
+++ b/src/webui/www/private/rename_feed.html
@@ -4,6 +4,7 @@
QBT_TR(Please choose a new name for this RSS feed)QBT_TR[CONTEXT=RSSWidget]
+
diff --git a/src/webui/www/private/rename_file.html b/src/webui/www/private/rename_file.html
index 49cdbada8..3bd671d59 100644
--- a/src/webui/www/private/rename_file.html
+++ b/src/webui/www/private/rename_file.html
@@ -4,6 +4,7 @@
QBT_TR(Renaming)QBT_TR[CONTEXT=TorrentContentTreeView]
+
diff --git a/src/webui/www/private/rename_files.html b/src/webui/www/private/rename_files.html
index 01ede024c..276d7c302 100644
--- a/src/webui/www/private/rename_files.html
+++ b/src/webui/www/private/rename_files.html
@@ -4,6 +4,7 @@
QBT_TR(Renaming)QBT_TR[CONTEXT=TorrentContentTreeView]
+
diff --git a/src/webui/www/private/rename_rule.html b/src/webui/www/private/rename_rule.html
index cbc252c3c..8158e7746 100644
--- a/src/webui/www/private/rename_rule.html
+++ b/src/webui/www/private/rename_rule.html
@@ -4,6 +4,7 @@
QBT_TR(Rule renaming)QBT_TR[CONTEXT=AutomatedRssDownloader]
+
diff --git a/src/webui/www/private/setlocation.html b/src/webui/www/private/setlocation.html
index 36a2ee815..a23e80c7c 100644
--- a/src/webui/www/private/setlocation.html
+++ b/src/webui/www/private/setlocation.html
@@ -4,6 +4,7 @@
QBT_TR(Set location)QBT_TR[CONTEXT=HttpServer]
+
diff --git a/src/webui/www/private/shareratio.html b/src/webui/www/private/shareratio.html
index 897f0cb01..a6685411b 100644
--- a/src/webui/www/private/shareratio.html
+++ b/src/webui/www/private/shareratio.html
@@ -4,6 +4,7 @@
QBT_TR(Torrent Upload/Download Ratio Limiting)QBT_TR[CONTEXT=UpDownRatioDialog]
+
diff --git a/src/webui/www/private/upload.html b/src/webui/www/private/upload.html
index b2e2b018c..2fb0d02b6 100644
--- a/src/webui/www/private/upload.html
+++ b/src/webui/www/private/upload.html
@@ -4,6 +4,7 @@
QBT_TR(Upload local torrent)QBT_TR[CONTEXT=HttpServer]
+
diff --git a/src/webui/www/private/uploadlimit.html b/src/webui/www/private/uploadlimit.html
index e6cb93ef6..da073af0e 100644
--- a/src/webui/www/private/uploadlimit.html
+++ b/src/webui/www/private/uploadlimit.html
@@ -4,6 +4,7 @@
QBT_TR(Torrent Upload Speed Limiting)QBT_TR[CONTEXT=TransferListWidget]
+
diff --git a/src/webui/www/private/views/search.html b/src/webui/www/private/views/search.html
index fbae44ae8..ac90301dd 100644
--- a/src/webui/www/private/views/search.html
+++ b/src/webui/www/private/views/search.html
@@ -1,12 +1,13 @@