mirror of
https://github.com/gorhill/uMatrix.git
synced 2024-05-19 03:33:17 +12:00
convert popup panel icons (https://github.com/uBlockOrigin/uMatrix-issues/issues/68)
This commit is contained in:
parent
3ce484688a
commit
52246a5250
|
@ -30,34 +30,6 @@
|
|||
vertical-align: baseline;
|
||||
display: inline-block;
|
||||
}
|
||||
.fa-icon {
|
||||
align-self: center;
|
||||
background-color: transparent;
|
||||
border: border: 1px solid transparent;
|
||||
display: inline-block;
|
||||
height: 1.2em;
|
||||
overflow: visible;
|
||||
vertical-align: middle;
|
||||
width: 1.2em;
|
||||
}
|
||||
.fa-icon:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
.fa-icon.disabled {
|
||||
fill: #888;
|
||||
opacity: 0.4;
|
||||
stroke: #fff;
|
||||
pointer-events: none;
|
||||
}
|
||||
.fa-icon > .badge {
|
||||
font-family: sans-serif;
|
||||
font-size: 80%;
|
||||
pointer-events: none;
|
||||
transform: translate(100%, 110%);
|
||||
}
|
||||
.fa-icon.disabled > .badge {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 14px;
|
||||
|
|
72
src/css/fa-icons.css
Normal file
72
src/css/fa-icons.css
Normal file
|
@ -0,0 +1,72 @@
|
|||
.fa-icon {
|
||||
align-items: center;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
display: inline-flex;
|
||||
justify-content: flex-start;
|
||||
margin: 0;
|
||||
padding: 0.1em;
|
||||
position: relative;
|
||||
}
|
||||
.fa-icon:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
.fa-icon > * {
|
||||
pointer-events: none;
|
||||
}
|
||||
.fa-icon.disabled {
|
||||
color: #888;
|
||||
fill: #888;
|
||||
opacity: 0.25;
|
||||
stroke: #888;
|
||||
pointer-events: none;
|
||||
}
|
||||
.fa-icon > .fa-icon-badge,
|
||||
.fa-icon.disabled > .fa-icon-badge {
|
||||
display: none;
|
||||
}
|
||||
.fa-icon.fa-icon-badged > .fa-icon-badge {
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
border-radius: 3px;
|
||||
bottom: 1px;
|
||||
display: inline-block;
|
||||
font-family: sans-serif;
|
||||
font-size: 40%;
|
||||
position: absolute;
|
||||
right: 1px;
|
||||
}
|
||||
.fa-icon.disabled > .fa-icon-badge {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.fa-icon > svg {
|
||||
height: 1em;
|
||||
}
|
||||
.fa-icon_puzzle-piece,
|
||||
.fa-icon_reply-all {
|
||||
width: calc(1em * 576 / 512);
|
||||
}
|
||||
.fa-icon_download,
|
||||
.fa-icon_eraser,
|
||||
.fa-icon_filter,
|
||||
.fa-icon_list-alt,
|
||||
.fa-icon_power-off,
|
||||
.fa-icon_reply,
|
||||
.fa-icon_sync-alt,
|
||||
.fa-icon_th,
|
||||
.fa-icon_th-list {
|
||||
width: calc(1em * 512 / 512);
|
||||
}
|
||||
.fa-icon_lock {
|
||||
width: calc(1em * 448 / 512);
|
||||
}
|
||||
.fa-icon_times {
|
||||
width: calc(1em * 352 / 512);
|
||||
}
|
||||
.fa-icon_angle-up,
|
||||
.fa-icon_angle-double-up {
|
||||
width: calc(1em * 320 / 512);
|
||||
}
|
||||
.fa-icon_ellipsis-v {
|
||||
width: calc(1em * 192 / 512);
|
||||
}
|
|
@ -11,9 +11,8 @@ body {
|
|||
}
|
||||
.fa-icon {
|
||||
cursor: pointer;
|
||||
height: 1.5em;
|
||||
padding: 0.5em 1em;
|
||||
width: 1.5em;
|
||||
font-size: 150%;
|
||||
padding: 0.4em 0.6em;
|
||||
}
|
||||
#toolbar {
|
||||
background-color: white;
|
||||
|
@ -88,14 +87,15 @@ body.popupPanelOn #popupPanelContainer {
|
|||
display: none;
|
||||
}
|
||||
|
||||
#popupPanelButton > use {
|
||||
transform: scaleY(0.4);
|
||||
#popupPanelButton use {
|
||||
transform: scale(1, 0.4);
|
||||
}
|
||||
body.popupPanelOn #popupPanelButton > use {
|
||||
transform: scaleY(1);
|
||||
body.popupPanelOn #popupPanelButton use {
|
||||
transform: scale(1, 1);
|
||||
}
|
||||
body.compactView #compactViewToggler {
|
||||
transform: rotateZ(180deg);
|
||||
body.compactView #compactViewToggler use {
|
||||
transform: scale(1, -1);
|
||||
transform-origin: center;
|
||||
}
|
||||
#filterButton {
|
||||
opacity: 0.25;
|
||||
|
@ -254,15 +254,20 @@ body.compactView #content tr:not(.vExpanded) td {
|
|||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
margin-left: 0.5em;
|
||||
padding: 0.2em;
|
||||
}
|
||||
.ruleEditorToolbar .fa-icon {
|
||||
padding: 0.4em;
|
||||
}
|
||||
|
||||
.fa-icon.scopeRel {
|
||||
color: #24c;
|
||||
fill: #24c;
|
||||
}
|
||||
body[data-scope="*"] .fa-icon.scopeRel {
|
||||
color: #000;
|
||||
fill: #000;
|
||||
}
|
||||
|
||||
.ruleWidgets {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
@ -58,16 +58,6 @@ a {
|
|||
position: relative;
|
||||
text-align: center;
|
||||
}
|
||||
#gotoDashboard > span:last-of-type {
|
||||
opacity: 0.5;
|
||||
position: absolute;
|
||||
}
|
||||
body[dir="ltr"] #gotoDashboard > span:last-of-type {
|
||||
left: 3px;
|
||||
}
|
||||
body[dir="rtl"] #gotoDashboard > span:last-of-type {
|
||||
right: 3px;
|
||||
}
|
||||
|
||||
.paneHead {
|
||||
background-color: white;
|
||||
|
@ -107,6 +97,18 @@ body[dir="rtl"] #gotoDashboard > span:last-of-type {
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
.toolbar .fa-icon {
|
||||
cursor: pointer;
|
||||
font-size: 150%;
|
||||
padding: 0.3em 0.4em;
|
||||
}
|
||||
.toolbar .fa-icon.scopeRel {
|
||||
fill: #24c;
|
||||
}
|
||||
body[data-scope="*"] .toolbar .fa-icon.scopeRel {
|
||||
fill: #000;
|
||||
}
|
||||
|
||||
body .toolbar button {
|
||||
background-color: white;
|
||||
border: 0;
|
||||
|
@ -128,6 +130,7 @@ body .toolbar button.fa {
|
|||
}
|
||||
#mtxSwitch_matrix-off.switchTrue {
|
||||
color: #a00;
|
||||
fill: #a00;
|
||||
}
|
||||
|
||||
#mtxSwitches > li {
|
||||
|
@ -274,9 +277,11 @@ button.disabled > span.badge {
|
|||
}
|
||||
.recipe > div > span {
|
||||
color: #888;
|
||||
fill: #888;
|
||||
}
|
||||
.recipe > div > span:hover {
|
||||
color: #000;
|
||||
fill: #000;
|
||||
}
|
||||
.recipe .expander {
|
||||
display: inline-block;
|
||||
|
@ -300,14 +305,12 @@ button.disabled > span.badge {
|
|||
.recipe .committer {
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
font-size: 120%;
|
||||
padding: 0.4em;
|
||||
font-size: 100%;
|
||||
text-align: center;
|
||||
width: 1em;
|
||||
}
|
||||
.recipe.mustImport .importer,
|
||||
.recipe.mustCommit:not(.mustImport) .committer {
|
||||
display: inline;
|
||||
display: inline-block;
|
||||
}
|
||||
.recipe:hover {
|
||||
background-color: #eef;
|
||||
|
@ -588,38 +591,31 @@ body.colorblind .rw .matCell.t2 #blacklist:hover {
|
|||
background-color: transparent;
|
||||
}
|
||||
#domainOnly {
|
||||
margin: 0;
|
||||
border: 1px solid gray;
|
||||
border-radius: 3px;
|
||||
padding: 0 1px;
|
||||
position: absolute;
|
||||
font-size: 1.1em;
|
||||
left: 20%;
|
||||
bottom: -20%;
|
||||
display: none;
|
||||
color: black;
|
||||
align-items: center;
|
||||
background-color: white;
|
||||
opacity: 0.25;
|
||||
z-index: 10000;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 3px;
|
||||
bottom: -20%;
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
display: none;
|
||||
fill: black;
|
||||
font-size: 100%;
|
||||
left: 20%;
|
||||
margin: 0;
|
||||
opacity: 0.25;
|
||||
padding: 3px;
|
||||
position: absolute;
|
||||
z-index: 10000;
|
||||
}
|
||||
.matSection #domainOnly .fa:before {
|
||||
content: '\f106';
|
||||
}
|
||||
.matSection.collapsed #domainOnly .fa:before {
|
||||
content: '\f107';
|
||||
}
|
||||
.matSection.collapsible .matRow.l1 .matCell:nth-of-type(1):hover #domainOnly {
|
||||
display: block;
|
||||
}
|
||||
#matHead #domainOnly .fa:before {
|
||||
content: '\f106';
|
||||
}
|
||||
#matHead.collapsed #domainOnly .fa:before {
|
||||
content: '\f107';
|
||||
.matSection.collapsed #domainOnly,
|
||||
#matHead.collapsed #domainOnly {
|
||||
transform: rotate(0.5turn);
|
||||
transform-origin: center;
|
||||
}
|
||||
.matSection.collapsible .matRow.l1 .matCell:nth-of-type(1):hover #domainOnly,
|
||||
#matHead.collapsible .matRow .matCell:nth-of-type(1):hover #domainOnly {
|
||||
display: block;
|
||||
display: inline-flex;
|
||||
}
|
||||
#domainOnly:hover {
|
||||
opacity: 1;
|
||||
|
|
|
@ -4,13 +4,26 @@ License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL
|
|||
-->
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="display: none;">
|
||||
<defs>
|
||||
<symbol id="fa-icon_angle-double-down" viewBox="0 0 320 512"><path d="M143 256.3L7 120.3c-9.4-9.4-9.4-24.6 0-33.9l22.6-22.6c9.4-9.4 24.6-9.4 33.9 0l96.4 96.4 96.4-96.4c9.4-9.4 24.6-9.4 33.9 0L313 86.3c9.4 9.4 9.4 24.6 0 33.9l-136 136c-9.4 9.5-24.6 9.5-34 .1zm34 192l136-136c9.4-9.4 9.4-24.6 0-33.9l-22.6-22.6c-9.4-9.4-24.6-9.4-33.9 0L160 352.1l-96.4-96.4c-9.4-9.4-24.6-9.4-33.9 0L7 278.3c-9.4 9.4-9.4 24.6 0 33.9l136 136c9.4 9.5 24.6 9.5 34 .1z"/></symbol>
|
||||
<symbol id="fa-icon_angle-double-up" viewBox="0 0 320 512"><path d="M177 255.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 351.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 425.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1zm-34-192L7 199.7c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l96.4-96.4 96.4 96.4c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9l-136-136c-9.2-9.4-24.4-9.4-33.8 0z"/></symbol>
|
||||
<symbol id="fa-icon_eraser" viewBox="0 0 512 512"><path d="M497.941 273.941c18.745-18.745 18.745-49.137 0-67.882l-160-160c-18.745-18.745-49.136-18.746-67.883 0l-256 256c-18.745 18.745-18.745 49.137 0 67.882l96 96A48.004 48.004 0 0 0 144 480h356c6.627 0 12-5.373 12-12v-40c0-6.627-5.373-12-12-12H355.883l142.058-142.059zm-302.627-62.627l137.373 137.373L265.373 416H150.628l-80-80 124.686-124.686z"/></symbol>
|
||||
<symbol id="fa-icon_filter" viewBox="0 0 512 512"><path d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"/></symbol>
|
||||
<symbol id="fa-icon_lock" viewBox="0 0 448 512"><path d="M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z"/></symbol>
|
||||
<symbol id="fa-icon_sync-alt" viewBox="0 0 512 512"><path d="M370.72 133.28C339.458 104.008 298.888 87.962 255.848 88c-77.458.068-144.328 53.178-162.791 126.85-1.344 5.363-6.122 9.15-11.651 9.15H24.103c-7.498 0-13.194-6.807-11.807-14.176C33.933 94.924 134.813 8 256 8c66.448 0 126.791 26.136 171.315 68.685L463.03 40.97C478.149 25.851 504 36.559 504 57.941V192c0 13.255-10.745 24-24 24H345.941c-21.382 0-32.09-25.851-16.971-40.971l41.75-41.749zM32 296h134.059c21.382 0 32.09 25.851 16.971 40.971l-41.75 41.75c31.262 29.273 71.835 45.319 114.876 45.28 77.418-.07 144.315-53.144 162.787-126.849 1.344-5.363 6.122-9.15 11.651-9.15h57.304c7.498 0 13.194 6.807 11.807 14.176C478.067 417.076 377.187 504 256 504c-66.448 0-126.791-26.136-171.315-68.685L48.97 471.03C33.851 486.149 8 475.441 8 454.059V320c0-13.255 10.745-24 24-24z"/></symbol>
|
||||
<symbol id="fa-icon_th" viewBox="0 0 512 512"><path d="M149.333 56v80c0 13.255-10.745 24-24 24H24c-13.255 0-24-10.745-24-24V56c0-13.255 10.745-24 24-24h101.333c13.255 0 24 10.745 24 24zm181.334 240v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm32-240v80c0 13.255 10.745 24 24 24H488c13.255 0 24-10.745 24-24V56c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24zm-32 80V56c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm-205.334 56H24c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24zM0 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H24c-13.255 0-24 10.745-24 24zm386.667-56H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zm0 160H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zM181.333 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24z"/></symbol>
|
||||
<symbol id="fa-icon_times" viewBox="0 0 352 512"><path d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"/></symbol>
|
||||
<symbol id="angle-up" viewBox="0 0 320 512"><path d="M177 159.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 255.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 329.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1z"></path></symbol>
|
||||
<symbol id="angle-double-up" viewBox="0 0 320 512"><path d="M177 255.7l136 136c9.4 9.4 9.4 24.6 0 33.9l-22.6 22.6c-9.4 9.4-24.6 9.4-33.9 0L160 351.9l-96.4 96.4c-9.4 9.4-24.6 9.4-33.9 0L7 425.7c-9.4-9.4-9.4-24.6 0-33.9l136-136c9.4-9.5 24.6-9.5 34-.1zm-34-192L7 199.7c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l96.4-96.4 96.4 96.4c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9l-136-136c-9.2-9.4-24.4-9.4-33.8 0z"/></symbol>
|
||||
<symbol id="download" viewBox="0 0 512 512"><path d="M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"></path></symbol>
|
||||
<symbol id="ellipsis-v" viewBox="0 0 192 512"><path d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"/></symbol>
|
||||
<symbol id="eraser" viewBox="0 0 512 512"><path d="M497.941 273.941c18.745-18.745 18.745-49.137 0-67.882l-160-160c-18.745-18.745-49.136-18.746-67.883 0l-256 256c-18.745 18.745-18.745 49.137 0 67.882l96 96A48.004 48.004 0 0 0 144 480h356c6.627 0 12-5.373 12-12v-40c0-6.627-5.373-12-12-12H355.883l142.058-142.059zm-302.627-62.627l137.373 137.373L265.373 416H150.628l-80-80 124.686-124.686z"/></symbol>
|
||||
<symbol id="filter" viewBox="0 0 512 512"><path d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"/></symbol>
|
||||
<symbol id="list-alt" viewBox="0 0 512 512"><path d="M464 32H48C21.49 32 0 53.49 0 80v352c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48zm-6 400H54a6 6 0 0 1-6-6V86a6 6 0 0 1 6-6h404a6 6 0 0 1 6 6v340a6 6 0 0 1-6 6zm-42-92v24c0 6.627-5.373 12-12 12H204c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h200c6.627 0 12 5.373 12 12zm0-96v24c0 6.627-5.373 12-12 12H204c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h200c6.627 0 12 5.373 12 12zm0-96v24c0 6.627-5.373 12-12 12H204c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h200c6.627 0 12 5.373 12 12zm-252 12c0 19.882-16.118 36-36 36s-36-16.118-36-36 16.118-36 36-36 36 16.118 36 36zm0 96c0 19.882-16.118 36-36 36s-36-16.118-36-36 16.118-36 36-36 36 16.118 36 36zm0 96c0 19.882-16.118 36-36 36s-36-16.118-36-36 16.118-36 36-36 36 16.118 36 36z"/></symbol>
|
||||
<symbol id="lock" viewBox="0 0 448 512"><path d="M400 224h-24v-72C376 68.2 307.8 0 224 0S72 68.2 72 152v72H48c-26.5 0-48 21.5-48 48v192c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V272c0-26.5-21.5-48-48-48zm-104 0H152v-72c0-39.7 32.3-72 72-72s72 32.3 72 72v72z"/></symbol>
|
||||
<symbol id="power-off" viewBox="0 0 512 512"><path d="M400 54.1c63 45 104 118.6 104 201.9 0 136.8-110.8 247.7-247.5 248C120 504.3 8.2 393 8 256.4 7.9 173.1 48.9 99.3 111.8 54.2c11.7-8.3 28-4.8 35 7.7L162.6 90c5.9 10.5 3.1 23.8-6.6 31-41.5 30.8-68 79.6-68 134.9-.1 92.3 74.5 168.1 168 168.1 91.6 0 168.6-74.2 168-169.1-.3-51.8-24.7-101.8-68.1-134-9.7-7.2-12.4-20.5-6.5-30.9l15.8-28.1c7-12.4 23.2-16.1 34.8-7.8zM296 264V24c0-13.3-10.7-24-24-24h-32c-13.3 0-24 10.7-24 24v240c0 13.3 10.7 24 24 24h32c13.3 0 24-10.7 24-24z"/></symbol>
|
||||
<symbol id="puzzle-piece" viewBox="0 0 576 512"><path d="M519.442 288.651c-41.519 0-59.5 31.593-82.058 31.593C377.409 320.244 432 144 432 144s-196.288 80-196.288-3.297c0-35.827 36.288-46.25 36.288-85.985C272 19.216 243.885 0 210.539 0c-34.654 0-66.366 18.891-66.366 56.346 0 41.364 31.711 59.277 31.711 81.75C175.885 207.719 0 166.758 0 166.758v333.237s178.635 41.047 178.635-28.662c0-22.473-40-40.107-40-81.471 0-37.456 29.25-56.346 63.577-56.346 33.673 0 61.788 19.216 61.788 54.717 0 39.735-36.288 50.158-36.288 85.985 0 60.803 129.675 25.73 181.23 25.73 0 0-34.725-120.101 25.827-120.101 35.962 0 46.423 36.152 86.308 36.152C556.712 416 576 387.99 576 354.443c0-34.199-18.962-65.792-56.558-65.792z"/></symbol>
|
||||
<symbol id="reply" viewBox="0 0 512 512"><path d="M8.309 189.836L184.313 37.851C199.719 24.546 224 35.347 224 56.015v80.053c160.629 1.839 288 34.032 288 186.258 0 61.441-39.581 122.309-83.333 154.132-13.653 9.931-33.111-2.533-28.077-18.631 45.344-145.012-21.507-183.51-176.59-185.742V360c0 20.7-24.3 31.453-39.687 18.164l-176.004-152c-11.071-9.562-11.086-26.753 0-36.328z"/></symbol>
|
||||
<symbol id="reply-all" viewBox="0 0 576 512"><path d="M136.309 189.836L312.313 37.851C327.72 24.546 352 35.348 352 56.015v82.763c129.182 10.231 224 52.212 224 183.548 0 61.441-39.582 122.309-83.333 154.132-13.653 9.931-33.111-2.533-28.077-18.631 38.512-123.162-3.922-169.482-112.59-182.015v84.175c0 20.701-24.3 31.453-39.687 18.164L136.309 226.164c-11.071-9.561-11.086-26.753 0-36.328zm-128 36.328L184.313 378.15C199.7 391.439 224 380.687 224 359.986v-15.818l-108.606-93.785A55.96 55.96 0 0 1 96 207.998a55.953 55.953 0 0 1 19.393-42.38L224 71.832V56.015c0-20.667-24.28-31.469-39.687-18.164L8.309 189.836c-11.086 9.575-11.071 26.767 0 36.328z"/></symbol>
|
||||
<symbol id="sync-alt" viewBox="0 0 512 512"><path d="M370.72 133.28C339.458 104.008 298.888 87.962 255.848 88c-77.458.068-144.328 53.178-162.791 126.85-1.344 5.363-6.122 9.15-11.651 9.15H24.103c-7.498 0-13.194-6.807-11.807-14.176C33.933 94.924 134.813 8 256 8c66.448 0 126.791 26.136 171.315 68.685L463.03 40.97C478.149 25.851 504 36.559 504 57.941V192c0 13.255-10.745 24-24 24H345.941c-21.382 0-32.09-25.851-16.971-40.971l41.75-41.749zM32 296h134.059c21.382 0 32.09 25.851 16.971 40.971l-41.75 41.75c31.262 29.273 71.835 45.319 114.876 45.28 77.418-.07 144.315-53.144 162.787-126.849 1.344-5.363 6.122-9.15 11.651-9.15h57.304c7.498 0 13.194 6.807 11.807 14.176C478.067 417.076 377.187 504 256 504c-66.448 0-126.791-26.136-171.315-68.685L48.97 471.03C33.851 486.149 8 475.441 8 454.059V320c0-13.255 10.745-24 24-24z"/></symbol>
|
||||
<symbol id="th" viewBox="0 0 512 512"><path d="M149.333 56v80c0 13.255-10.745 24-24 24H24c-13.255 0-24-10.745-24-24V56c0-13.255 10.745-24 24-24h101.333c13.255 0 24 10.745 24 24zm181.334 240v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm32-240v80c0 13.255 10.745 24 24 24H488c13.255 0 24-10.745 24-24V56c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24zm-32 80V56c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.256 0 24.001-10.745 24.001-24zm-205.334 56H24c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24zM0 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H24c-13.255 0-24 10.745-24 24zm386.667-56H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zm0 160H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H386.667c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zM181.333 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24z"/></symbol>
|
||||
<symbol id="th-list" viewBox="0 0 512 512"><path d="M149.333 216v80c0 13.255-10.745 24-24 24H24c-13.255 0-24-10.745-24-24v-80c0-13.255 10.745-24 24-24h101.333c13.255 0 24 10.745 24 24zM0 376v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H24c-13.255 0-24 10.745-24 24zM125.333 32H24C10.745 32 0 42.745 0 56v80c0 13.255 10.745 24 24 24h101.333c13.255 0 24-10.745 24-24V56c0-13.255-10.745-24-24-24zm80 448H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24zm-24-424v80c0 13.255 10.745 24 24 24H488c13.255 0 24-10.745 24-24V56c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24zm24 264H488c13.255 0 24-10.745 24-24v-80c0-13.255-10.745-24-24-24H205.333c-13.255 0-24 10.745-24 24v80c0 13.255 10.745 24 24 24z"/></symbol>
|
||||
<symbol id="times" viewBox="0 0 352 512"><path d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"/></symbol>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<!--
|
||||
The above definitions were imported piecemeal from:
|
||||
fontawesome-free-5.3.1-web.zip/sprites
|
||||
-->
|
||||
|
|
Before Width: | Height: | Size: 4.8 KiB After Width: | Height: | Size: 9.4 KiB |
46
src/js/fa-icons.js
Normal file
46
src/js/fa-icons.js
Normal file
|
@ -0,0 +1,46 @@
|
|||
/*******************************************************************************
|
||||
|
||||
uMatrix - a browser extension to black/white list requests.
|
||||
Copyright (C) 2018-present Raymond Hill
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License
|
||||
along with this program. If not, see {http://www.gnu.org/licenses/}.
|
||||
|
||||
Home: https://github.com/gorhill/uMatrix
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
/******************************************************************************/
|
||||
|
||||
(function() {
|
||||
let icons = 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');
|
||||
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;
|
||||
use.setAttribute('href', href);
|
||||
use.setAttribute('xlink:href', href);
|
||||
svg.appendChild(use);
|
||||
icon.textContent = '';
|
||||
icon.appendChild(svg);
|
||||
if ( icon.classList.contains('fa-icon-badged') ) {
|
||||
let badge = document.createElement('span');
|
||||
badge.className = 'fa-icon-badge';
|
||||
icon.appendChild(badge);
|
||||
}
|
||||
}
|
||||
})();
|
|
@ -989,7 +989,7 @@ var ruleEditor = (function() {
|
|||
}
|
||||
let dirty = diffCount !== 0;
|
||||
ruleEditorNode
|
||||
.querySelector('#matrixPersistButton .badge')
|
||||
.querySelector('#matrixPersistButton .fa-icon-badge')
|
||||
.textContent = dirty ? diffCount : '';
|
||||
ruleEditorNode
|
||||
.querySelector('#matrixRevertButton')
|
||||
|
|
|
@ -1139,9 +1139,9 @@ function updateMatrixSwitches() {
|
|||
'relevant',
|
||||
matrixSnapshot.hasNoscriptTags
|
||||
);
|
||||
uDom.nodeFromSelector('#buttonMtxSwitches span.badge').textContent =
|
||||
uDom.nodeFromSelector('#buttonMtxSwitches .fa-icon-badge').textContent =
|
||||
count.toLocaleString();
|
||||
uDom.nodeFromSelector('#mtxSwitch_matrix-off span.badge').textContent =
|
||||
uDom.nodeFromSelector('#mtxSwitch_matrix-off .fa-icon-badge').textContent =
|
||||
matrixSnapshot.blockedCount.toLocaleString();
|
||||
document.body.classList.toggle('powerOff', switches['matrix-off']);
|
||||
}
|
||||
|
@ -1169,7 +1169,7 @@ function updatePersistButton() {
|
|||
.filter(function(){return this.nodeType===3;})
|
||||
.first()
|
||||
.text(diffCount > 0 ? '\uf13e' : '\uf023');
|
||||
button.descendants('span.badge').text(diffCount > 0 ? diffCount : '');
|
||||
button.descendants('.fa-icon-badge').text(diffCount > 0 ? diffCount : '');
|
||||
var disabled = diffCount === 0;
|
||||
button.toggleClass('disabled', disabled);
|
||||
uDom('#buttonRevertScope').toggleClass('disabled', disabled);
|
||||
|
@ -1307,7 +1307,7 @@ let recipeManager = (function() {
|
|||
return;
|
||||
}
|
||||
button.classList.remove('disabled');
|
||||
button.querySelector('span.badge').textContent = recipes.length;
|
||||
button.querySelector('.fa-icon-badge').textContent = recipes.length;
|
||||
};
|
||||
|
||||
let desHostnames = [];
|
||||
|
|
|
@ -3,10 +3,11 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" type="text/css" href="css/common.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/scope-selector.css">
|
||||
<link rel="stylesheet" type="text/css" href="css/logger-ui.css">
|
||||
<link rel="shortcut icon" type="image/png" href="img/icon_16.png">
|
||||
<link rel="stylesheet" href="css/common.css" type="text/css">
|
||||
<link rel="stylesheet" href="css/fa-icons.css" type="text/css">
|
||||
<link rel="stylesheet" href="css/scope-selector.css" type="text/css">
|
||||
<link rel="stylesheet" href="css/logger-ui.css" type="text/css">
|
||||
<link rel="shortcut icon" href="img/icon_16.png" type="image/png">
|
||||
<title data-i18n="loggerPageName"></title>
|
||||
</head>
|
||||
<body class="compactView f">
|
||||
|
@ -17,14 +18,14 @@
|
|||
<option value="" data-i18n="statsPageDetailedAllPages">
|
||||
<option value="-1" data-i18n="statsPageDetailedBehindTheScenePage">
|
||||
</select>
|
||||
<svg id="reloadTab" class="fa-icon disabled"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_sync-alt"></use></svg>
|
||||
<svg id="popupPanelButton" class="fa-icon disabled"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_th"></use></svg>
|
||||
<span id="reloadTab" class="fa-icon disabled">sync-alt</span>
|
||||
<span id="popupPanelButton" class="fa-icon disabled">th</span>
|
||||
</div>
|
||||
<div>
|
||||
<svg id="compactViewToggler" class="fa-icon"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_angle-double-up"></use></svg>
|
||||
<svg id="clean" class="fa-icon disabled"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_times"></use></svg>
|
||||
<svg id="clear" class="fa-icon disabled"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_eraser"></use></svg>
|
||||
<svg id="filterButton" class="fa-icon"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_filter"></use></svg>
|
||||
<span id="compactViewToggler" class="fa-icon">angle-double-up</span>
|
||||
<span id="clean" class="fa-icon disabled">times</span>
|
||||
<span id="clear" class="fa-icon disabled">eraser</span>
|
||||
<span id="filterButton" class="fa-icon">filter</span>
|
||||
<input id="filterInput" type="text" placeholder="loggerFilterInputPlaceholder">
|
||||
<input id="maxEntries" type="text" size="5" title="loggerMaxEntriesTip">
|
||||
</div>
|
||||
|
@ -49,14 +50,14 @@
|
|||
<span class="scope" id="specificScope"><span> </span></span><!--
|
||||
--><span class="scope" id="globalScope" data-scope="*" data-i18n-tip="matrixGlobalScopeTip"><span><span>∗</span></span></span>
|
||||
<div class="ruleEditorToolbar">
|
||||
<svg id="matrixReloadButton" class="fa-icon" tip-anchor-right data-i18n-tip="matrixReloadButton"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_sync-alt"></use></svg>
|
||||
<span id="matrixReloadButton" class="fa-icon tip-anchor-right" data-i18n-tip="matrixReloadButton">sync-alt</span>
|
||||
</div>
|
||||
</section>
|
||||
<section>
|
||||
<div class="ruleWidgets"></div>
|
||||
<div class="ruleEditorToolbar">
|
||||
<svg id="matrixRevertButton" class="fa-icon scopeRel" tip-anchor-right data-i18n-tip="matrixRevertButtonTip"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_eraser"></use></svg>
|
||||
<svg id="matrixPersistButton" class="fa-icon scopeRel" tip-anchor-right data-i18n-tip="matrixPersistButtonTip"><use xlink:href="/img/fontawesome/fontawesome-defs.svg#fa-icon_lock"></use><text class="badge"></text></svg>
|
||||
<span id="matrixRevertButton" class="fa-icon scopeRel tip-anchor-right" data-i18n-tip="matrixRevertButtonTip">reply</span>
|
||||
<span id="matrixPersistButton" class="fa-icon fa-icon-badged scopeRel tip-anchor-right" data-i18n-tip="matrixPersistButtonTip">lock</span>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
|
@ -70,6 +71,7 @@
|
|||
<div id="ruleActionPicker"><div class="allowRule"></div><div class="blockRule"></div></div>
|
||||
</div>
|
||||
|
||||
<script src="js/fa-icons.js"></script>
|
||||
<script src="lib/punycode.js"></script>
|
||||
<script src="lib/publicsuffixlist.js"></script>
|
||||
<script src="js/vapi-common.js"></script>
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="css/common.css" type="text/css">
|
||||
<link rel="stylesheet" href="css/fa-icons.css" type="text/css">
|
||||
<link rel="stylesheet" href="css/scope-selector.css" type="text/css">
|
||||
<link rel="stylesheet" href="css/popup.css" type="text/css">
|
||||
<title>uMatrix panel</title>
|
||||
|
@ -13,23 +14,23 @@
|
|||
<body>
|
||||
|
||||
<div class="paneHead">
|
||||
<a id="gotoDashboard" class="extensionURL" href="#" data-extension-url="dashboard.html" data-i18n-tip="matrixDashboardMenuEntry">uMatrix <span id="version"> </span><span class="fa"></span></a>
|
||||
<a id="gotoDashboard" class="extensionURL" href="#" data-extension-url="dashboard.html" data-i18n-tip="matrixDashboardMenuEntry">uMatrix <span id="version"> </span></a>
|
||||
<div id="toolbarContainer">
|
||||
<div class="toolbar">
|
||||
<span class="scope" id="specificScope"><span> </span></span><!--
|
||||
--><span class="scope" id="globalScope" data-scope="*" data-i18n-tip="matrixGlobalScopeTip"><span><span>∗</span></span></span>
|
||||
<button id="mtxSwitch_matrix-off" type="button" class="fa scopeRel tip-anchor-left" data-i18n-tip="matrixMtxButtonTip"><span class="badge"></span></button>
|
||||
<button id="buttonMtxSwitches" type="button" class="fa scopeRel" tabindex="-1" data-dropdown-menu="dropDownMenuSwitches"><span class="badge"></span></button>
|
||||
<button id="buttonRecipes" type="button" class="fa scopeRel tip-anchor-right" data-dropdown-menu="dropDownMenuRecipes"><span class="badge"></span></button>
|
||||
<button id="buttonPersist" type="button" class="fa scopeRel tip-anchor-left" data-i18n-tip="matrixPersistButtonTip"><span class="badge"></span></button>
|
||||
<button id="buttonRevertScope" type="button" class="fa scopeRel tip-anchor-left" tabindex="-1" data-i18n-tip="matrixRevertButtonTip"></button>
|
||||
<span id="mtxSwitch_matrix-off" class="fa-icon fa-icon-badged scopeRel tip-anchor-left" data-i18n-tip="matrixMtxButtonTip">power-off</span>
|
||||
<span id="buttonMtxSwitches" class="fa-icon fa-icon-badged scopeRel" tabindex="-1" data-dropdown-menu="dropDownMenuSwitches">ellipsis-v</span>
|
||||
<span id="buttonRecipes" class="fa-icon fa-icon-badged scopeRel tip-anchor-right" data-dropdown-menu="dropDownMenuRecipes">puzzle-piece</span>
|
||||
<span id="buttonPersist" class="fa-icon fa-icon-badged scopeRel tip-anchor-left" data-i18n-tip="matrixPersistButtonTip">lock</span>
|
||||
<span id="buttonRevertScope" class="fa-icon fa-icon-badged scopeRel tip-anchor-left" data-i18n-tip="matrixRevertButtonTip">reply</span>
|
||||
</div>
|
||||
<div class="toolbar">
|
||||
<button id="buttonReload" type="button" class="fa tip-anchor-left" data-i18n-tip="matrixReloadButton"></button>
|
||||
<span id="buttonReload" class="fa-icon tip-anchor-left" data-i18n-tip="matrixReloadButton">sync-alt</span>
|
||||
</div>
|
||||
<div class="toolbar">
|
||||
<button id="buttonRevertAll" class="fa tip-anchor-right" data-i18n-tip="matrixRevertAllEntry"></button>
|
||||
<button type="button" class="fa extensionURL tip-anchor-right" data-extension-url="logger-ui.html" data-i18n-tip="matrixLoggerMenuEntry"></button>
|
||||
<span id="buttonRevertAll" class="fa-icon tip-anchor-right" data-i18n-tip="matrixRevertAllEntry">reply-all</span>
|
||||
<span class="fa-icon extensionURL tip-anchor-right" data-extension-url="logger-ui.html" data-i18n-tip="matrixLoggerMenuEntry">list-alt</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="matHead" class="matrix collapsible">
|
||||
|
@ -95,7 +96,7 @@
|
|||
<div class="groupSeparator"></div>
|
||||
<div class="domainSeparator"></div>
|
||||
<div class="matRow"><div class="matCell"><b> </b> </div><div class="matCell"> </div><div class="matCell"> </div><div class="matCell"> </div><div class="matCell"> </div><div class="matCell"> </div><div class="matCell"> </div><div class="matCell"> </div><div class="matCell"> </div></div>
|
||||
<div id="cellHotspots"><div id="whitelist"></div><div id="blacklist"></div><div id="domainOnly"><span class="fa"></span></div></div>
|
||||
<div id="cellHotspots"><div id="whitelist"></div><div id="blacklist"></div><div id="domainOnly" class="fa-icon">angle-up</div></div>
|
||||
<!-- Use once min supported browser version allows for use of CSS variables
|
||||
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
|
||||
<symbol id="toggleButton" viewBox="0 0 152 96">
|
||||
|
@ -112,9 +113,10 @@
|
|||
</symbol>
|
||||
</svg>
|
||||
-->
|
||||
<li class="recipe"><div><span class="expander"></span><span class="name"></span><span class="fa importer" title="matrixRecipeImportTip"></span><span class="fa committer" title="matrixRecipeSaveTip"></span></div><div class="ruleset"></div></li>
|
||||
<li class="recipe"><div><span class="expander"></span><span class="name"></span><span class="fa-icon committer" title="matrixRecipeSaveTip">lock</span><span class="fa-icon importer" title="matrixRecipeImportTip">download</span></div><div class="ruleset"></div></li>
|
||||
</div>
|
||||
|
||||
<script src="js/fa-icons.js"></script>
|
||||
<script src="lib/punycode.js"></script>
|
||||
<script src="js/vapi-common.js"></script>
|
||||
<script src="js/vapi-client.js"></script>
|
||||
|
|
Loading…
Reference in a new issue