diff --git a/src/css/fa-icons.css b/src/css/fa-icons.css
index f1ee049..a45c7ff 100644
--- a/src/css/fa-icons.css
+++ b/src/css/fa-icons.css
@@ -3,10 +3,12 @@
background-color: transparent;
border: 0;
display: inline-flex;
- justify-content: flex-start;
+ justify-content: center;
margin: 0;
padding: 0.1em;
position: relative;
+ user-select: none;
+ -webkit-user-select: none;
}
.fa-icon > * {
pointer-events: none;
@@ -44,49 +46,61 @@
width: 1em;
}
.fa-icon > .fa-icon_cloud-download-alt,
-.fa-icon > .fa-icon_cloud-upload-alt {
- width: calc(1em * 640 / 512);
+.fa-icon > .fa-icon_cloud-upload-alt,
+.fa-icon > .fa-icon_eraser {
+ width: calc(1em * 1920 / 1792);
}
-.fa-icon > .fa-icon_exclamation-triangle,
-.fa-icon > .fa-icon_home,
+.fa-icon > .fa-icon_exclamation-triangle {
+ width: calc(1em * 1794 / 1792);
+ }
+.fa-icon > .fa-icon_list-alt,
+.fa-icon > .fa-icon_reply,
+.fa-icon > .fa-icon_reply-all,
+.fa-icon > .fa-icon_th {
+ width: calc(1em * 1792 / 1792);
+ }
+.fa-icon > .fa-icon_spinner {
+ width: calc(1em * 1728 / 1792);
+ }
+.fa-icon > .fa-icon_download,
.fa-icon > .fa-icon_puzzle-piece,
-.fa-icon > .fa-icon_reply-all {
- width: calc(1em * 576 / 512);
+.fa-icon > .fa-icon_search-minus,
+.fa-icon > .fa-icon_search-plus,
+.fa-icon > .fa-icon_unlink {
+ width: calc(1em * 1664 / 1792);
+ }
+.fa-icon > .fa-icon_home {
+ width: calc(1em * 1612 / 1792);
}
.fa-icon > .fa-icon_clock,
.fa-icon > .fa-icon_cog,
-.fa-icon > .fa-icon_download,
-.fa-icon > .fa-icon_eraser,
-.fa-icon > .fa-icon_filter,
.fa-icon > .fa-icon_info-circle,
-.fa-icon > .fa-icon_list-alt,
.fa-icon > .fa-icon_power-off,
.fa-icon > .fa-icon_question-circle,
-.fa-icon > .fa-icon_reply,
-.fa-icon > .fa-icon_search-minus,
-.fa-icon > .fa-icon_search-plus,
-.fa-icon > .fa-icon_spinner,
-.fa-icon > .fa-icon_sync-alt,
-.fa-icon > .fa-icon_th,
-.fa-icon > .fa-icon_th-list,
-.fa-icon > .fa-icon_unlink {
- width: calc(1em * 512 / 512);
+.fa-icon > .fa-icon_refresh {
+ width: calc(1em * 1536 / 1792);
+ }
+.fa-icon > .fa-icon_arrow-left {
+ width: calc(1em * 1472 / 1792);
+ }
+.fa-icon > .fa-icon_filter {
+ width: calc(1em * 1410 / 1792);
}
-.fa-icon > .fa-icon_arrow-left,
-.fa-icon > .fa-icon_arrow-right,
-.fa-icon > .fa-icon_lock,
.fa-icon > .fa-icon_plus,
-.fa-icon > .fa-icon_unlock,
-.fa-icon > .fa-icon_trash-alt {
- width: calc(1em * 448 / 512);
+.fa-icon > .fa-icon_trash-o {
+ width: calc(1em * 1408 / 1792);
}
.fa-icon > .fa-icon_times {
- width: calc(1em * 352 / 512);
+ width: calc(1em * 1188 / 1792);
+ }
+.fa-icon > .fa-icon_lock,
+.fa-icon > .fa-icon_unlock {
+ width: calc(1em * 1152 / 1792);
}
.fa-icon > .fa-icon_angle-up,
-.fa-icon > .fa-icon_angle-double-up {
- width: calc(1em * 320 / 512);
+.fa-icon > .fa-icon_double-angle-up {
+ width: calc(1em * 998 / 1792);
}
.fa-icon > .fa-icon_ellipsis-v {
- width: calc(1em * 192 / 512);
+ width: calc(1em * 384 / 1792);
}
diff --git a/src/css/logger-ui.css b/src/css/logger-ui.css
index 504fb9f..a28b3b1 100644
--- a/src/css/logger-ui.css
+++ b/src/css/logger-ui.css
@@ -116,7 +116,7 @@ input:focus {
width: 4.6em;
}
#content table > colgroup > col:nth-of-type(2) {
- width: 30%;
+ width: 25%;
}
#content table > colgroup > col:nth-of-type(3) {
width: 2.2em;
@@ -125,7 +125,7 @@ input:focus {
width: 5.4em;
}
#content table > colgroup > col:nth-of-type(5) {
- width: calc(100% - 4.6em - 30% - 2.2em - 5.4em - 1.8em);
+ width: calc(100% - 4.6em - 25% - 2.2em - 5.4em - 1.8em);
}
#content table > colgroup > col:nth-of-type(6) {
width: 1.8em;
@@ -185,11 +185,22 @@ body.compactView #content tr:not(.vExpanded) td {
#content table tr[data-tabid="-1"] td:nth-of-type(2):not([colspan]) {
position: relative;
}
-#content table tr[data-tabid="-1"] td:nth-of-type(2):not([colspan])::after {
- content: '\2B1A';
+#content table tr td:nth-of-type(3) {
+ position: relative;
+ }
+/* visual for tabless network requests */
+#content table tr[data-tabid="-1"] td:nth-of-type(3)::before {
+ border: 5px solid #bbb;
+ border-bottom: 0;
+ border-top: 0;
+ bottom: 0;
+ content: '\00a0';
+ left: 0;
position: absolute;
- left: 0.2em;
-}
+ right: 0;
+ top: 0;
+ width: calc(100% - 10px);
+ }
#content table tr.tab:not(.canMtx) {
opacity: 0.3;
}
diff --git a/src/css/user-rules.css b/src/css/user-rules.css
index 4bce53b..8ec0273 100644
--- a/src/css/user-rules.css
+++ b/src/css/user-rules.css
@@ -42,11 +42,9 @@ html {
fill: #888;
}
-body[dir="ltr"] #revertButton > span:nth-of-type(3),
-body[dir="rtl"] #revertButton > span:nth-of-type(2),
-body[dir="ltr"] #commitButton > span:nth-of-type(2),
+body[dir="ltr"] #revertButton > span:nth-of-type(2),
body[dir="rtl"] #commitButton > span:nth-of-type(1) {
- display: none;
+ transform: scale(-1, 1);
}
#revertButton,
#commitButton,
diff --git a/src/hosts-files.html b/src/hosts-files.html
index 8a623b7..b3aac5e 100644
--- a/src/hosts-files.html
+++ b/src/hosts-files.html
@@ -51,7 +51,7 @@
home
trash-alt
trash-o
info-circle
unlock
diff --git a/src/js/fa-icons.js b/src/js/fa-icons.js
index b39665a..2f8dfaf 100644
--- a/src/js/fa-icons.js
+++ b/src/js/fa-icons.js
@@ -23,24 +23,28 @@
/******************************************************************************/
-let faIconsInit = function(root) {
- let icons = (root || document).querySelectorAll('.fa-icon');
- for ( let icon of icons ) {
- if ( icon.childElementCount !== 0 ) { continue; }
- let name = icon.textContent;
- let svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+const faIconsInit = function(root) {
+ const icons = (root || document).querySelectorAll('.fa-icon');
+ for ( const icon of icons ) {
+ if (
+ icon.firstChild === null ||
+ icon.firstChild.nodeType !== 3
+ ) {
+ continue;
+ }
+ const name = icon.firstChild.nodeValue;
+ const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.classList.add('fa-icon_' + name);
- let use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
- let href = '/img/fontawesome/fontawesome-defs.svg#' + name;
+ const use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
+ const href = '/img/fontawesome/fontawesome-defs.svg#' + name;
use.setAttribute('href', href);
use.setAttribute('xlink:href', href);
svg.appendChild(use);
- icon.textContent = '';
- icon.appendChild(svg);
+ icon.replaceChild(svg, icon.firstChild);
if ( icon.classList.contains('fa-icon-badged') ) {
- let badge = document.createElement('span');
+ const badge = document.createElement('span');
badge.className = 'fa-icon-badge';
- icon.appendChild(badge);
+ icon.insertBefore(badge, icon.firstChild.nextSibling);
}
}
};
diff --git a/src/logger-ui.html b/src/logger-ui.html
index 27b6b19..1057a90 100644
--- a/src/logger-ui.html
+++ b/src/logger-ui.html
@@ -18,11 +18,11 @@