mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-13 05:15:45 +00:00
Bug 634173 - Style toaster alerts on Android [r=mbrubeck]
This commit is contained in:
parent
e5548dba17
commit
8b6074aab8
@ -9,10 +9,10 @@ var AlertsHelper = {
|
||||
|
||||
// Move the popup on the other side if we are in RTL
|
||||
let [leftSidebar, rightSidebar] = [Elements.tabs.getBoundingClientRect(), Elements.controls.getBoundingClientRect()];
|
||||
if (leftSidebar.left > rightSidebar.left) {
|
||||
container.removeAttribute("right");
|
||||
if (leftSidebar.left > rightSidebar.left)
|
||||
container.setAttribute("left", "0");
|
||||
}
|
||||
else
|
||||
container.setAttribute("right", "0");
|
||||
|
||||
let self = this;
|
||||
container.addEventListener("transitionend", function() {
|
||||
@ -27,13 +27,35 @@ var AlertsHelper = {
|
||||
this._listener = aListener || null;
|
||||
this._cookie = aCookie || "";
|
||||
|
||||
// Reset the container settings from the last time so layout can happen naturally
|
||||
let container = this.container;
|
||||
container.removeAttribute("width");
|
||||
let alertText = document.getElementById("alerts-text");
|
||||
alertText.style.whiteSpace = "";
|
||||
|
||||
document.getElementById("alerts-image").setAttribute("src", aImageURL);
|
||||
document.getElementById("alerts-title").value = aTitle;
|
||||
document.getElementById("alerts-text").textContent = aText;
|
||||
alertText.textContent = aText;
|
||||
|
||||
let container = this.container;
|
||||
container.hidden = false;
|
||||
container.height = container.getBoundingClientRect().height;
|
||||
let bcr = container.getBoundingClientRect();
|
||||
if (bcr.width > window.innerWidth - 50) {
|
||||
// If the window isn't wide enough, we need to re-layout
|
||||
container.setAttribute("width", window.innerWidth - 50); // force a max width
|
||||
alertText.style.whiteSpace = "pre-wrap"; // wrap text as needed
|
||||
bcr = container.getBoundingClientRect(); // recalculate the bcr
|
||||
}
|
||||
container.setAttribute("width", bcr.width); // redundant but cheap
|
||||
container.setAttribute("height", bcr.height);
|
||||
|
||||
#ifdef ANDROID
|
||||
let offset = (window.innerWidth - container.width) / 2;
|
||||
if (container.hasAttribute("left"))
|
||||
container.setAttribute("left", offset);
|
||||
else
|
||||
container.setAttribute("right", offset);
|
||||
#endif
|
||||
|
||||
container.classList.add("showing");
|
||||
|
||||
let timeout = Services.prefs.getIntPref("alerts.totalOpenTime");
|
||||
|
@ -661,8 +661,7 @@
|
||||
</hbox>
|
||||
|
||||
<!-- alerts for content -->
|
||||
<hbox id="alerts-container" hidden="true" align="start" class="dialog-dark" bottom="0" right="0"
|
||||
onclick="AlertsHelper.click(event);">
|
||||
<hbox id="alerts-container" hidden="true" align="start" bottom="0" onclick="AlertsHelper.click(event);">
|
||||
<image id="alerts-image"/>
|
||||
<vbox flex="1">
|
||||
<label id="alerts-title" value=""/>
|
||||
|
@ -22,7 +22,7 @@ chrome.jar:
|
||||
* content/browser-ui.js (content/browser-ui.js)
|
||||
* content/browser-scripts.js (content/browser-scripts.js)
|
||||
* content/common-ui.js (content/common-ui.js)
|
||||
content/AlertsHelper.js (content/AlertsHelper.js)
|
||||
* content/AlertsHelper.js (content/AlertsHelper.js)
|
||||
content/AppMenu.js (content/AppMenu.js)
|
||||
content/AwesomePanel.js (content/AwesomePanel.js)
|
||||
content/BookmarkHelper.js (content/BookmarkHelper.js)
|
||||
|
@ -1273,36 +1273,37 @@ pageaction:not([image]) > hbox >.pageaction-image {
|
||||
|
||||
/* alerts popup ----------------------------------------------------------- */
|
||||
#alerts-container {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
@media (max-width: 499px) {
|
||||
#alerts-container {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
#alerts-container {
|
||||
-moz-transform: translatex(100%);
|
||||
-moz-transition-property: -moz-transform;
|
||||
-moz-transition-duration: 0.5s;
|
||||
color: white;
|
||||
background-color: #5e6166;
|
||||
border: @border_width_small@ solid #767973;
|
||||
border-radius: @border_radius_normal@;
|
||||
box-shadow: black 0 @border_radius_tiny@ @border_radius_tiny@;
|
||||
padding: @padding_normal@; /* core spacing on top/bottom */
|
||||
margin-bottom: @margin_large@;
|
||||
-moz-margin-end: @margin_large@;
|
||||
}
|
||||
|
||||
#alerts-container:-moz-locale-dir(rtl) {
|
||||
-moz-transform: translatex(-100%);
|
||||
-moz-transition-property: opacity;
|
||||
-moz-transition-duration: 0.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#alerts-container.showing {
|
||||
-moz-transform: translatex(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#alerts-title {
|
||||
font-size: @font_small@ !important;
|
||||
}
|
||||
|
||||
#alerts-text {
|
||||
font-size: @font_small@ !important;
|
||||
white-space: pre-wrap;
|
||||
font-size: @font_xsmall@ !important;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
%ifndef ANDROID
|
||||
#alerts-container {
|
||||
-moz-margin-end: @margin_large@;
|
||||
}
|
||||
%endif
|
||||
|
||||
/* helperapp (save-as) popup ----------------------------------------------- */
|
||||
#helperapp-target {
|
||||
font-size: @font_small@ !important;
|
||||
|
Loading…
Reference in New Issue
Block a user