Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-11-25 05:41:12 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Bug 1752830 - Remove preprocessor from aboutProcesses.css r=Gijs

Browse Source 
* Use classList.toggle in aboutProcess.js and move arrow direction logic for column sorting into this file

Differential Revision: https://phabricator.services.mozilla.com/D138539
This commit is contained in:
Sarah Clements 2022-02-11 17:42:57 +00:00
parent 1fbbcbbcc2
commit cccd748af9
3 changed files with 17 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
toolkit/components/aboutprocesses/content/aboutProcesses.css
View File

@ -175,30 +175,19 @@ tr[selected] > td {
.clickable:dir(rtl) {
background-position-x: left 4px;
}
.asc,
.desc {
.arrow-up,
.arrow-down {
-moz-context-properties: fill;
fill: currentColor;
}
/*
Linux has conventions opposite to Windows, macOS on the direction of arrows
when sorting.
*/
%ifdef XP_LINUX
.asc {
background-image: url(chrome://global/skin/icons/arrow-up-12.svg);
.arrow-up {
background-image: url("chrome://global/skin/icons/arrow-up-12.svg");
}
.desc {
background-image: url(chrome://global/skin/icons/arrow-down-12.svg);
.arrow-down {
background-image: url("chrome://global/skin/icons/arrow-down-12.svg");
}
%else
.asc {
background-image: url(chrome://global/skin/icons/arrow-down-12.svg);
}
.desc {
background-image: url(chrome://global/skin/icons/arrow-up-12.svg);
}
%endif
th.clickable:hover {
background-color: var(--in-content-button-background-hover);

17
toolkit/components/aboutprocesses/content/aboutProcesses.js
View File

@ -1102,11 +1102,15 @@ var Control = {
if (!event.target.classList.contains("clickable")) {
return;
}
// Linux has conventions opposite to Windows and macOS on the direction of arrows
// when sorting.
const platformIsLinux = AppConstants.platform == "linux";
const ascArrow = platformIsLinux ? "arrow-up" : "arrow-down";
const descArrow = platformIsLinux ? "arrow-down" : "arrow-up";
if (this._sortColumn) {
const td = document.getElementById(this._sortColumn);
td.classList.remove("asc");
td.classList.remove("desc");
td.classList.remove(ascArrow, descArrow);
}
const columnId = event.target.id;
@ -1118,13 +1122,8 @@ var Control = {
this._sortAscendent = true;
}
if (this._sortAscendent) {
event.target.classList.remove("desc");
event.target.classList.add("asc");
} else {
event.target.classList.remove("asc");
event.target.classList.add("desc");
}
event.target.classList.toggle(ascArrow, this._sortAscendent);
event.target.classList.toggle(descArrow, !this._sortAscendent);
await this._updateDisplay(true);
});

2
toolkit/components/aboutprocesses/jar.mn
View File

@ -5,4 +5,4 @@
toolkit.jar:
content/global/aboutProcesses.html (content/aboutProcesses.html)
content/global/aboutProcesses.js (content/aboutProcesses.js)
* content/global/aboutProcesses.css (content/aboutProcesses.css)
content/global/aboutProcesses.css (content/aboutProcesses.css)