mirror of
https://github.com/gorhill/uMatrix.git
synced 2024-06-17 17:55:00 +12:00
re-worked popup UI to access dashboard from title bar (like uBlock)
This commit is contained in:
parent
ef68842b80
commit
fd4a7579f1
|
@ -13,15 +13,18 @@ body {
|
|||
*:focus {
|
||||
outline: none;
|
||||
}
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.paneHead {
|
||||
background-color: white;
|
||||
left:0;
|
||||
padding: 0;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
height: 5.5em;
|
||||
left:0;
|
||||
right: 0;
|
||||
background-color: white;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
.paneContent {
|
||||
|
@ -29,16 +32,35 @@ body {
|
|||
}
|
||||
|
||||
|
||||
.toolbar {
|
||||
margin: 0;
|
||||
.paneHead > a:first-child {
|
||||
background-color: #444;
|
||||
border: 0;
|
||||
border-bottom: 1px solid white;
|
||||
color: #bbb;
|
||||
cursor: pointer;
|
||||
display: block;
|
||||
font-family: sans-serif;
|
||||
line-height: 12px;
|
||||
margin: 0;
|
||||
padding: 02px 0;
|
||||
text-align: center;
|
||||
}
|
||||
#version {
|
||||
font-size: 10px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.toolbar {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
padding-bottom: 0.25em;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
vertical-align: top;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.toolbar.alignRight {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
body[dir="ltr"] .toolbar.alignLeft,
|
||||
|
@ -108,22 +130,6 @@ body[dir="rtl"] #mtxSwitches > li:before {
|
|||
content: '\f205';
|
||||
}
|
||||
|
||||
#extras + .dropdown-menu .dropdown-menu-entry:before {
|
||||
font: 110% FontAwesome;
|
||||
}
|
||||
body[dir="ltr"] #extras + .dropdown-menu .dropdown-menu-entry:before {
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
body[dir="rtl"] #extras + .dropdown-menu .dropdown-menu-entry:before {
|
||||
padding-left: 0.5em;
|
||||
}
|
||||
#buttonRevertAll:before {
|
||||
content: '\f122';
|
||||
}
|
||||
[data-i18n="matrixDashboardMenuEntry"]:before {
|
||||
content: '\f085';
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
margin: 0;
|
||||
border: 0;
|
||||
|
@ -306,17 +312,13 @@ body.tScopeSite #scopeCell {
|
|||
padding: 6px 1px 3px 1px;
|
||||
display: inline-block;
|
||||
box-sizing: content-box;
|
||||
width: 2.4em;
|
||||
width: 2.6em;
|
||||
white-space: nowrap;
|
||||
text-align: center;
|
||||
line-height: 110%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.paneHead #matHead {
|
||||
position: absolute;
|
||||
bottom: 3px;
|
||||
}
|
||||
.paneHead .matCell:nth-child(2) {
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
|
|
@ -141,6 +141,7 @@ RowSnapshot.counts = (function() {
|
|||
var matrixSnapshot = function(pageStore, details) {
|
||||
var µmuser = µm.userSettings;
|
||||
var r = {
|
||||
appVersion: vAPI.app.version,
|
||||
blockedCount: pageStore.requestStats.blocked.all,
|
||||
diff: [],
|
||||
domain: pageStore.pageDomain,
|
||||
|
|
|
@ -951,6 +951,13 @@ var makeMenu = function() {
|
|||
|
||||
renderMatrixHeaderRow();
|
||||
|
||||
// Manually adjust the position of the main matrix according to the height
|
||||
// of the toolbar/matrix header.
|
||||
document.querySelector('.paneContent').style.setProperty(
|
||||
'padding-top',
|
||||
document.querySelector('.paneHead').clientHeight + 'px'
|
||||
);
|
||||
|
||||
startMatrixUpdate();
|
||||
makeMatrixGroup0(groupStats[0]);
|
||||
makeMatrixGroup1(groupStats[1]);
|
||||
|
@ -970,6 +977,7 @@ var makeMenu = function() {
|
|||
function initMenuEnvironment() {
|
||||
uDom('body').css('font-size', getUserSetting('displayTextSize'));
|
||||
uDom('body').toggleClass('colorblind', getUserSetting('colorBlindFriendly') === true);
|
||||
uDom('#version').text(matrixSnapshot.appVersion || '');
|
||||
|
||||
var prettyNames = matrixHeaderPrettyNames;
|
||||
var keys = Object.keys(prettyNames);
|
||||
|
|
|
@ -18,6 +18,7 @@
|
|||
</div>
|
||||
|
||||
<div class="paneHead">
|
||||
<a class="extensionURL" href="#" data-extension-url="dashboard.html" title="popupTipDashboard">uMatrix <span id="version"> </span></a>
|
||||
<div id="toolbarLeft" class="toolbar alignLeft">
|
||||
<button id="scopeCell" class="dropdown-menu-button" tabindex="-1"></button>
|
||||
<div class="dropdown-menu">
|
||||
|
@ -46,17 +47,9 @@
|
|||
<button id="buttonReload" type="button" class="fa tip-anchor-left" data-i18n-tip="matrixReloadButton"></button>
|
||||
</div>
|
||||
|
||||
<!-- Yandex: float works correctly only if it is the first child -->
|
||||
<div class="toolbar alignRight">
|
||||
<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>
|
||||
<button type="button" id="extras" class="dropdown-menu-button fa tip-anchor-right"></button>
|
||||
<div class="dropdown-menu">
|
||||
<ul>
|
||||
<li id="buttonRevertAll" class="dropdown-menu-entry" data-i18n="matrixRevertAllEntry">
|
||||
<li class="dropdown-menu-entry extensionURL" data-extension-url="dashboard.html" data-i18n="matrixDashboardMenuEntry">
|
||||
</ul>
|
||||
</div>
|
||||
<div class="dropdown-menu-capture"></div>
|
||||
</div>
|
||||
|
||||
<div id="matHead" class="matrix collapsible">
|
||||
|
|
Loading…
Reference in a new issue