зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1218789 - Close button and gear button are misaligned in notifications. r=MattN
--HG-- extra : rebase_source : 875dc313e8a93b5d604ebe5d458efcc044d02cac
This commit is contained in:
Родитель
153097fa77
Коммит
2ef4da49fb
|
@ -165,6 +165,10 @@ function onAlertLoad() {
|
|||
alertBox.setAttribute("animate", true);
|
||||
}
|
||||
|
||||
let alertSettings = document.getElementById("alertSettings");
|
||||
alertSettings.addEventListener("focus", onAlertSettingsFocus);
|
||||
alertSettings.addEventListener("click", onAlertSettingsClick);
|
||||
|
||||
let ev = new CustomEvent("AlertActive", {bubbles: true, cancelable: true});
|
||||
document.documentElement.dispatchEvent(ev);
|
||||
|
||||
|
@ -280,6 +284,18 @@ function disableForOrigin() {
|
|||
onAlertClose();
|
||||
}
|
||||
|
||||
function onAlertSettingsFocus(event) {
|
||||
event.target.removeAttribute("focusedViaMouse");
|
||||
}
|
||||
|
||||
function onAlertSettingsClick(event) {
|
||||
// XXXjaws Hack used to remove the focus-ring only
|
||||
// from mouse interaction, but focus-ring drawing
|
||||
// should only be enabled when interacting via keyboard.
|
||||
event.target.setAttribute("focusedViaMouse", true);
|
||||
event.stopPropagation();
|
||||
}
|
||||
|
||||
function openSettings() {
|
||||
gAlertListener.observe(null, "alertsettingscallback", gAlertCookie);
|
||||
onAlertClose();
|
||||
|
|
|
@ -43,8 +43,7 @@
|
|||
<spacer flex="1"/>
|
||||
<box id="alertFooter">
|
||||
<label id="alertSourceLabel" class="alertSource plain"/>
|
||||
<button type="menu" id="alertSettings" tooltiptext="&settings.label;"
|
||||
onclick="event.stopPropagation();">
|
||||
<button type="menu" id="alertSettings" tooltiptext="&settings.label;">
|
||||
<menupopup position="after_end">
|
||||
<menuitem id="doNotDisturbMenuItem"
|
||||
oncommand="doNotDisturb();"/>
|
||||
|
|
|
@ -86,6 +86,11 @@
|
|||
width: 255px;
|
||||
}
|
||||
|
||||
#alertFooter {
|
||||
-moz-box-align: end;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
#alertSourceLabel {
|
||||
-moz-box-flex: 1;
|
||||
font-size: 83.334%;
|
||||
|
@ -96,18 +101,33 @@
|
|||
-moz-appearance: none;
|
||||
background-color: transparent;
|
||||
border-width: 0;
|
||||
border-radius: 20px;
|
||||
min-width: 0;
|
||||
list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities");
|
||||
margin-inline-end: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#alertSettings > .button-box {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#alertSettings:hover,
|
||||
#alertSettings[open] {
|
||||
list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities-inverted");
|
||||
}
|
||||
|
||||
#alertSettings:hover {
|
||||
background-color: rgba(107,107,107,.2);
|
||||
border-radius: 20px;
|
||||
background-color: rgb(128,128,128);
|
||||
}
|
||||
|
||||
#alertSettings[open],
|
||||
#alertSettings:hover:active {
|
||||
background-color: rgba(107,107,107,.4);
|
||||
background-color: rgb(102,102,102);
|
||||
}
|
||||
|
||||
#alertSettings[focusedViaMouse]:-moz-focusring > .button-box {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
#alertSettings > .button-box > .button-menu-dropmarker,
|
||||
|
|
|
@ -13,10 +13,14 @@
|
|||
use[id$="-native"] {
|
||||
fill: GrayText;
|
||||
}
|
||||
use[id$="-inverted"] {
|
||||
fill: #ddd;
|
||||
}
|
||||
</style>
|
||||
<defs>
|
||||
<path id="utilities-shape" d="m11.5,13.9l-.6-1.5c.3-.2 .5-.4 .8-.6 .2-.2 .4-.5 .6-.7l1.5,.6c.3,.1 .6,0 .7-.3l.4-1c.1-.3 0-.6-.3-.7l-1.5-.6c.1-.6 .1-1.3 0-2l1.5-.6c.3-.1 .4-.4 .3-.7l-.4-1c-.1-.3-.4-.4-.7-.3l-1.5,.6c-.2-.3-.4-.5-.6-.8-.2-.1-.5-.3-.7-.5l.6-1.5c.1-.3 0-.6-.3-.7l-.9-.4c-.3-.1-.6,0-.7,.3l-.6,1.5c-.6-.1-1.3-.1-2,0l-.6-1.5c-.1-.3-.4-.4-.7-.3l-1,.4c-.2,.1-.3,.4-.2,.6l.6,1.5c-.3,.3-.5,.5-.8,.7-.2,.3-.4,.5-.6,.8l-1.5-.7c-.3-.1-.6,0-.7,.3l-.4,.9c-.1,.3 0,.6 .3,.7l1.5,.7c-.1,.6-.1,1.3 0,1.9l-1.5,.6c-.3,.1-.4,.4-.3,.7l.4,1c.1,.3 .4,.4 .7,.3l1.5-.6c.2,.3 .4,.5 .6,.8 .2,.2 .5,.4 .7,.6l-.6,1.5c-.1,.3 0,.6 .3,.7l1,.4c.3,.1 .6,0 .7-.3l.6-1.5c.6,.1 1.3,.1 2,0l.6,1.5c.1,.3 .4,.4 .7,.3l1-.4c.1-.1 .3-.4 .1-.7zm-5.1-4.2c-.9-.9-.9-2.4 0-3.3 .9-.9 2.4-.9 3.3,0 .9,.9 .9,2.4 0,3.3-.9,.9-2.4,.9-3.3,0z"/>
|
||||
</defs>
|
||||
<use id="utilities" xlink:href="#utilities-shape"/>
|
||||
<use id="utilities-native" xlink:href="#utilities-shape"/>
|
||||
<use id="utilities-inverted" xlink:href="#utilities-shape"/>
|
||||
</svg>
|
||||
|
|
До Ширина: | Высота: | Размер: 1.5 KiB После Ширина: | Высота: | Размер: 1.6 KiB |
Загрузка…
Ссылка в новой задаче