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

Backed out changeset d146eb93b6d0 (bug 1693374) for causing failures at browser_interaction_telemetry.js. CLOSED TREE

Browse Source
This commit is contained in:
Butkovits Atila 2021-02-26 21:32:25 +02:00
parent e0d1803e79
commit f64a8e2f9f
3 changed files with 150 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
browser/components/preferences/preferences.xhtml
View File

@ -155,16 +155,23 @@
<spacer flex="1"/>
<vbox class="sidebar-footer-list">
<label id="addonsButton" class="sidebar-footer-link" is="text-link">
<image class="sidebar-footer-icon addons-icon"/>
<label class="sidebar-footer-label" flex="1" data-l10n-id="addons-button-label"></label>
<hbox class="sidebar-footer-button" pack="center">
<label id="addonsButton" is="text-link">
<hbox align="center">
<image class="sidebar-footer-icon addons-icon"/>
<label class="sidebar-footer-label" flex="1" data-l10n-id="addons-button-label"></label>
</hbox>
</label>
<label id="helpButton" class="sidebar-footer-link" is="text-link">
<image class="sidebar-footer-icon help-icon"/>
<label class="sidebar-footer-label" flex="1" data-l10n-id="help-button-label"></label>
</hbox>
<hbox class="sidebar-footer-button help-button" pack="center">
<label id="helpButton" is="text-link">
<hbox align="center">
<image class="sidebar-footer-icon help-icon"/>
<label class="sidebar-footer-label" flex="1" data-l10n-id="help-button-label"></label>
</hbox>
</label>
</vbox>
</hbox>
</vbox>
<keyset>

108
toolkit/mozapps/extensions/content/aboutaddons.js
View File

@ -1954,77 +1954,59 @@ class SidebarFooter extends HTMLElement {
let list = document.createElement("ul");
list.classList.add("sidebar-footer-list");
let prefsItem = document.createElement("li");
prefsItem.classList.add("sidebar-footer-item");
let prefsLink = document.createElement("a");
prefsLink.classList.add("sidebar-footer-link", "preferences-icon");
prefsLink.id = "preferencesButton";
prefsLink.href = "about:preferences";
document.l10n.setAttributes(prefsLink, "sidebar-preferences-button-title");
let systemPrincipal = Services.scriptSecurityManager.getSystemPrincipal();
let prefsItem = this.createItem({
icon: "chrome://global/skin/icons/settings.svg",
createLinkElement: () => {
let link = document.createElement("a");
link.href = "about:preferences";
return link;
},
titleL10nId: "sidebar-preferences-button-title",
labelL10nId: "preferences",
onClick: e => {
e.preventDefault();
AMTelemetry.recordLinkEvent({
object: "aboutAddons",
value: "about:preferences",
extra: {
view: getTelemetryViewName(this),
},
});
windowRoot.ownerGlobal.switchToTabHavingURI("about:preferences", true, {
ignoreFragment: "whenComparing",
triggeringPrincipal: systemPrincipal,
});
},
prefsLink.addEventListener("click", e => {
e.preventDefault();
AMTelemetry.recordLinkEvent({
object: "aboutAddons",
value: "about:preferences",
extra: {
view: getTelemetryViewName(this),
},
});
windowRoot.ownerGlobal.switchToTabHavingURI("about:preferences", true, {
ignoreFragment: "whenComparing",
triggeringPrincipal: systemPrincipal,
});
});
let prefsText = document.createElement("span");
prefsText.classList.add("sidebar-footer-link-text");
document.l10n.setAttributes(prefsText, "preferences");
prefsLink.append(prefsText);
prefsItem.append(prefsLink);
let supportItem = this.createItem({
icon: "chrome://global/skin/icons/help.svg",
createLinkElement: () => {
let link = document.createElement("a", { is: "support-link" });
link.setAttribute("support-page", "addons-help");
link.id = "help-button";
return link;
},
titleL10nId: "sidebar-help-button-title",
labelL10nId: "help-button",
onClick: e => {
AMTelemetry.recordLinkEvent({
object: "aboutAddons",
value: "support",
extra: {
view: getTelemetryViewName(this),
},
});
},
let supportItem = document.createElement("li");
supportItem.classList.add("sidebar-footer-item");
let supportLink = document.createElement("a", { is: "support-link" });
document.l10n.setAttributes(supportLink, "sidebar-help-button-title");
supportLink.classList.add("sidebar-footer-link", "help-icon");
supportLink.id = "help-button";
supportLink.setAttribute("support-page", "addons-help");
supportLink.addEventListener("click", e => {
AMTelemetry.recordLinkEvent({
object: "aboutAddons",
value: "support",
extra: {
view: getTelemetryViewName(this),
},
});
});
let supportText = document.createElement("span");
supportText.classList.add("sidebar-footer-link-text");
document.l10n.setAttributes(supportText, "help-button");
supportLink.append(supportText);
supportItem.append(supportLink);
list.append(prefsItem, supportItem);
this.append(list);
}
createItem({ onClick, titleL10nId, labelL10nId, icon, createLinkElement }) {
let listItem = document.createElement("li");
let link = createLinkElement();
link.classList.add("sidebar-footer-link");
link.addEventListener("click", onClick);
document.l10n.setAttributes(link, titleL10nId);
let img = document.createElement("img");
img.src = icon;
img.className = "sidebar-footer-icon";
let label = document.createElement("span");
label.className = "sidebar-footer-label";
document.l10n.setAttributes(label, labelL10nId);
link.append(img, label);
listItem.append(link);
return listItem;
}
}
customElements.define("sidebar-footer", SidebarFooter, { extends: "footer" });

125
toolkit/themes/shared/in-content/common.inc.css
View File

@ -1097,8 +1097,6 @@ input[type="text"][warning]:enabled:not(:focus) {
box-shadow: 0 0 0 1px var(--yellow-60), 0 0 0 4px var(--yellow-60-a30);
}
/* Cards */
.card {
background: var(--in-content-box-background);
/* Needed for high-contrast where the border will appear. */
@ -1125,8 +1123,6 @@ input[type="text"][warning]:enabled:not(:focus) {
transform: scaleX(-1);
}
/* Sidebar footer links */
.sidebar-footer-list {
list-style-type: none;
margin-block: 0 36px;
@ -1134,32 +1130,61 @@ input[type="text"][warning]:enabled:not(:focus) {
padding: 0;
}
.sidebar-footer-link {
.sidebar-footer-link,
.sidebar-footer-button > .text-link {
-moz-box-flex: 1;
margin-inline: 34px 0;
text-decoration: none;
color: currentColor;
width: 36px;
height: 36px;
cursor: default;
border-radius: 2px;
}
.sidebar-footer-link {
display: flex;
align-items: center;
background-size: 16px;
background-repeat: no-repeat;
background-position-x: 13px;
background-position-y: 10px;
cursor: default;
-moz-context-properties: fill, fill-opacity;
fill: currentColor;
padding-inline-start: 43px;
/* Override link style for :hover and :hover:active states */
text-decoration: none !important;
color: inherit !important;
/* These override the common styles. */
margin: 0;
font-size: .9em;
width: auto;
}
xul|*.sidebar-footer-link {
display: -moz-box;
-moz-box-align: center;
.sidebar-footer-link:dir(rtl) {
background-position-x: right 13px;
}
.sidebar-footer-link:hover {
.sidebar-footer-link,
.sidebar-footer-link:hover,
.sidebar-footer-link:hover:active,
.sidebar-footer-link:visited {
text-decoration: none;
color: currentColor;
}
.sidebar-footer-link:hover,
.sidebar-footer-button > .text-link:hover {
background-color: var(--in-content-category-background-hover);
border-radius: 2px;
}
.sidebar-footer-link:hover:active:not([disabled]) {
.sidebar-footer-link:hover:active:not([disabled]),
.sidebar-footer-button > .text-link:hover:active:not([disabled]) {
background-color: var(--in-content-category-background-active);
color: currentColor;
}
.sidebar-footer-link:-moz-focusring {
.sidebar-footer-link:-moz-focusring,
.sidebar-footer-button > .text-link:-moz-focusring {
outline: var(--in-content-category-outline-focus);
outline-offset: -1px;
}
@ -1171,18 +1196,61 @@ xul|*.sidebar-footer-link {
height: 16px;
margin: 10px;
margin-inline-start: 13px;
vertical-align: middle;
}
.sidebar-footer-icon:hover {
fill: currentColor !important;
}
.sidebar-footer-button:last-of-type {
margin-bottom: 36px;
}
xul|*.help-icon {
list-style-image: url("chrome://global/skin/icons/help.svg");
}
html|*.help-icon {
background-image: url("chrome://global/skin/icons/help.svg");
}
.preferences-icon {
background-image: url("chrome://global/skin/icons/settings.svg");
}
.addons-icon {
list-style-image: url("chrome://mozapps/skin/extensions/extension.svg");
/* The add-ons icon doesn't have much (any?) margin, so make it a bit smaller. */
width: 14px;
height: 14px;
margin-inline-start: 15px;
}
.sidebar-footer-label {
font-size: .9em;
margin: 0 4px;
font-size: .9em;
user-select: none;
}
@media (max-width: 830px) {
.sidebar-footer-button > .text-link {
-moz-box-flex: 0;
width: 36px;
height: 36px;
margin-inline-start: 0;
}
.sidebar-footer-icon {
margin: 10px;
}
.sidebar-footer-label {
display: none;
}
.sidebar-footer-list {
margin-inline-start: 40px;
-moz-box-align: start;
}
.sidebar-footer-link {
@ -1192,30 +1260,17 @@ xul|*.sidebar-footer-link {
margin-inline-start: 1px;
}
.sidebar-footer-icon {
margin-inline-start: 10px;
.sidebar-footer-link,
/* We need to override the full-width RTL rule, so explicitly specify RTL. */
.sidebar-footer-link:dir(rtl) {
background-position: center;
}
.sidebar-footer-label {
.sidebar-footer-link-text {
display: none;
}
}
/* Icon helper classes */
xul|*.help-icon {
list-style-image: url("chrome://global/skin/icons/help.svg");
}
xul|*.addons-icon {
list-style-image: url("chrome://mozapps/skin/extensions/extension.svg");
/* The add-ons icon doesn't have much (any?) margin, so make it a bit smaller. */
scale: 87.5%;
translate: 6.25%;
}
/* Back button */
.back-button {
-moz-context-properties: fill;
fill: currentColor;