Merge m-c to inbound.
2
CLOBBER
@ -18,4 +18,4 @@
|
||||
# Modifying this file will now automatically clobber the buildbot machines \o/
|
||||
#
|
||||
|
||||
Bug 915533 - Remove unused files under dom/bluetooth.
|
||||
Bug 585122 - New file added for xpcshell test not always being copied.
|
||||
|
@ -65,7 +65,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=483573
|
||||
var audioElm = getAccessible("audio");
|
||||
var playBtn = audioElm.firstChild;
|
||||
var scrubber = playBtn.nextSibling.nextSibling.nextSibling;
|
||||
var muteBtn = audioElm.lastChild;
|
||||
var muteBtn = audioElm.lastChild.previousSibling;
|
||||
|
||||
var actions = [
|
||||
{
|
||||
|
@ -49,7 +49,11 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=483573
|
||||
role: ROLE_PUSHBUTTON,
|
||||
name: "Mute",
|
||||
children: []
|
||||
}
|
||||
},
|
||||
{ // slider of volume bar
|
||||
role: ROLE_SLIDER,
|
||||
children: []
|
||||
},
|
||||
]
|
||||
};
|
||||
testAccessibleTree("audio", accTree);
|
||||
|
@ -28,5 +28,9 @@
|
||||
<true/>
|
||||
<key>CGDisableCoalescedUpdates</key>
|
||||
<true/>
|
||||
<key>NSHighResolutionCapable</key>
|
||||
<true/>
|
||||
<key>NSPrincipalClass</key>
|
||||
<string>GeckoNSApplication</string>
|
||||
</dict>
|
||||
</plist>
|
||||
|
@ -1346,7 +1346,7 @@ window.addEventListener('ContentStart', function update_onContentStart() {
|
||||
break;
|
||||
case 'content-shutdown':
|
||||
// iterate through all the existing active processes
|
||||
Object.keys(gRecordingActiveProcesses[processId]).foreach(function(requestURL) {
|
||||
Object.keys(gRecordingActiveProcesses[processId]).forEach(function(requestURL) {
|
||||
commandHandler(requestURL, { type: aData,
|
||||
isAudio: true,
|
||||
isVideo: true});
|
||||
|
@ -54,7 +54,7 @@
|
||||
* is hidden by videocontrols.xml, and that alters the position of the
|
||||
* play button. This workaround moves it back to center.
|
||||
*/
|
||||
.controlBar.audio .playButton {
|
||||
.controlBar.audio-only .playButton {
|
||||
transform: translateX(28px);
|
||||
}
|
||||
|
||||
|
@ -1,4 +1,4 @@
|
||||
{
|
||||
"revision": "adb7896ababd1ccb828e11b05909c0e9ca22594e",
|
||||
"revision": "2f52419acd2edacec369138b143454dd8afccebd",
|
||||
"repo_path": "/integration/gaia-central"
|
||||
}
|
||||
|
@ -1090,7 +1090,7 @@ pref("devtools.commands.dir", "");
|
||||
// Enable the app manager
|
||||
pref("devtools.appmanager.enabled", true);
|
||||
pref("devtools.appmanager.lastTab", "help");
|
||||
pref("devtools.appmanager.manifestEditor.enabled", false);
|
||||
pref("devtools.appmanager.manifestEditor.enabled", true);
|
||||
|
||||
// Toolbox preferences
|
||||
pref("devtools.toolbox.footer.height", 250);
|
||||
|
@ -4194,8 +4194,8 @@ function onViewToolbarsPopupShowing(aEvent, aInsertPoint) {
|
||||
return;
|
||||
}
|
||||
|
||||
// The explicitOriginalTarget can be a nested child element of a toolbaritem.
|
||||
let toolbarItem = aEvent.explicitOriginalTarget;
|
||||
// triggerNode can be a nested child element of a toolbaritem.
|
||||
let toolbarItem = popup.triggerNode;
|
||||
|
||||
if (toolbarItem && toolbarItem.localName == "toolbarpaletteitem") {
|
||||
toolbarItem = toolbarItem.firstChild;
|
||||
|
@ -48,7 +48,7 @@ function setAttributes(aNode, aAttrs) {
|
||||
|
||||
function updateCombinedWidgetStyle(aNode, aArea, aModifyAutoclose) {
|
||||
let inPanel = (aArea == CustomizableUI.AREA_PANEL);
|
||||
let cls = inPanel ? "panel-combined-button" : null;
|
||||
let cls = inPanel ? "panel-combined-button" : "toolbarbutton-1";
|
||||
let attrs = {class: cls};
|
||||
if (aModifyAutoclose) {
|
||||
attrs.noautoclose = inPanel ? true : null;
|
||||
@ -305,7 +305,7 @@ const CustomizableWidgets = [{
|
||||
const kPanelId = "PanelUI-popup";
|
||||
let inPanel = (this.currentArea == CustomizableUI.AREA_PANEL);
|
||||
let noautoclose = inPanel ? "true" : null;
|
||||
let cls = inPanel ? "panel-combined-button" : null;
|
||||
let cls = inPanel ? "panel-combined-button" : "toolbarbutton-1";
|
||||
|
||||
if (!this.currentArea)
|
||||
cls = null;
|
||||
@ -449,7 +449,7 @@ const CustomizableWidgets = [{
|
||||
defaultArea: CustomizableUI.AREA_PANEL,
|
||||
onBuild: function(aDocument) {
|
||||
let inPanel = (this.currentArea == CustomizableUI.AREA_PANEL);
|
||||
let cls = inPanel ? "panel-combined-button" : null;
|
||||
let cls = inPanel ? "panel-combined-button" : "toolbarbutton-1";
|
||||
|
||||
if (!this.currentArea)
|
||||
cls = null;
|
||||
@ -799,6 +799,8 @@ const CustomizableWidgets = [{
|
||||
if (isWin8OrHigher()) {
|
||||
CustomizableWidgets.push({
|
||||
id: "switch-to-metro-button",
|
||||
label: "switch-to-metro-button2.label",
|
||||
tooltiptext: "switch-to-metro-button2.tooltiptext",
|
||||
removable: true,
|
||||
defaultArea: CustomizableUI.AREA_PANEL,
|
||||
onCommand: function(aEvent) {
|
||||
|
@ -6,7 +6,7 @@
|
||||
JS_MODULES_PATH = 'modules/devtools/debugger'
|
||||
|
||||
EXTRA_JS_MODULES += [
|
||||
'debugger-panel.js'
|
||||
'panel.js'
|
||||
]
|
||||
|
||||
BROWSER_CHROME_MANIFESTS += ['test/browser.ini']
|
||||
|
59
browser/devtools/framework/options-panel.css
Normal file
@ -0,0 +1,59 @@
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
#options-panel-container {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#options-panel {
|
||||
overflow-y: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.options-vertical-pane {
|
||||
display: inline;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.options-vertical-pane > label {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.options-vertical-pane {
|
||||
margin: 5px;
|
||||
width: calc(50% - 30px);
|
||||
min-width: 400px;
|
||||
-moz-padding-start: 5px;
|
||||
}
|
||||
|
||||
.options-vertical-pane > label {
|
||||
padding: 2px 0;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.options-groupbox {
|
||||
-moz-margin-start: 15px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-groupbox > * {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-citation-label {
|
||||
font-size: 1rem !important;
|
||||
/* !important is required otherwise font-size will still be 1.4rem */
|
||||
font-style: italic;
|
||||
padding: 4px 0 0; /* To align it with the checkbox */
|
||||
}
|
||||
|
||||
.options-citation-label + label {
|
||||
padding: 3px 0 0 !important; /* To align it with the checkbox */
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hidden-labels-box:not(.visible) > label,
|
||||
.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
|
||||
display: none;
|
||||
}
|
@ -7,8 +7,7 @@
|
||||
%toolboxDTD;
|
||||
]>
|
||||
<?xml-stylesheet href="chrome://browser/skin/" type="text/css"?>
|
||||
<?xml-stylesheet rel="stylesheet" href="chrome://browser/content/devtools/framework/toolbox.css" type="text/css"?>
|
||||
<?xml-stylesheet rel="stylesheet" href="chrome://browser/skin/devtools/toolbox.css" type="text/css"?>
|
||||
<?xml-stylesheet rel="stylesheet" href="chrome://browser/content/devtools/framework/options-panel.css" type="text/css"?>
|
||||
|
||||
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
|
||||
|
||||
|
@ -1,32 +0,0 @@
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
.devtools-tab {
|
||||
-moz-binding: url("chrome://global/content/bindings/general.xml#control-item");
|
||||
-moz-box-align: center;
|
||||
}
|
||||
|
||||
#toolbox-controls > toolbarbutton > .toolbarbutton-text,
|
||||
#toolbox-dock-buttons > toolbarbutton > .toolbarbutton-text,
|
||||
.command-button > .toolbarbutton-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#options-panel-container {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#options-panel {
|
||||
overflow-y: auto;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.options-vertical-pane {
|
||||
display: inline;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.options-vertical-pane > label {
|
||||
display: block;
|
||||
}
|
@ -7,9 +7,7 @@
|
||||
%toolboxDTD;
|
||||
]>
|
||||
<?xml-stylesheet href="chrome://browser/skin/" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://browser/content/devtools/framework/toolbox.css" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://browser/skin/devtools/common.css" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://browser/skin/devtools/toolbox.css" type="text/css"?>
|
||||
<?xul-overlay href="chrome://global/content/editMenuOverlay.xul"?>
|
||||
|
||||
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
|
||||
|
@ -75,7 +75,7 @@ browser.jar:
|
||||
content/browser/devtools/framework/toolbox-options.xul (framework/toolbox-options.xul)
|
||||
content/browser/devtools/framework/toolbox-options.js (framework/toolbox-options.js)
|
||||
* content/browser/devtools/framework/toolbox.xul (framework/toolbox.xul)
|
||||
content/browser/devtools/framework/toolbox.css (framework/toolbox.css)
|
||||
content/browser/devtools/framework/options-panel.css (framework/options-panel.css)
|
||||
content/browser/devtools/framework/toolbox-process-window.xul (framework/toolbox-process-window.xul)
|
||||
content/browser/devtools/framework/toolbox-process-window.js (framework/toolbox-process-window.js)
|
||||
content/browser/devtools/inspector/inspector.xul (inspector/inspector.xul)
|
||||
|
@ -25,11 +25,11 @@ let events = require("sdk/system/events");
|
||||
loader.lazyGetter(this, "OptionsPanel", () => require("devtools/framework/toolbox-options").OptionsPanel);
|
||||
loader.lazyGetter(this, "InspectorPanel", () => require("devtools/inspector/inspector-panel").InspectorPanel);
|
||||
loader.lazyGetter(this, "WebConsolePanel", () => require("devtools/webconsole/panel").WebConsolePanel);
|
||||
loader.lazyGetter(this, "DebuggerPanel", () => require("devtools/debugger/debugger-panel").DebuggerPanel);
|
||||
loader.lazyGetter(this, "DebuggerPanel", () => require("devtools/debugger/panel").DebuggerPanel);
|
||||
loader.lazyImporter(this, "StyleEditorPanel", "resource:///modules/devtools/StyleEditorPanel.jsm");
|
||||
loader.lazyGetter(this, "ShaderEditorPanel", () => require("devtools/shadereditor/panel").ShaderEditorPanel);
|
||||
loader.lazyGetter(this, "ProfilerPanel", () => require("devtools/profiler/panel"));
|
||||
loader.lazyGetter(this, "NetMonitorPanel", () => require("devtools/netmonitor/netmonitor-panel").NetMonitorPanel);
|
||||
loader.lazyGetter(this, "NetMonitorPanel", () => require("devtools/netmonitor/panel").NetMonitorPanel);
|
||||
loader.lazyGetter(this, "ScratchpadPanel", () => require("devtools/scratchpad/scratchpad-panel").ScratchpadPanel);
|
||||
|
||||
// Strings
|
||||
|
@ -8,5 +8,5 @@ TEST_DIRS += ['test']
|
||||
JS_MODULES_PATH = 'modules/devtools/netmonitor'
|
||||
|
||||
EXTRA_JS_MODULES += [
|
||||
'netmonitor-panel.js'
|
||||
'panel.js'
|
||||
]
|
||||
|
@ -203,7 +203,7 @@ function ResponsiveUI(aWindow, aTab)
|
||||
|
||||
// Touch events support
|
||||
this.touchEnableBefore = false;
|
||||
this.touchEventHandler = new TouchEventHandler(this.browser.contentWindow);
|
||||
this.touchEventHandler = new TouchEventHandler(this.browser);
|
||||
|
||||
this.browser.addEventListener("load", this.bound_onPageLoad, true);
|
||||
this.browser.addEventListener("unload", this.bound_onPageUnload, true);
|
||||
@ -232,7 +232,7 @@ ResponsiveUI.prototype = {
|
||||
* Window onload / onunload
|
||||
*/
|
||||
onPageLoad: function() {
|
||||
this.touchEventHandler = new TouchEventHandler(this.browser.contentWindow);
|
||||
this.touchEventHandler = new TouchEventHandler(this.browser);
|
||||
if (this.touchEnableBefore) {
|
||||
this.enableTouch();
|
||||
}
|
||||
|
@ -31,3 +31,4 @@ support-files =
|
||||
[browser_toolbar_tooltip.js]
|
||||
[browser_toolbar_webconsole_errors_count.js]
|
||||
[browser_spectrum.js]
|
||||
[browser_csstransformpreview.js]
|
||||
|
139
browser/devtools/shared/test/browser_csstransformpreview.js
Normal file
@ -0,0 +1,139 @@
|
||||
/* vim: set ts=2 et sw=2 tw=80: */
|
||||
/* Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/ */
|
||||
|
||||
// Tests that the spectrum color picker works correctly
|
||||
|
||||
const TEST_URI = "data:text/html;charset=utf-8,<div></div>";
|
||||
const {CSSTransformPreviewer} = devtools.require("devtools/shared/widgets/CSSTransformPreviewer");
|
||||
|
||||
let doc, root;
|
||||
|
||||
function test() {
|
||||
waitForExplicitFinish();
|
||||
addTab(TEST_URI, () => {
|
||||
doc = content.document;
|
||||
root = doc.querySelector("div");
|
||||
startTests();
|
||||
});
|
||||
}
|
||||
|
||||
function endTests() {
|
||||
doc = root = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
}
|
||||
|
||||
function startTests() {
|
||||
testCreateAndDestroyShouldAppendAndRemoveElements();
|
||||
}
|
||||
|
||||
function testCreateAndDestroyShouldAppendAndRemoveElements() {
|
||||
ok(root, "We have the root node to append the preview to");
|
||||
is(root.childElementCount, 0, "Root node is empty");
|
||||
|
||||
let p = new CSSTransformPreviewer(root);
|
||||
p.preview("matrix(1, -0.2, 0, 1, 0, 0)");
|
||||
ok(root.childElementCount > 0, "Preview has appended elements");
|
||||
ok(root.querySelector("canvas"), "Canvas preview element is here");
|
||||
|
||||
p.destroy();
|
||||
is(root.childElementCount, 0, "Destroying preview removed all nodes");
|
||||
|
||||
testCanvasDimensionIsConstrainedByMaxDim();
|
||||
}
|
||||
|
||||
function testCanvasDimensionIsConstrainedByMaxDim() {
|
||||
let p = new CSSTransformPreviewer(root);
|
||||
p.MAX_DIM = 500;
|
||||
p.preview("scale(1)", "center", 1000, 1000);
|
||||
|
||||
let canvas = root.querySelector("canvas");
|
||||
is(canvas.width, 500, "Canvas width is correct");
|
||||
is(canvas.height, 500, "Canvas height is correct");
|
||||
|
||||
p.destroy();
|
||||
|
||||
testCallingPreviewSeveralTimesReusesTheSameCanvas();
|
||||
}
|
||||
|
||||
function testCallingPreviewSeveralTimesReusesTheSameCanvas() {
|
||||
let p = new CSSTransformPreviewer(root);
|
||||
|
||||
p.preview("scale(1)", "center", 1000, 1000);
|
||||
let canvas = root.querySelector("canvas");
|
||||
|
||||
p.preview("rotate(90deg)");
|
||||
let canvases = root.querySelectorAll("canvas");
|
||||
is(canvases.length, 1, "Still one canvas element");
|
||||
is(canvases[0], canvas, "Still the same canvas element");
|
||||
p.destroy();
|
||||
|
||||
testCanvasDimensionAreCorrect();
|
||||
}
|
||||
|
||||
function testCanvasDimensionAreCorrect() {
|
||||
// Only test a few simple transformations
|
||||
let p = new CSSTransformPreviewer(root);
|
||||
|
||||
// Make sure we have a square
|
||||
let w = 200, h = w;
|
||||
p.MAX_DIM = w;
|
||||
|
||||
// We can't test the content of the canvas here, just that, given a max width
|
||||
// the aspect ratio of the canvas seems correct.
|
||||
|
||||
// Translate a square by its width, should be a rectangle
|
||||
p.preview("translateX(200px)", "center", w, h);
|
||||
let canvas = root.querySelector("canvas");
|
||||
is(canvas.width, w, "width is correct");
|
||||
is(canvas.height, h/2, "height is half of the width");
|
||||
|
||||
// Rotate on the top right corner, should be a rectangle
|
||||
p.preview("rotate(-90deg)", "top right", w, h);
|
||||
is(canvas.width, w, "width is correct");
|
||||
is(canvas.height, h/2, "height is half of the width");
|
||||
|
||||
// Rotate on the bottom left corner, should be a rectangle
|
||||
p.preview("rotate(90deg)", "top right", w, h);
|
||||
is(canvas.width, w/2, "width is half of the height");
|
||||
is(canvas.height, h, "height is correct");
|
||||
|
||||
// Scale from center, should still be a square
|
||||
p.preview("scale(2)", "center", w, h);
|
||||
is(canvas.width, w, "width is correct");
|
||||
is(canvas.height, h, "height is correct");
|
||||
|
||||
// Skew from center, 45deg, should be a rectangle
|
||||
p.preview("skew(45deg)", "center", w, h);
|
||||
is(canvas.width, w, "width is correct");
|
||||
is(canvas.height, h/2, "height is half of the height");
|
||||
|
||||
p.destroy();
|
||||
|
||||
testPreviewingInvalidTransformReturnsFalse();
|
||||
}
|
||||
|
||||
function testPreviewingInvalidTransformReturnsFalse() {
|
||||
let p = new CSSTransformPreviewer(root);
|
||||
ok(!p.preview("veryWow(muchPx) suchTransform(soDeg)"), "Returned false for invalid transform");
|
||||
ok(!p.preview("rotae(3deg)"), "Returned false for invalid transform");
|
||||
|
||||
// Verify the canvas is empty by checking the image data
|
||||
let canvas = root.querySelector("canvas"), ctx = canvas.getContext("2d");
|
||||
let data = ctx.getImageData(0, 0, canvas.width, canvas.height).data;
|
||||
for (let i = 0, n = data.length; i < n; i += 4) {
|
||||
// Let's not log 250*250*4 asserts! Instead, just log when it fails
|
||||
let red = data[i];
|
||||
let green = data[i + 1];
|
||||
let blue = data[i + 2];
|
||||
let alpha = data[i + 3];
|
||||
if (red !== 0 || green !== 0 || blue !== 0 || alpha !== 0) {
|
||||
ok(false, "Image data is not empty after an invalid transformed was previewed");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
is(p.preview("translateX(30px)"), true, "Returned true for a valid transform");
|
||||
endTests();
|
||||
}
|
389
browser/devtools/shared/widgets/CSSTransformPreviewer.js
Normal file
@ -0,0 +1,389 @@
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
"use strict";
|
||||
|
||||
/**
|
||||
* The CSSTransformPreview module displays, using a <canvas> a rectangle, with
|
||||
* a given width and height and its transformed version, given a css transform
|
||||
* property and origin. It also displays arrows from/to each corner.
|
||||
*
|
||||
* It is useful to visualize how a css transform affected an element. It can
|
||||
* help debug tricky transformations. It is used today in a tooltip, and this
|
||||
* tooltip is shown when hovering over a css transform declaration in the rule
|
||||
* and computed view panels.
|
||||
*
|
||||
* TODO: For now, it multiplies matrices itself to calculate the coordinates of
|
||||
* the transformed box, but that should be removed as soon as we can get access
|
||||
* to getQuads().
|
||||
*/
|
||||
|
||||
const HTML_NS = "http://www.w3.org/1999/xhtml";
|
||||
|
||||
/**
|
||||
* The TransformPreview needs an element to output a canvas tag.
|
||||
*
|
||||
* Usage example:
|
||||
*
|
||||
* let t = new CSSTransformPreviewer(myRootElement);
|
||||
* t.preview("rotate(45deg)", "top left", 200, 400);
|
||||
* t.preview("skew(19deg)", "center", 100, 500);
|
||||
* t.preview("matrix(1, -0.2, 0, 1, 0, 0)");
|
||||
* t.destroy();
|
||||
*
|
||||
* @param {nsIDOMElement} parentEl
|
||||
* Where the canvas will go
|
||||
*/
|
||||
function CSSTransformPreviewer(parentEl) {
|
||||
this.parentEl = parentEl;
|
||||
this.doc = this.parentEl.ownerDocument;
|
||||
this.canvas = null;
|
||||
this.ctx = null;
|
||||
}
|
||||
|
||||
module.exports.CSSTransformPreviewer = CSSTransformPreviewer;
|
||||
|
||||
CSSTransformPreviewer.prototype = {
|
||||
/**
|
||||
* The preview look-and-feel can be changed using these properties
|
||||
*/
|
||||
MAX_DIM: 250,
|
||||
PAD: 5,
|
||||
ORIGINAL_FILL: "#1F303F",
|
||||
ORIGINAL_STROKE: "#B2D8FF",
|
||||
TRANSFORMED_FILL: "rgba(200, 200, 200, .5)",
|
||||
TRANSFORMED_STROKE: "#B2D8FF",
|
||||
ARROW_STROKE: "#329AFF",
|
||||
ORIGIN_STROKE: "#329AFF",
|
||||
ARROW_TIP_HEIGHT: 10,
|
||||
ARROW_TIP_WIDTH: 8,
|
||||
CORNER_SIZE_RATIO: 6,
|
||||
|
||||
/**
|
||||
* Destroy removes the canvas from the parentelement passed in the constructor
|
||||
*/
|
||||
destroy: function() {
|
||||
if (this.canvas) {
|
||||
this.parentEl.removeChild(this.canvas);
|
||||
}
|
||||
if (this._hiddenDiv) {
|
||||
this.parentEl.removeChild(this._hiddenDiv);
|
||||
}
|
||||
this.parentEl = this.canvas = this.ctx = this.doc = null;
|
||||
},
|
||||
|
||||
_createMarkup: function() {
|
||||
this.canvas = this.doc.createElementNS(HTML_NS, "canvas");
|
||||
|
||||
this.canvas.setAttribute("id", "canvas");
|
||||
this.canvas.setAttribute("width", this.MAX_DIM);
|
||||
this.canvas.setAttribute("height", this.MAX_DIM);
|
||||
this.canvas.style.position = "relative";
|
||||
this.parentEl.appendChild(this.canvas);
|
||||
|
||||
this.ctx = this.canvas.getContext("2d");
|
||||
},
|
||||
|
||||
_getComputed: function(name, value, width, height) {
|
||||
if (!this._hiddenDiv) {
|
||||
// Create a hidden element to apply the style to
|
||||
this._hiddenDiv = this.doc.createElementNS(HTML_NS, "div");
|
||||
this._hiddenDiv.style.visibility = "hidden";
|
||||
this._hiddenDiv.style.position = "absolute";
|
||||
this.parentEl.appendChild(this._hiddenDiv);
|
||||
}
|
||||
|
||||
// Camelcase the name
|
||||
name = name.replace(/-([a-z]{1})/g, (m, letter) => letter.toUpperCase());
|
||||
|
||||
// Apply width and height to make sure computation is made correctly
|
||||
this._hiddenDiv.style.width = width + "px";
|
||||
this._hiddenDiv.style.height = height + "px";
|
||||
|
||||
// Show the hidden div, apply the style, read the computed style, hide the
|
||||
// hidden div again
|
||||
this._hiddenDiv.style.display = "block";
|
||||
this._hiddenDiv.style[name] = value;
|
||||
let computed = this.doc.defaultView.getComputedStyle(this._hiddenDiv);
|
||||
let computedValue = computed[name];
|
||||
this._hiddenDiv.style.display = "none";
|
||||
|
||||
return computedValue;
|
||||
},
|
||||
|
||||
_getMatrixFromTransformString: function(transformStr) {
|
||||
let matrix = transformStr.substring(0, transformStr.length - 1).
|
||||
substring(transformStr.indexOf("(") + 1).split(",");
|
||||
|
||||
matrix.forEach(function(value, index) {
|
||||
matrix[index] = parseFloat(value, 10);
|
||||
});
|
||||
|
||||
let transformMatrix = null;
|
||||
|
||||
if (matrix.length === 6) {
|
||||
// 2d transform
|
||||
transformMatrix = [
|
||||
[matrix[0], matrix[2], matrix[4], 0],
|
||||
[matrix[1], matrix[3], matrix[5], 0],
|
||||
[0, 0, 1, 0],
|
||||
[0, 0, 0, 1]
|
||||
];
|
||||
} else {
|
||||
// 3d transform
|
||||
transformMatrix = [
|
||||
[matrix[0], matrix[4], matrix[8], matrix[12]],
|
||||
[matrix[1], matrix[5], matrix[9], matrix[13]],
|
||||
[matrix[2], matrix[6], matrix[10], matrix[14]],
|
||||
[matrix[3], matrix[7], matrix[11], matrix[15]]
|
||||
];
|
||||
}
|
||||
|
||||
return transformMatrix;
|
||||
},
|
||||
|
||||
_getOriginFromOriginString: function(originStr) {
|
||||
let offsets = originStr.split(" ");
|
||||
offsets.forEach(function(item, index) {
|
||||
offsets[index] = parseInt(item, 10);
|
||||
});
|
||||
|
||||
return offsets;
|
||||
},
|
||||
|
||||
_multiply: function(m1, m2) {
|
||||
let m = [];
|
||||
for (let m1Line = 0; m1Line < m1.length; m1Line++) {
|
||||
m[m1Line] = 0;
|
||||
for (let m2Col = 0; m2Col < m2.length; m2Col++) {
|
||||
m[m1Line] += m1[m1Line][m2Col] * m2[m2Col];
|
||||
}
|
||||
}
|
||||
return [m[0], m[1]];
|
||||
},
|
||||
|
||||
_getTransformedPoint: function(matrix, point, origin) {
|
||||
let pointMatrix = [point[0] - origin[0], point[1] - origin[1], 1, 1];
|
||||
return this._multiply(matrix, pointMatrix);
|
||||
},
|
||||
|
||||
_getTransformedPoints: function(matrix, rect, origin) {
|
||||
return rect.map(point => {
|
||||
let tPoint = this._getTransformedPoint(matrix, [point[0], point[1]], origin);
|
||||
return [tPoint[0] + origin[0], tPoint[1] + origin[1]];
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* For canvas to avoid anti-aliasing
|
||||
*/
|
||||
_round: x => Math.round(x) + .5,
|
||||
|
||||
_drawShape: function(points, fillStyle, strokeStyle) {
|
||||
this.ctx.save();
|
||||
|
||||
this.ctx.lineWidth = 1;
|
||||
this.ctx.strokeStyle = strokeStyle;
|
||||
this.ctx.fillStyle = fillStyle;
|
||||
|
||||
this.ctx.beginPath();
|
||||
this.ctx.moveTo(this._round(points[0][0]), this._round(points[0][1]));
|
||||
for (var i = 1; i < points.length; i++) {
|
||||
this.ctx.lineTo(this._round(points[i][0]), this._round(points[i][1]));
|
||||
}
|
||||
this.ctx.lineTo(this._round(points[0][0]), this._round(points[0][1]));
|
||||
this.ctx.fill();
|
||||
this.ctx.stroke();
|
||||
|
||||
this.ctx.restore();
|
||||
},
|
||||
|
||||
_drawArrow: function(x1, y1, x2, y2) {
|
||||
// do not draw if the line is too small
|
||||
if (Math.abs(x2-x1) < 20 && Math.abs(y2-y1) < 20) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.ctx.save();
|
||||
|
||||
this.ctx.strokeStyle = this.ARROW_STROKE;
|
||||
this.ctx.fillStyle = this.ARROW_STROKE;
|
||||
this.ctx.lineWidth = 1;
|
||||
|
||||
this.ctx.beginPath();
|
||||
this.ctx.moveTo(this._round(x1), this._round(y1));
|
||||
this.ctx.lineTo(this._round(x2), this._round(y2));
|
||||
this.ctx.stroke();
|
||||
|
||||
this.ctx.beginPath();
|
||||
this.ctx.translate(x2, y2);
|
||||
let radians = Math.atan((y1 - y2) / (x1 - x2));
|
||||
radians += ((x1 >= x2) ? -90 : 90) * Math.PI / 180;
|
||||
this.ctx.rotate(radians);
|
||||
this.ctx.moveTo(0, 0);
|
||||
this.ctx.lineTo(this.ARROW_TIP_WIDTH / 2, this.ARROW_TIP_HEIGHT);
|
||||
this.ctx.lineTo(-this.ARROW_TIP_WIDTH / 2, this.ARROW_TIP_HEIGHT);
|
||||
this.ctx.closePath();
|
||||
this.ctx.fill();
|
||||
|
||||
this.ctx.restore();
|
||||
},
|
||||
|
||||
_drawOrigin: function(x, y) {
|
||||
this.ctx.save();
|
||||
|
||||
this.ctx.strokeStyle = this.ORIGIN_STROKE;
|
||||
this.ctx.fillStyle = this.ORIGIN_STROKE;
|
||||
|
||||
this.ctx.beginPath();
|
||||
this.ctx.arc(x, y, 4, 0, 2 * Math.PI, false);
|
||||
this.ctx.stroke();
|
||||
this.ctx.fill();
|
||||
|
||||
this.ctx.restore();
|
||||
},
|
||||
|
||||
/**
|
||||
* Computes the largest width and height of all the given shapes and changes
|
||||
* all of the shapes' points (by reference) so they fit into the configured
|
||||
* MAX_DIM - 2*PAD area.
|
||||
* @return {Object} A {w, h} giving the size the canvas should be
|
||||
*/
|
||||
_fitAllShapes: function(allShapes) {
|
||||
let allXs = [], allYs = [];
|
||||
for (let shape of allShapes) {
|
||||
for (let point of shape) {
|
||||
allXs.push(point[0]);
|
||||
allYs.push(point[1]);
|
||||
}
|
||||
}
|
||||
let minX = Math.min.apply(Math, allXs);
|
||||
let maxX = Math.max.apply(Math, allXs);
|
||||
let minY = Math.min.apply(Math, allYs);
|
||||
let maxY = Math.max.apply(Math, allYs);
|
||||
|
||||
let spanX = maxX - minX;
|
||||
let spanY = maxY - minY;
|
||||
let isWide = spanX > spanY;
|
||||
|
||||
let cw = isWide ? this.MAX_DIM :
|
||||
this.MAX_DIM * Math.min(spanX, spanY) / Math.max(spanX, spanY);
|
||||
let ch = !isWide ? this.MAX_DIM :
|
||||
this.MAX_DIM * Math.min(spanX, spanY) / Math.max(spanX, spanY);
|
||||
|
||||
let mapX = x => this.PAD + ((cw - 2 * this.PAD) / (maxX - minX)) * (x - minX);
|
||||
let mapY = y => this.PAD + ((ch - 2 * this.PAD) / (maxY - minY)) * (y - minY);
|
||||
|
||||
for (let shape of allShapes) {
|
||||
for (let point of shape) {
|
||||
point[0] = mapX(point[0]);
|
||||
point[1] = mapY(point[1]);
|
||||
}
|
||||
}
|
||||
|
||||
return {w: cw, h: ch};
|
||||
},
|
||||
|
||||
_drawShapes: function(shape, corner, transformed, transformedCorner) {
|
||||
this._drawOriginal(shape);
|
||||
this._drawOriginalCorner(corner);
|
||||
this._drawTransformed(transformed);
|
||||
this._drawTransformedCorner(transformedCorner);
|
||||
},
|
||||
|
||||
_drawOriginal: function(points) {
|
||||
this._drawShape(points, this.ORIGINAL_FILL, this.ORIGINAL_STROKE);
|
||||
},
|
||||
|
||||
_drawTransformed: function(points) {
|
||||
this._drawShape(points, this.TRANSFORMED_FILL, this.TRANSFORMED_STROKE);
|
||||
},
|
||||
|
||||
_drawOriginalCorner: function(points) {
|
||||
this._drawShape(points, this.ORIGINAL_STROKE, this.ORIGINAL_STROKE);
|
||||
},
|
||||
|
||||
_drawTransformedCorner: function(points) {
|
||||
this._drawShape(points, this.TRANSFORMED_STROKE, this.TRANSFORMED_STROKE);
|
||||
},
|
||||
|
||||
_drawArrows: function(shape, transformed) {
|
||||
this._drawArrow(shape[0][0], shape[0][1], transformed[0][0], transformed[0][1]);
|
||||
this._drawArrow(shape[1][0], shape[1][1], transformed[1][0], transformed[1][1]);
|
||||
this._drawArrow(shape[2][0], shape[2][1], transformed[2][0], transformed[2][1]);
|
||||
this._drawArrow(shape[3][0], shape[3][1], transformed[3][0], transformed[3][1]);
|
||||
},
|
||||
|
||||
/**
|
||||
* Draw a transform preview
|
||||
*
|
||||
* @param {String} transform
|
||||
* The css transform value as a string, as typed by the user, as long
|
||||
* as it can be computed by the browser
|
||||
* @param {String} origin
|
||||
* Same as above for the transform-origin value. Defaults to "center"
|
||||
* @param {Number} width
|
||||
* The width of the container. Defaults to 200
|
||||
* @param {Number} height
|
||||
* The height of the container. Defaults to 200
|
||||
* @return {Boolean} Whether or not the preview could be created. Will return
|
||||
* false for instance if the transform is invalid
|
||||
*/
|
||||
preview: function(transform, origin="center", width=200, height=200) {
|
||||
// Create/clear the canvas
|
||||
if (!this.canvas) {
|
||||
this._createMarkup();
|
||||
}
|
||||
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
|
||||
// Get computed versions of transform and origin
|
||||
transform = this._getComputed("transform", transform, width, height);
|
||||
if (transform && transform !== "none") {
|
||||
origin = this._getComputed("transform-origin", origin, width, height);
|
||||
|
||||
// Get the matrix, origin and width height data for the previewed element
|
||||
let originData = this._getOriginFromOriginString(origin);
|
||||
let matrixData = this._getMatrixFromTransformString(transform);
|
||||
|
||||
// Compute the original box rect and transformed box rect
|
||||
let shapePoints = [
|
||||
[0, 0],
|
||||
[width, 0],
|
||||
[width, height],
|
||||
[0, height]
|
||||
];
|
||||
let transformedPoints = this._getTransformedPoints(matrixData, shapePoints, originData);
|
||||
|
||||
// Do the same for the corner triangle shape
|
||||
let cornerSize = Math.min(shapePoints[2][1] - shapePoints[1][1],
|
||||
shapePoints[1][0] - shapePoints[0][0]) / this.CORNER_SIZE_RATIO;
|
||||
let cornerPoints = [
|
||||
[shapePoints[1][0], shapePoints[1][1]],
|
||||
[shapePoints[1][0], shapePoints[1][1] + cornerSize],
|
||||
[shapePoints[1][0] - cornerSize, shapePoints[1][1]]
|
||||
];
|
||||
let transformedCornerPoints = this._getTransformedPoints(matrixData, cornerPoints, originData);
|
||||
|
||||
// Resize points to fit everything in the canvas
|
||||
let {w, h} = this._fitAllShapes([
|
||||
shapePoints,
|
||||
transformedPoints,
|
||||
cornerPoints,
|
||||
transformedCornerPoints,
|
||||
[originData]
|
||||
]);
|
||||
|
||||
this.canvas.setAttribute("width", w);
|
||||
this.canvas.setAttribute("height", h);
|
||||
|
||||
this._drawShapes(shapePoints, cornerPoints, transformedPoints, transformedCornerPoints)
|
||||
this._drawArrows(shapePoints, transformedPoints);
|
||||
this._drawOrigin(originData[0], originData[1]);
|
||||
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
};
|
@ -12,6 +12,7 @@ const {Spectrum} = require("devtools/shared/widgets/Spectrum");
|
||||
const EventEmitter = require("devtools/shared/event-emitter");
|
||||
const {colorUtils} = require("devtools/css-color");
|
||||
const Heritage = require("sdk/core/heritage");
|
||||
const {CSSTransformPreviewer} = require("devtools/shared/widgets/CSSTransformPreviewer");
|
||||
|
||||
Cu.import("resource://gre/modules/Services.jsm");
|
||||
Cu.import("resource://gre/modules/XPCOMUtils.jsm");
|
||||
@ -100,7 +101,6 @@ let PanelFactory = {
|
||||
panel.setAttribute("hidden", true);
|
||||
panel.setAttribute("ignorekeys", true);
|
||||
|
||||
// Prevent the click used to close the panel from being consumed
|
||||
panel.setAttribute("consumeoutsideclicks", options.get("consumeOutsideClick"));
|
||||
panel.setAttribute("noautofocus", options.get("noAutoFocus"));
|
||||
panel.setAttribute("type", "arrow");
|
||||
@ -229,6 +229,10 @@ Tooltip.prototype = {
|
||||
return this.panel.state !== "closed" && this.panel.state !== "hiding";
|
||||
},
|
||||
|
||||
setSize: function(width, height) {
|
||||
this.panel.sizeTo(width, height);
|
||||
},
|
||||
|
||||
/**
|
||||
* Empty the tooltip's content
|
||||
*/
|
||||
@ -304,7 +308,8 @@ Tooltip.prototype = {
|
||||
* The container for all target nodes
|
||||
* @param {Function} targetNodeCb
|
||||
* A function that accepts a node argument and returns true or false
|
||||
* to signify if the tooltip should be shown on that node or not.
|
||||
* (or a promise that resolves or rejects) to signify if the tooltip
|
||||
* should be shown on that node or not.
|
||||
* Additionally, the function receives a second argument which is the
|
||||
* tooltip instance itself, to be used to add/modify the content of the
|
||||
* tooltip if needed. If omitted, the tooltip will be shown everytime.
|
||||
@ -312,7 +317,7 @@ Tooltip.prototype = {
|
||||
* An optional delay that will be observed before showing the tooltip.
|
||||
* Defaults to this.defaultShowDelay.
|
||||
*/
|
||||
startTogglingOnHover: function(baseNode, targetNodeCb, showDelay = this.defaultShowDelay) {
|
||||
startTogglingOnHover: function(baseNode, targetNodeCb, showDelay=this.defaultShowDelay) {
|
||||
if (this._basedNode) {
|
||||
this.stopTogglingOnHover();
|
||||
}
|
||||
@ -357,7 +362,12 @@ Tooltip.prototype = {
|
||||
},
|
||||
|
||||
_showOnHover: function(target) {
|
||||
if (this._targetNodeCb(target, this)) {
|
||||
let res = this._targetNodeCb(target, this);
|
||||
if (res && res.then) {
|
||||
res.then(() => {
|
||||
this.show(target);
|
||||
});
|
||||
} else if (res) {
|
||||
this.show(target);
|
||||
}
|
||||
},
|
||||
@ -527,6 +537,8 @@ Tooltip.prototype = {
|
||||
let w = options.naturalWidth || imgObj.naturalWidth;
|
||||
let h = options.naturalHeight || imgObj.naturalHeight;
|
||||
label.textContent = w + " x " + h;
|
||||
|
||||
this.setSize(vbox.width, vbox.height);
|
||||
}
|
||||
},
|
||||
|
||||
@ -583,6 +595,54 @@ Tooltip.prototype = {
|
||||
// Put the iframe in the tooltip
|
||||
this.content = iframe;
|
||||
|
||||
return def.promise;
|
||||
},
|
||||
|
||||
/**
|
||||
* Set the content of the tooltip to be the result of CSSTransformPreviewer.
|
||||
* Meaning a canvas previewing a css transformation.
|
||||
*
|
||||
* @param {String} transform
|
||||
* The CSS transform value (e.g. "rotate(45deg) translateX(50px)")
|
||||
* @param {PageStyleActor} pageStyle
|
||||
* An instance of the PageStyleActor that will be used to retrieve
|
||||
* computed styles
|
||||
* @param {NodeActor} node
|
||||
* The NodeActor for the currently selected node
|
||||
* @return A promise that resolves when the tooltip content is ready, or
|
||||
* rejects if no transform is provided or is invalid
|
||||
*/
|
||||
setCssTransformContent: function(transform, pageStyle, node) {
|
||||
let def = promise.defer();
|
||||
|
||||
if (transform) {
|
||||
// Look into the computed styles to find the width and height and possibly
|
||||
// the origin if it hadn't been provided
|
||||
pageStyle.getComputed(node, {
|
||||
filter: "user",
|
||||
markMatched: false,
|
||||
onlyMatched: false
|
||||
}).then(styles => {
|
||||
let origin = styles["transform-origin"].value;
|
||||
let width = parseInt(styles["width"].value);
|
||||
let height = parseInt(styles["height"].value);
|
||||
|
||||
let root = this.doc.createElementNS(XHTML_NS, "div");
|
||||
let previewer = new CSSTransformPreviewer(root);
|
||||
this.content = root;
|
||||
if (!previewer.preview(transform, origin, width, height)) {
|
||||
// If the preview didn't work, reject the promise
|
||||
def.reject();
|
||||
} else {
|
||||
// Else, make sure the tooltip has the right size and resolve
|
||||
this.setSize(previewer.canvas.width, previewer.canvas.height);
|
||||
def.resolve();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
def.reject();
|
||||
}
|
||||
|
||||
return def.promise;
|
||||
}
|
||||
};
|
||||
|
@ -505,21 +505,27 @@ CssHtmlTree.prototype = {
|
||||
*/
|
||||
_buildTooltipContent: function(target)
|
||||
{
|
||||
// If the hovered element is not a property view and is not a background
|
||||
// image, then don't show a tooltip
|
||||
let isPropertyValue = target.classList.contains("property-value");
|
||||
if (!isPropertyValue) {
|
||||
return false;
|
||||
}
|
||||
let propName = target.parentNode.querySelector(".property-name");
|
||||
let isBackgroundImage = propName.textContent === "background-image";
|
||||
if (!isBackgroundImage) {
|
||||
return false;
|
||||
// Test for image url
|
||||
if (target.classList.contains("theme-link")) {
|
||||
let propValue = target.parentNode;
|
||||
let propName = propValue.parentNode.querySelector(".property-name");
|
||||
if (propName.textContent === "background-image") {
|
||||
this.tooltip.setCssBackgroundImageContent(propValue.textContent);
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
// Fill some content
|
||||
this.tooltip.setCssBackgroundImageContent(target.textContent);
|
||||
return true;
|
||||
// Test for css transform
|
||||
if (target.classList.contains("property-value")) {
|
||||
let def = promise.defer();
|
||||
let propValue = target;
|
||||
let propName = target.parentNode.querySelector(".property-name");
|
||||
if (propName.textContent === "transform") {
|
||||
this.tooltip.setCssTransformContent(propValue.textContent,
|
||||
this.pageStyle, this.viewedElement).then(def.resolve);
|
||||
return def.promise;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -1125,27 +1125,32 @@ CssRuleView.prototype = {
|
||||
* prepare some content for the tooltip
|
||||
*/
|
||||
_buildTooltipContent: function(target) {
|
||||
let isImageHref = target.classList.contains("theme-link") &&
|
||||
target.parentNode.classList.contains("ruleview-propertyvalue");
|
||||
let property = target.textProperty, def = promise.defer(), hasTooltip = false;
|
||||
|
||||
// If the inplace-editor is visible or if this is not a background image
|
||||
// don't show the tooltip
|
||||
if (!isImageHref) {
|
||||
return false;
|
||||
// Test for css transform
|
||||
if (property && property.name === "transform") {
|
||||
this.previewTooltip.setCssTransformContent(property.value, this.pageStyle,
|
||||
this._viewedElement).then(def.resolve);
|
||||
hasTooltip = true;
|
||||
}
|
||||
|
||||
// Retrieve the TextProperty for the hovered element
|
||||
let property = target.parentNode.textProperty;
|
||||
let href = property.rule.domRule.href;
|
||||
// Test for image
|
||||
let isImageHref = target.classList.contains("theme-link") &&
|
||||
target.parentNode.classList.contains("ruleview-propertyvalue");
|
||||
if (isImageHref) {
|
||||
property = target.parentNode.textProperty;
|
||||
this.previewTooltip.setCssBackgroundImageContent(property.value,
|
||||
property.rule.domRule.href);
|
||||
def.resolve();
|
||||
hasTooltip = true;
|
||||
}
|
||||
|
||||
// Fill some content
|
||||
this.previewTooltip.setCssBackgroundImageContent(property.value, href);
|
||||
if (hasTooltip) {
|
||||
this.colorPicker.revert();
|
||||
this.colorPicker.hide();
|
||||
}
|
||||
|
||||
// Hide the color picker tooltip if shown and revert changes
|
||||
this.colorPicker.revert();
|
||||
this.colorPicker.hide();
|
||||
|
||||
return true;
|
||||
return def.promise;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -1301,7 +1306,7 @@ CssRuleView.prototype = {
|
||||
/**
|
||||
* Update the highlighted element.
|
||||
*
|
||||
* @param {nsIDOMElement} aElement
|
||||
* @param {NodeActor} aElement
|
||||
* The node whose style rules we'll inspect.
|
||||
*/
|
||||
highlight: function CssRuleView_highlight(aElement)
|
||||
|
@ -53,4 +53,6 @@ support-files = browser_ruleview_pseudoelement.html
|
||||
[browser_bug913014_matched_expand.js]
|
||||
[browser_bug765105_background_image_tooltip.js]
|
||||
[browser_bug889638_rule_view_color_picker.js]
|
||||
[browser_bug726427_csstransform_tooltip.js]
|
||||
|
||||
[browser_bug940500_rule_view_pick_gradient_color.js]
|
||||
|
@ -0,0 +1,224 @@
|
||||
/* vim: set ts=2 et sw=2 tw=80: */
|
||||
/* Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/ */
|
||||
|
||||
let contentDoc;
|
||||
let inspector;
|
||||
let ruleView;
|
||||
let computedView;
|
||||
|
||||
const PAGE_CONTENT = [
|
||||
'<style type="text/css">',
|
||||
' #testElement {',
|
||||
' width: 500px;',
|
||||
' height: 300px;',
|
||||
' background: red;',
|
||||
' transform: skew(16deg);',
|
||||
' }',
|
||||
' .test-element {',
|
||||
' transform-origin: top left;',
|
||||
' transform: rotate(45deg);',
|
||||
' }',
|
||||
' div {',
|
||||
' transform: scaleX(1.5);',
|
||||
' transform-origin: bottom right;',
|
||||
' }',
|
||||
' [attr] {',
|
||||
' }',
|
||||
'</style>',
|
||||
'<div id="testElement" class="test-element" attr="value">transformed element</div>'
|
||||
].join("\n");
|
||||
|
||||
function test() {
|
||||
waitForExplicitFinish();
|
||||
|
||||
gBrowser.selectedTab = gBrowser.addTab();
|
||||
gBrowser.selectedBrowser.addEventListener("load", function(evt) {
|
||||
gBrowser.selectedBrowser.removeEventListener(evt.type, arguments.callee, true);
|
||||
contentDoc = content.document;
|
||||
waitForFocus(createDocument, content);
|
||||
}, true);
|
||||
|
||||
content.location = "data:text/html,rule view css transform tooltip test";
|
||||
}
|
||||
|
||||
function createDocument() {
|
||||
contentDoc.body.innerHTML = PAGE_CONTENT;
|
||||
|
||||
openRuleView((aInspector, aRuleView) => {
|
||||
inspector = aInspector;
|
||||
ruleView = aRuleView;
|
||||
startTests();
|
||||
});
|
||||
}
|
||||
|
||||
function startTests() {
|
||||
inspector.selection.setNode(contentDoc.querySelector("#testElement"));
|
||||
inspector.once("inspector-updated", testTransformTooltipOnIDSelector);
|
||||
}
|
||||
|
||||
function endTests() {
|
||||
contentDoc = inspector = ruleView = computedView = null;
|
||||
gBrowser.removeCurrentTab();
|
||||
finish();
|
||||
}
|
||||
|
||||
function testTransformTooltipOnIDSelector() {
|
||||
info("Testing that a transform tooltip appears on the #ID rule");
|
||||
|
||||
let panel = ruleView.previewTooltip.panel;
|
||||
ok(panel, "The XUL panel exists for the rule-view preview tooltips");
|
||||
|
||||
let {valueSpan} = getRuleViewProperty("#testElement", "transform");
|
||||
assertTooltipShownOn(ruleView.previewTooltip, valueSpan, () => {
|
||||
// The transform preview is canvas, so there's not much we can test, so for
|
||||
// now, let's just be happy with the fact that the tooltips is shown!
|
||||
ok(true, "Tooltip shown on the transform property of the #ID rule");
|
||||
ruleView.previewTooltip.hide();
|
||||
executeSoon(testTransformTooltipOnClassSelector);
|
||||
});
|
||||
}
|
||||
|
||||
function testTransformTooltipOnClassSelector() {
|
||||
info("Testing that a transform tooltip appears on the .class rule");
|
||||
|
||||
let {valueSpan} = getRuleViewProperty(".test-element", "transform");
|
||||
assertTooltipShownOn(ruleView.previewTooltip, valueSpan, () => {
|
||||
// The transform preview is canvas, so there's not much we can test, so for
|
||||
// now, let's just be happy with the fact that the tooltips is shown!
|
||||
ok(true, "Tooltip shown on the transform property of the .class rule");
|
||||
ruleView.previewTooltip.hide();
|
||||
executeSoon(testTransformTooltipOnTagSelector);
|
||||
});
|
||||
}
|
||||
|
||||
function testTransformTooltipOnTagSelector() {
|
||||
info("Testing that a transform tooltip appears on the tag rule");
|
||||
|
||||
let {valueSpan} = getRuleViewProperty("div", "transform");
|
||||
assertTooltipShownOn(ruleView.previewTooltip, valueSpan, () => {
|
||||
// The transform preview is canvas, so there's not much we can test, so for
|
||||
// now, let's just be happy with the fact that the tooltips is shown!
|
||||
ok(true, "Tooltip shown on the transform property of the tag rule");
|
||||
ruleView.previewTooltip.hide();
|
||||
executeSoon(testTransformTooltipNotShownOnInvalidTransform);
|
||||
});
|
||||
}
|
||||
|
||||
function testTransformTooltipNotShownOnInvalidTransform() {
|
||||
info("Testing that a transform tooltip does not appear for invalid values");
|
||||
|
||||
// This is the list of keys to type in the inplace-editor
|
||||
let keyData = "transform".split("");
|
||||
keyData.push("VK_TAB");
|
||||
keyData = keyData.concat("muchTransform(suchAngle)".split(""));
|
||||
keyData.push("VK_RETURN");
|
||||
|
||||
// Focus the inplace editor
|
||||
let rule = getRule("[attr]");
|
||||
let brace = rule.querySelector(".ruleview-ruleclose");
|
||||
waitForEditorFocus(brace.parentNode, editor => {
|
||||
// Enter an invalid value
|
||||
typeKeySequence(keyData, () => {
|
||||
let {valueSpan} = getRuleViewProperty("[attr]", "transform");
|
||||
assertTooltipNotShownOn(ruleView.previewTooltip, valueSpan, () => {
|
||||
executeSoon(testTransformTooltipOnComputedView);
|
||||
});
|
||||
});
|
||||
});
|
||||
brace.click();
|
||||
}
|
||||
|
||||
function testTransformTooltipOnComputedView() {
|
||||
info("Testing that a transform tooltip appears in the computed view too");
|
||||
|
||||
inspector.sidebar.select("computedview");
|
||||
computedView = inspector.sidebar.getWindowForTab("computedview").computedview.view;
|
||||
let doc = computedView.styleDocument;
|
||||
|
||||
let panel = computedView.tooltip.panel;
|
||||
let {valueSpan} = getComputedViewProperty("transform");
|
||||
|
||||
assertTooltipShownOn(computedView.tooltip, valueSpan, () => {
|
||||
// The transform preview is canvas, so there's not much we can test, so for
|
||||
// now, let's just be happy with the fact that the tooltips is shown!
|
||||
ok(true, "Tooltip shown on the computed transform property");
|
||||
computedView.tooltip.hide();
|
||||
executeSoon(endTests);
|
||||
});
|
||||
}
|
||||
|
||||
function assertTooltipShownOn(tooltip, element, cb) {
|
||||
// If there is indeed a show-on-hover on element, the xul panel will be shown
|
||||
tooltip.panel.addEventListener("popupshown", function shown() {
|
||||
tooltip.panel.removeEventListener("popupshown", shown, true);
|
||||
cb();
|
||||
}, true);
|
||||
tooltip._showOnHover(element);
|
||||
}
|
||||
|
||||
function assertTooltipNotShownOn(tooltip, element, cb) {
|
||||
// The only way to make sure the tooltip is not shown is try and show it, wait
|
||||
// for a given amount of time, and then check if it's shown or not
|
||||
tooltip._showOnHover(element);
|
||||
setTimeout(() => {
|
||||
ok(!tooltip.isShown(), "The tooltip did not appear on hover of the element");
|
||||
cb();
|
||||
}, tooltip.defaultShowDelay + 100);
|
||||
}
|
||||
|
||||
function typeKeySequence(sequence, cb, index=0) {
|
||||
if (index === sequence.length) {
|
||||
return cb();
|
||||
}
|
||||
|
||||
EventUtils.synthesizeKey(sequence[index], {}, ruleView.doc.defaultView);
|
||||
executeSoon(() => {
|
||||
typeKeySequence(sequence, cb, index + 1);
|
||||
});
|
||||
}
|
||||
|
||||
function getRule(selectorText) {
|
||||
let rule;
|
||||
|
||||
[].forEach.call(ruleView.doc.querySelectorAll(".ruleview-rule"), aRule => {
|
||||
let selector = aRule.querySelector(".ruleview-selector-matched");
|
||||
if (selector && selector.textContent === selectorText) {
|
||||
rule = aRule;
|
||||
}
|
||||
});
|
||||
|
||||
return rule;
|
||||
}
|
||||
|
||||
function getRuleViewProperty(selectorText, propertyName) {
|
||||
let prop;
|
||||
|
||||
let rule = getRule(selectorText);
|
||||
if (rule) {
|
||||
// Look for the propertyName in that rule element
|
||||
[].forEach.call(rule.querySelectorAll(".ruleview-property"), property => {
|
||||
let nameSpan = property.querySelector(".ruleview-propertyname");
|
||||
let valueSpan = property.querySelector(".ruleview-propertyvalue");
|
||||
|
||||
if (nameSpan.textContent === propertyName) {
|
||||
prop = {nameSpan: nameSpan, valueSpan: valueSpan};
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return prop;
|
||||
}
|
||||
|
||||
function getComputedViewProperty(name) {
|
||||
let prop;
|
||||
[].forEach.call(computedView.styleDocument.querySelectorAll(".property-view"), property => {
|
||||
let nameSpan = property.querySelector(".property-name");
|
||||
let valueSpan = property.querySelector(".property-value");
|
||||
|
||||
if (nameSpan.textContent === name) {
|
||||
prop = {nameSpan: nameSpan, valueSpan: valueSpan};
|
||||
}
|
||||
});
|
||||
return prop;
|
||||
}
|
@ -142,8 +142,9 @@ function testComputedView() {
|
||||
|
||||
let panel = computedView.tooltip.panel;
|
||||
let {valueSpan} = getComputedViewProperty("background-image");
|
||||
let uriSpan = valueSpan.querySelector(".theme-link");
|
||||
|
||||
assertTooltipShownOn(computedView.tooltip, valueSpan, () => {
|
||||
assertTooltipShownOn(computedView.tooltip, uriSpan, () => {
|
||||
let images = panel.getElementsByTagName("image");
|
||||
is(images.length, 1, "Tooltip contains an image");
|
||||
ok(images[0].src === "chrome://global/skin/icons/warning-64.png");
|
||||
|
@ -31,9 +31,9 @@ add-ons-button.label = Add-ons
|
||||
# LOCALIZATION NOTE(add-ons-button.tooltiptext): %S is the keyboard shortcut
|
||||
add-ons-button.tooltiptext = Add-ons Manager (%S)
|
||||
|
||||
switch-to-metro-button.label = Windows 8 Touch
|
||||
# LOCALIZATION NOTE(switch-to-metro-button.tooltiptext): %S is the brand short name
|
||||
switch-to-metro-button.tooltiptext = Relaunch in %S for Windows 8 Touch
|
||||
switch-to-metro-button2.label = Windows 8 Touch
|
||||
# LOCALIZATION NOTE(switch-to-metro-button2.tooltiptext): %S is the brand short name
|
||||
switch-to-metro-button2.tooltiptext = Relaunch in %S for Windows 8 Touch
|
||||
|
||||
preferences-button.label = Preferences
|
||||
# LOCALIZATION NOTE (preferences-button.tooltiptext): Use the unicode ellipsis char,
|
||||
|
@ -208,10 +208,6 @@ var BrowserUI = {
|
||||
DebuggerServer.init();
|
||||
DebuggerServer.addBrowserActors();
|
||||
DebuggerServer.addActors('chrome://browser/content/dbg-metro-actors.js');
|
||||
|
||||
// Add these globally for chrome, until per-window chrome debugging is supported (bug 928018):
|
||||
DebuggerServer.addGlobalActor(DebuggerServer.tabActorFactories.inspectorActor, "inspectorActor");
|
||||
DebuggerServer.addGlobalActor(DebuggerServer.tabActorFactories.styleEditorActor, "styleEditorActor");
|
||||
}
|
||||
DebuggerServer.openListener(port);
|
||||
},
|
||||
|
@ -276,7 +276,7 @@ Desktop browser's sync prefs.
|
||||
</hbox>
|
||||
|
||||
<hbox id="toolbar-context-autocomplete" pack="end">
|
||||
<toolbarbutton id="close-button" class="appbar-secondary"
|
||||
<toolbarbutton id="close-button" class="appbar-primary"
|
||||
oncommand="Appbar.onAutocompleteCloseButton()"/>
|
||||
</hbox>
|
||||
</stack>
|
||||
@ -362,19 +362,22 @@ Desktop browser's sync prefs.
|
||||
<!-- Context button bar -->
|
||||
<appbar id="contextappbar">
|
||||
<toolbar id="contextualactions-tray" labelled="true" flex="1">
|
||||
<toolbarbutton id="pin-selected-button" class="appbar-secondary"
|
||||
<toolbarbutton id="pin-selected-button" class="appbar-primary"
|
||||
label-uses-set-name="true" hidden="true" fade="true"
|
||||
oncommand="Appbar.dispatchContextualAction('pin')"/>
|
||||
<toolbarbutton id="unpin-selected-button" class="appbar-secondary"
|
||||
<toolbarbutton id="unpin-selected-button" class="appbar-primary"
|
||||
label-uses-set-name="true" hidden="true" fade="true"
|
||||
oncommand="Appbar.dispatchContextualAction('unpin')"/>
|
||||
<toolbarbutton id="delete-selected-button" class="appbar-secondary"
|
||||
<toolbarbutton id="hide-selected-button" class="appbar-primary"
|
||||
label-uses-set-name="true" hidden="true" fade="true"
|
||||
oncommand="Appbar.dispatchContextualAction('unpin')"/>
|
||||
<toolbarbutton id="delete-selected-button" class="appbar-primary"
|
||||
hidden="true" fade="true"
|
||||
oncommand="Appbar.dispatchContextualAction('delete')"/>
|
||||
<toolbarbutton id="restore-selected-button" class="appbar-secondary"
|
||||
<toolbarbutton id="restore-selected-button" class="appbar-primary"
|
||||
hidden="true" fade="true"
|
||||
oncommand="Appbar.dispatchContextualAction('restore')"/>
|
||||
<toolbarbutton id="clear-selected-button" class="appbar-secondary"
|
||||
<toolbarbutton id="clear-selected-button" class="appbar-primary"
|
||||
hidden="true" fade="true"
|
||||
oncommand="Appbar.dispatchContextualAction('clear')"/>
|
||||
</toolbar>
|
||||
|
@ -170,7 +170,7 @@ BookmarksView.prototype = Util.extend(Object.create(View.prototype), {
|
||||
|
||||
_setContextActions: function bv__setContextActions(aItem) {
|
||||
let itemId = this._getBookmarkIdForItem(aItem);
|
||||
aItem.setAttribute("data-contextactions", "delete," + (this._pinHelper.isPinned(itemId) ? "unpin" : "pin"));
|
||||
aItem.setAttribute("data-contextactions", "delete," + (this._pinHelper.isPinned(itemId) ? "hide" : "pin"));
|
||||
if (aItem.refresh) aItem.refresh();
|
||||
},
|
||||
|
||||
|
@ -107,7 +107,7 @@ HistoryView.prototype = Util.extend(Object.create(View.prototype), {
|
||||
|
||||
_setContextActions: function bv__setContextActions(aItem) {
|
||||
let uri = aItem.getAttribute("value");
|
||||
aItem.setAttribute("data-contextactions", "delete," + (this._pinHelper.isPinned(uri) ? "unpin" : "pin"));
|
||||
aItem.setAttribute("data-contextactions", "delete," + (this._pinHelper.isPinned(uri) ? "hide" : "pin"));
|
||||
if ("refresh" in aItem) aItem.refresh();
|
||||
},
|
||||
|
||||
|
@ -32,13 +32,13 @@ function tearDown() {
|
||||
}
|
||||
|
||||
gTests.push({
|
||||
desc: "Test bookmarks StartUI unpin",
|
||||
desc: "Test bookmarks StartUI hide",
|
||||
setUp: setup,
|
||||
tearDown: tearDown,
|
||||
run: function testBookmarksStartUnpin() {
|
||||
let unpinButton = document.getElementById("unpin-selected-button");
|
||||
run: function testBookmarksStartHide() {
|
||||
let hideButton = document.getElementById("hide-selected-button");
|
||||
|
||||
// --------- unpin item 2
|
||||
// --------- hide item 2
|
||||
|
||||
let item = gStartView._getItemForBookmarkId(2);
|
||||
|
||||
@ -46,19 +46,19 @@ gTests.push({
|
||||
sendContextMenuClickToElement(window, item, 10, 10);
|
||||
yield promise;
|
||||
|
||||
ok(!unpinButton.hidden, "Unpin button is visible.");
|
||||
ok(!hideButton.hidden, "Hide button is visible.");
|
||||
|
||||
let promise = waitForEvent(Elements.contextappbar, "transitionend", null, Elements.contextappbar);
|
||||
unpinButton.click();
|
||||
hideButton.click();
|
||||
yield promise;
|
||||
|
||||
item = gStartView._getItemForBookmarkId(2);
|
||||
|
||||
ok(!item, "Item not in grid");
|
||||
ok(!gStartView._pinHelper.isPinned(2), "Item unpinned");
|
||||
ok(!gStartView._pinHelper.isPinned(2), "Item hidden");
|
||||
ok(gStartView._set.itemCount === gStartView._limit, "Grid repopulated");
|
||||
|
||||
// --------- unpin multiple items
|
||||
// --------- hide multiple items
|
||||
|
||||
let item1 = gStartView._getItemForBookmarkId(0);
|
||||
let item2 = gStartView._getItemForBookmarkId(5);
|
||||
@ -70,10 +70,10 @@ gTests.push({
|
||||
sendContextMenuClickToElement(window, item3, 10, 10);
|
||||
yield promise;
|
||||
|
||||
ok(!unpinButton.hidden, "Unpin button is visible.");
|
||||
ok(!hideButton.hidden, "Hide button is visible.");
|
||||
|
||||
let promise = waitForEvent(Elements.contextappbar, "transitionend", null, Elements.contextappbar);
|
||||
EventUtils.synthesizeMouse(unpinButton, 10, 10, {}, window);
|
||||
EventUtils.synthesizeMouse(hideButton, 10, 10, {}, window);
|
||||
yield promise;
|
||||
|
||||
item1 = gStartView._getItemForBookmarkId(0);
|
||||
@ -81,7 +81,7 @@ gTests.push({
|
||||
item3 = gStartView._getItemForBookmarkId(12);
|
||||
|
||||
ok(!item1 && !item2 && !item3, "Items are not in grid");
|
||||
ok(!gStartView._pinHelper.isPinned(0) && !gStartView._pinHelper.isPinned(5) && !gStartView._pinHelper.isPinned(12) , "Items unpinned");
|
||||
ok(!gStartView._pinHelper.isPinned(0) && !gStartView._pinHelper.isPinned(5) && !gStartView._pinHelper.isPinned(12) , "Items hidden");
|
||||
ok(gStartView._set.itemCount === gStartView._limit - 1, "Grid repopulated");
|
||||
}
|
||||
});
|
||||
|
@ -43,13 +43,13 @@ function uriFromIndex(aIndex) {
|
||||
}
|
||||
|
||||
gTests.push({
|
||||
desc: "Test history StartUI unpin",
|
||||
desc: "Test history StartUI hide",
|
||||
setUp: setup,
|
||||
tearDown: tearDown,
|
||||
run: function testHistoryStartUnpin() {
|
||||
let unpinButton = document.getElementById("unpin-selected-button");
|
||||
run: function testHistoryStartHide() {
|
||||
let hideButton = document.getElementById("hide-selected-button");
|
||||
|
||||
// --------- unpin item 2
|
||||
// --------- hide item 2
|
||||
|
||||
let item = gStartView._set.getItemsByUrl(uriFromIndex(2))[0];
|
||||
|
||||
@ -57,19 +57,19 @@ gTests.push({
|
||||
sendContextMenuClickToElement(window, item, 10, 10);
|
||||
yield promise;
|
||||
|
||||
ok(!unpinButton.hidden, "Unpin button is visible.");
|
||||
ok(!hideButton.hidden, "Hide button is visible.");
|
||||
|
||||
let promise = waitForEvent(Elements.contextappbar, "transitionend", null, Elements.contextappbar);
|
||||
unpinButton.click();
|
||||
hideButton.click();
|
||||
yield promise;
|
||||
|
||||
item = gStartView._set.getItemsByUrl(uriFromIndex(2))[0];
|
||||
|
||||
ok(!item, "Item not in grid");
|
||||
ok(!gStartView._pinHelper.isPinned(uriFromIndex(2)), "Item unpinned");
|
||||
ok(!gStartView._pinHelper.isPinned(uriFromIndex(2)), "Item hidden");
|
||||
is(gStartView._set.itemCount, gStartView._limit, "Grid repopulated");
|
||||
|
||||
// --------- unpin multiple items
|
||||
// --------- hide multiple items
|
||||
|
||||
let item1 = gStartView._set.getItemsByUrl(uriFromIndex(0))[0];
|
||||
let item2 = gStartView._set.getItemsByUrl(uriFromIndex(5))[0];
|
||||
@ -82,10 +82,10 @@ gTests.push({
|
||||
sendContextMenuClickToElement(window, item3, 10, 10);
|
||||
yield promise;
|
||||
|
||||
ok(!unpinButton.hidden, "Unpin button is visible.");
|
||||
ok(!hideButton.hidden, "Hide button is visible.");
|
||||
|
||||
let promise = waitForEvent(Elements.contextappbar, "transitionend", null, Elements.contextappbar);
|
||||
EventUtils.synthesizeMouse(unpinButton, 10, 10, {}, window);
|
||||
EventUtils.synthesizeMouse(hideButton, 10, 10, {}, window);
|
||||
yield promise;
|
||||
|
||||
item1 = gStartView._set.getItemsByUrl(uriFromIndex(0))[0];
|
||||
@ -93,7 +93,7 @@ gTests.push({
|
||||
item3 = gStartView._set.getItemsByUrl(uriFromIndex(12))[0];
|
||||
|
||||
ok(!item1 && !item2 && !item3, "Items are not in grid");
|
||||
ok(!gStartView._pinHelper.isPinned(uriFromIndex(0)) && !gStartView._pinHelper.isPinned(uriFromIndex(5)) && !gStartView._pinHelper.isPinned(uriFromIndex(12)) , "Items unpinned");
|
||||
ok(!gStartView._pinHelper.isPinned(uriFromIndex(0)) && !gStartView._pinHelper.isPinned(uriFromIndex(5)) && !gStartView._pinHelper.isPinned(uriFromIndex(12)) , "Items hidden");
|
||||
ok(gStartView._set.itemCount === gStartView._limit - 1, "Grid repopulated");
|
||||
}
|
||||
});
|
||||
|
@ -22,8 +22,8 @@ contextAppbar2.pin.recentHistory=Pin to Recent History
|
||||
contextAppbar2.pin.downloads=Pin to Downloads
|
||||
|
||||
contextAppbar2.unpin.topSites=Unpin from Top Sites
|
||||
contextAppbar2.unpin.bookmarks=Unpin from Bookmarks
|
||||
contextAppbar2.unpin.recentHistory=Unpin from Recent History
|
||||
contextAppbar2.hide.bookmarks=Hide Bookmark
|
||||
contextAppbar2.hide.recentHistory=Hide
|
||||
contextAppbar2.unpin.downloads=Unpin from Downloads
|
||||
|
||||
# LOCALIZATION NOTE (contextAppbar2.delete): Deletes selected pages.
|
||||
|
@ -950,50 +950,79 @@ documenttab[selected] .documenttab-selection {
|
||||
}
|
||||
|
||||
#pin-selected-button {
|
||||
-moz-image-region: rect(0px, 240px, 40px, 200px) !important;
|
||||
}
|
||||
#pin-selected-button:hover {
|
||||
-moz-image-region: rect(40px, 240px, 80px, 200px) !important;
|
||||
}
|
||||
#pin-selected-button:active {
|
||||
-moz-image-region: rect(80px, 240px, 120px, 200px) !important;
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-pin.png);
|
||||
}
|
||||
|
||||
#unpin-selected-button {
|
||||
-moz-image-region: rect(0px, 280px, 40px, 240px) !important;
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-unpin.png);
|
||||
}
|
||||
#unpin-selected-button:hover {
|
||||
-moz-image-region: rect(40px, 280px, 80px, 240px) !important;
|
||||
}
|
||||
#unpin-selected-button:active {
|
||||
-moz-image-region: rect(80px, 280px, 120px, 240px) !important;
|
||||
|
||||
#hide-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-hide.png);
|
||||
}
|
||||
|
||||
#delete-selected-button {
|
||||
-moz-image-region: rect(0px, 480px, 40px, 440px) !important;
|
||||
}
|
||||
#delete-selected-button:hover {
|
||||
-moz-image-region: rect(40px, 480px, 80px, 440px) !important;
|
||||
}
|
||||
#delete-selected-button:active {
|
||||
-moz-image-region: rect(80px, 480px, 120px, 440px) !important;
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-delete.png);
|
||||
}
|
||||
|
||||
#clear-selected-button {
|
||||
-moz-image-region: rect(0px, 520px, 40px, 480px) !important;
|
||||
}
|
||||
#clear-selected-button:hover {
|
||||
-moz-image-region: rect(40px, 520px, 80px, 480px) !important;
|
||||
}
|
||||
#clear-selected-button:active {
|
||||
-moz-image-region: rect(80px, 520px, 120px, 480px) !important;
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-clear.png);
|
||||
}
|
||||
|
||||
#restore-selected-button {
|
||||
-moz-image-region: rect(0px, 560px, 40px, 520px) !important;
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-restore.png);
|
||||
}
|
||||
#restore-selected-button:hover {
|
||||
-moz-image-region: rect(40px, 560px, 80px, 520px) !important;
|
||||
|
||||
@media (min-resolution: @min_res_140pc@) {
|
||||
#pin-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-pin@1.4x.png);
|
||||
}
|
||||
|
||||
#unpin-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-unpin@1.4x.png);
|
||||
}
|
||||
|
||||
#hide-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-hide@1.4x.png);
|
||||
}
|
||||
|
||||
#delete-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-delete@1.4x.png);
|
||||
}
|
||||
|
||||
#clear-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-clear@1.4x.png);
|
||||
}
|
||||
|
||||
#restore-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-restore@1.4x.png);
|
||||
}
|
||||
}
|
||||
#restore-selected-button:active {
|
||||
-moz-image-region: rect(80px, 560px, 120px, 520px) !important;
|
||||
|
||||
@media (min-resolution: @min_res_180pc@) {
|
||||
#pin-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-pin@1.8x.png);
|
||||
}
|
||||
|
||||
#unpin-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-unpin@1.8x.png);
|
||||
}
|
||||
|
||||
#hide-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-hide@1.8x.png);
|
||||
}
|
||||
|
||||
#delete-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-delete@1.8x.png);
|
||||
}
|
||||
|
||||
#clear-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-clear@1.8x.png);
|
||||
}
|
||||
|
||||
#restore-selected-button {
|
||||
list-style-image: url(chrome://browser/skin/images/navbar-contextual-restore@1.8x.png);
|
||||
}
|
||||
}
|
||||
|
||||
/* Download notifications ======================================================= */
|
||||
|
BIN
browser/metro/theme/images/navbar-contextual-clear.png
Normal file
After Width: | Height: | Size: 1.5 KiB |
BIN
browser/metro/theme/images/navbar-contextual-clear@1.4x.png
Normal file
After Width: | Height: | Size: 2.3 KiB |
BIN
browser/metro/theme/images/navbar-contextual-clear@1.8x.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
BIN
browser/metro/theme/images/navbar-contextual-delete.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
browser/metro/theme/images/navbar-contextual-delete@1.4x.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
browser/metro/theme/images/navbar-contextual-delete@1.8x.png
Normal file
After Width: | Height: | Size: 2.4 KiB |
BIN
browser/metro/theme/images/navbar-contextual-hide.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
BIN
browser/metro/theme/images/navbar-contextual-hide@1.4x.png
Normal file
After Width: | Height: | Size: 4.4 KiB |
BIN
browser/metro/theme/images/navbar-contextual-hide@1.8x.png
Normal file
After Width: | Height: | Size: 5.6 KiB |
BIN
browser/metro/theme/images/navbar-contextual-pin.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
BIN
browser/metro/theme/images/navbar-contextual-pin@1.4x.png
Normal file
After Width: | Height: | Size: 2.5 KiB |
BIN
browser/metro/theme/images/navbar-contextual-pin@1.8x.png
Normal file
After Width: | Height: | Size: 3.2 KiB |
BIN
browser/metro/theme/images/navbar-contextual-restore.png
Normal file
After Width: | Height: | Size: 1.8 KiB |
BIN
browser/metro/theme/images/navbar-contextual-restore@1.4x.png
Normal file
After Width: | Height: | Size: 2.6 KiB |
BIN
browser/metro/theme/images/navbar-contextual-restore@1.8x.png
Normal file
After Width: | Height: | Size: 3.5 KiB |
BIN
browser/metro/theme/images/navbar-contextual-unpin.png
Normal file
After Width: | Height: | Size: 1.8 KiB |
BIN
browser/metro/theme/images/navbar-contextual-unpin@1.4x.png
Normal file
After Width: | Height: | Size: 2.6 KiB |
BIN
browser/metro/theme/images/navbar-contextual-unpin@1.8x.png
Normal file
After Width: | Height: | Size: 3.5 KiB |
@ -27,6 +27,24 @@ chrome.jar:
|
||||
skin/images/navbar-back.png (images/navbar-back.png)
|
||||
skin/images/navbar-back@1.4x.png (images/navbar-back@1.4x.png)
|
||||
skin/images/navbar-back@1.8x.png (images/navbar-back@1.8x.png)
|
||||
skin/images/navbar-contextual-clear.png (images/navbar-contextual-clear.png)
|
||||
skin/images/navbar-contextual-clear@1.4x.png (images/navbar-contextual-clear@1.4x.png)
|
||||
skin/images/navbar-contextual-clear@1.8x.png (images/navbar-contextual-clear@1.8x.png)
|
||||
skin/images/navbar-contextual-delete.png (images/navbar-contextual-delete.png)
|
||||
skin/images/navbar-contextual-delete@1.4x.png (images/navbar-contextual-delete@1.4x.png)
|
||||
skin/images/navbar-contextual-delete@1.8x.png (images/navbar-contextual-delete@1.8x.png)
|
||||
skin/images/navbar-contextual-hide.png (images/navbar-contextual-hide.png)
|
||||
skin/images/navbar-contextual-hide@1.4x.png (images/navbar-contextual-hide@1.4x.png)
|
||||
skin/images/navbar-contextual-hide@1.8x.png (images/navbar-contextual-hide@1.8x.png)
|
||||
skin/images/navbar-contextual-pin.png (images/navbar-contextual-pin.png)
|
||||
skin/images/navbar-contextual-pin@1.4x.png (images/navbar-contextual-pin@1.4x.png)
|
||||
skin/images/navbar-contextual-pin@1.8x.png (images/navbar-contextual-pin@1.8x.png)
|
||||
skin/images/navbar-contextual-restore.png (images/navbar-contextual-restore.png)
|
||||
skin/images/navbar-contextual-restore@1.4x.png (images/navbar-contextual-restore@1.4x.png)
|
||||
skin/images/navbar-contextual-restore@1.8x.png (images/navbar-contextual-restore@1.8x.png)
|
||||
skin/images/navbar-contextual-unpin.png (images/navbar-contextual-unpin.png)
|
||||
skin/images/navbar-contextual-unpin@1.4x.png (images/navbar-contextual-unpin@1.4x.png)
|
||||
skin/images/navbar-contextual-unpin@1.8x.png (images/navbar-contextual-unpin@1.8x.png)
|
||||
skin/images/navbar-download.png (images/navbar-download.png)
|
||||
skin/images/navbar-download@1.4x.png (images/navbar-download@1.4x.png)
|
||||
skin/images/navbar-download@1.8x.png (images/navbar-download@1.8x.png)
|
||||
|
@ -636,6 +636,10 @@ tabmodalprompt:not([promptType="promptUserAndPass"]) .infoContainer {
|
||||
|
||||
.meta {
|
||||
background-color: @panel_light_color@;
|
||||
background-image: url("chrome://browser/skin/images/firefox-watermark.png");
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
/* needs to observe the viewstate */
|
||||
|
@ -54,7 +54,7 @@
|
||||
* is hidden by videocontrols.xml, and that alters the position of the
|
||||
* play button. This workaround moves it back to center.
|
||||
*/
|
||||
.controlBar.audio .playButton {
|
||||
.controlBar.audio-only .playButton {
|
||||
transform: translateX(28px);
|
||||
}
|
||||
|
||||
|
@ -510,6 +510,11 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) {
|
||||
transition: @forwardTransitionLength@ ease-out;
|
||||
}
|
||||
|
||||
#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
|
||||
#forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
/* tabview button */
|
||||
|
||||
#tabview-button,
|
||||
|
@ -389,14 +389,25 @@
|
||||
}
|
||||
|
||||
#resume {
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-pause.png");
|
||||
-moz-image-region: rect(0px,16px,16px,0px);
|
||||
transition: background 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
#resume[checked] {
|
||||
background: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
|
||||
-moz-image-region: rect(0px,32px,16px,16px);
|
||||
}
|
||||
|
||||
#resume ~ toolbarbutton {
|
||||
transition: opacity 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
#resume:not([checked]) ~ toolbarbutton {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#step-over {
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png");
|
||||
}
|
||||
|
@ -1,288 +0,0 @@
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
#toolbox-controls {
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
#toolbox-controls > toolbarbutton,
|
||||
#toolbox-dock-buttons > toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
margin: 0 4px;
|
||||
min-width: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
#toolbox-dock-bottom {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-side {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window {
|
||||
list-style-image: url("chrome://browser/skin/devtools/undock.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window,
|
||||
#toolbox-dock-bottom,
|
||||
#toolbox-dock-side {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
#toolbox-dock-window:hover,
|
||||
#toolbox-dock-bottom:hover,
|
||||
#toolbox-dock-side:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#toolbox-controls-separator {
|
||||
width: 3px;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0)),
|
||||
linear-gradient(hsla(206,37%,4%,0), hsla(206,37%,4%,.6), hsla(206,37%,4%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0, 1px, 2px;
|
||||
-moz-margin-start: 8px;
|
||||
}
|
||||
|
||||
/* Command buttons */
|
||||
|
||||
.command-button {
|
||||
-moz-appearance: none;
|
||||
padding: 0 8px;
|
||||
margin: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.command-button:hover {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
}
|
||||
.command-button:hover:active, .command-button[checked=true]:not(:hover) {
|
||||
background-color: hsla(206,37%,4%,.4);
|
||||
}
|
||||
|
||||
#command-button-paintflashing {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-paintflashing:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-paintflashing:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-paintflashing[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-responsive {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-responsive:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-responsive:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-responsive[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-tilt {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-tilt:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-tilt:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
#command-button-tilt[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
/* Tabs */
|
||||
|
||||
.devtools-tabbar {
|
||||
-moz-appearance: none;
|
||||
background-image: url("background-noise-toolbar.png"),
|
||||
linear-gradient(#303840, #2d3640);
|
||||
border-color: #060a0d;
|
||||
border-style: solid;
|
||||
border-width: 1px 0;
|
||||
box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
|
||||
0 -1px 0 hsla(206,37%,4%,.1) inset;
|
||||
min-height: 32px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#toolbox-tabs {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.devtools-tab {
|
||||
-moz-appearance: none;
|
||||
min-width: 32px;
|
||||
min-height: 32px;
|
||||
max-width: 127px;
|
||||
color: #b6babf;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left, right;
|
||||
border-right: 1px solid hsla(206,37%,4%,.45);
|
||||
-moz-box-align: center;
|
||||
}
|
||||
|
||||
.devtools-tab > image {
|
||||
border: none;
|
||||
-moz-margin-end: 0;
|
||||
-moz-margin-start: 4px;
|
||||
opacity: 0.6;
|
||||
max-height: 16px;
|
||||
width: 16px; /* Prevents collapse during theme switching */
|
||||
}
|
||||
|
||||
#toolbox-tab-options > image {
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
.devtools-tab > label {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.devtools-tab:hover > image {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.devtools-tab:active > image,
|
||||
.devtools-tab[selected=true] > label {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.devtools-tab:hover {
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
|
||||
background-size: 1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: left, right;
|
||||
color: #ced3d9;
|
||||
}
|
||||
.devtools-tab:hover:active {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
color: #f5f7fa;
|
||||
}
|
||||
|
||||
.devtools-tab[selected=true] {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
|
||||
radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
|
||||
linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
|
||||
}
|
||||
|
||||
.devtools-tab:not([selected=true]).highlighted {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
|
||||
radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
}
|
||||
|
||||
.devtools-tab:not(.highlighted) > .highlighted-icon,
|
||||
.devtools-tab[selected=true] > .highlighted-icon,
|
||||
.devtools-tab:not([selected=true]).highlighted > .default-icon {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
||||
.options-vertical-pane {
|
||||
margin: 5px;
|
||||
width: calc(50% - 30px);
|
||||
min-width: 400px;
|
||||
-moz-padding-start: 5px;
|
||||
}
|
||||
|
||||
.options-vertical-pane > label {
|
||||
padding: 2px 0;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.options-groupbox {
|
||||
-moz-margin-start: 15px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-groupbox > * {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-citation-label {
|
||||
font-size: 1rem !important;
|
||||
/* !important is required otherwise font-size will still be 1.4rem */
|
||||
font-style: italic;
|
||||
padding: 4px 0 0; /* To align it with the checkbox */
|
||||
}
|
||||
|
||||
.options-citation-label + label {
|
||||
padding: 3px 0 0 !important; /* To align it with the checkbox */
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hidden-labels-box:not(.visible) > label,
|
||||
.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
|
||||
display: none;
|
||||
}
|
@ -146,9 +146,9 @@ browser.jar:
|
||||
skin/classic/browser/tabview/stack-expander.png (tabview/stack-expander.png)
|
||||
skin/classic/browser/tabview/tabview.png (tabview/tabview.png)
|
||||
skin/classic/browser/tabview/tabview.css (tabview/tabview.css)
|
||||
* skin/classic/browser/devtools/common.css (devtools/common.css)
|
||||
skin/classic/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
skin/classic/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
* skin/classic/browser/devtools/common.css (../shared/devtools/common.css)
|
||||
* skin/classic/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
* skin/classic/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
skin/classic/browser/devtools/controls.png (../shared/devtools/controls.png)
|
||||
* skin/classic/browser/devtools/widgets.css (devtools/widgets.css)
|
||||
skin/classic/browser/devtools/commandline-icon.png (devtools/commandline-icon.png)
|
||||
@ -229,7 +229,6 @@ browser.jar:
|
||||
skin/classic/browser/devtools/floating-scrollbars-light.css (devtools/floating-scrollbars-light.css)
|
||||
skin/classic/browser/devtools/inspector.css (devtools/inspector.css)
|
||||
skin/classic/browser/devtools/profiler-stopwatch.png (devtools/profiler-stopwatch.png)
|
||||
skin/classic/browser/devtools/toolbox.css (devtools/toolbox.css)
|
||||
skin/classic/browser/devtools/tool-options.png (devtools/tool-options.png)
|
||||
skin/classic/browser/devtools/tool-webconsole.png (devtools/tool-webconsole.png)
|
||||
skin/classic/browser/devtools/tool-debugger.png (devtools/tool-debugger.png)
|
||||
|
@ -1432,8 +1432,8 @@ toolbar .toolbarbutton-1:not([type="menu-button"]),
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
|
||||
padding-top: 2px;
|
||||
#zoom-controls[cui-areatype="toolbar"]:not(.overflowedItem) > #zoom-reset-button > .toolbarbutton-text {
|
||||
padding-top: 8px;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
|
@ -1,354 +0,0 @@
|
||||
/* vim:set ts=2 sw=2 sts=2 et: */
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
%include ../shared.inc
|
||||
|
||||
/* Font for code */
|
||||
|
||||
:root {
|
||||
font: message-box;
|
||||
}
|
||||
|
||||
.devtools-monospace {
|
||||
font-family: Menlo, monospace;
|
||||
}
|
||||
|
||||
/* Toolbar and Toolbar items */
|
||||
|
||||
.devtools-toolbar {
|
||||
-moz-appearance: none;
|
||||
padding: 4px 3px;
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
|
||||
.devtools-menulist,
|
||||
.devtools-toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
-moz-box-align: center;
|
||||
min-width: 78px;
|
||||
min-height: 22px;
|
||||
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
|
||||
border: 1px solid hsla(210,8%,5%,.45);
|
||||
border-radius: @toolbarbuttonCornerRadius@;
|
||||
background: linear-gradient(hsla(212,7%,57%,.35), hsla(212,7%,57%,.1)) padding-box;
|
||||
box-shadow: 0 1px 0 hsla(210,16%,76%,.15) inset, 0 0 0 1px hsla(210,16%,76%,.15) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton > .toolbarbutton-menubutton-button {
|
||||
-moz-box-orient: horizontal;
|
||||
}
|
||||
|
||||
.devtools-menulist {
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.devtools-menulist:-moz-focusring,
|
||||
.devtools-toolbarbutton:-moz-focusring {
|
||||
outline: 1px dotted hsla(210,30%,85%,0.7);
|
||||
outline-offset: -4px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton > .toolbarbutton-text {
|
||||
margin: 1px 6px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([label]) {
|
||||
min-width: 32px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([checked=true]):hover:active {
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
background: linear-gradient(hsla(220,6%,10%,.3), hsla(212,7%,57%,.15) 65%, hsla(212,7%,57%,.3));
|
||||
box-shadow: 0 0 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
.devtools-menulist[open=true],
|
||||
.devtools-toolbarbutton[open=true],
|
||||
.devtools-toolbarbutton[checked=true] {
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
background: linear-gradient(hsla(220,6%,10%,.6), hsla(210,11%,18%,.45) 75%, hsla(210,11%,30%,.4));
|
||||
box-shadow: 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 3px hsla(210,8%,5%,.25) inset, 0 1px 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[checked=true] {
|
||||
color: hsl(208,100%,60%) !important;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[checked=true]:hover:active {
|
||||
background-color: hsla(210,8%,5%,.2);
|
||||
}
|
||||
|
||||
.devtools-option-toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
|
||||
-moz-image-region: rect(0px 16px 16px 0px);
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.devtools-option-toolbarbutton[open=true] {
|
||||
-moz-image-region: rect(0px 32px 16px 16px);
|
||||
}
|
||||
|
||||
.devtools-menulist > .menulist-label-box {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.devtools-menulist > .menulist-dropmarker {
|
||||
-moz-appearance: none;
|
||||
background-color: transparent;
|
||||
display: -moz-box;
|
||||
list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
|
||||
border-width: 0;
|
||||
min-width: 18px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
|
||||
-moz-appearance: none;
|
||||
border-width: 0;
|
||||
-moz-border-end: 1px solid hsla(210,8%,5%,.45);
|
||||
box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);
|
||||
padding: 0 1px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
|
||||
box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu-button] {
|
||||
padding: 0 1px;
|
||||
-moz-box-align: stretch;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
|
||||
.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
|
||||
-moz-appearance: none !important;
|
||||
list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* Text input */
|
||||
|
||||
.devtools-textinput,
|
||||
.devtools-searchinput {
|
||||
-moz-appearance: none;
|
||||
margin: 0 3px;
|
||||
min-height: 22px;
|
||||
background-color: transparent;
|
||||
border: 1px solid hsla(210,8%,5%,.6);
|
||||
border-radius: 20px;
|
||||
background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
|
||||
padding: 3px 8px;
|
||||
box-shadow: 0 1px 1px hsla(210,8%,5%,.3) inset,
|
||||
0 0 0 1px hsla(210,16%,76%,.1) inset,
|
||||
0 1px 0 hsla(210,16%,76%,.15);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.devtools-searchinput {
|
||||
background-image: url(magnifying-glass.png), linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
|
||||
background-repeat: no-repeat;
|
||||
background-position: 4px center, top left, top left;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
-moz-padding-start: 18px;
|
||||
-moz-padding-end: 12px;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
.devtools-searchinput:-moz-locale-dir(rtl) {
|
||||
background-position: calc(100% - 4px) center, top left, top left;
|
||||
}
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-search-icons {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: hsl(208,10%,66%);
|
||||
}
|
||||
|
||||
.devtools-no-search-result {
|
||||
box-shadow: inset 0 0 0 1px hsla(0,68%,6%,.35);
|
||||
border-color: hsl(10,70%,40%) hsl(10,75%,37%) hsl(10,80%,35%) !important;
|
||||
background-image: url(magnifying-glass.png), linear-gradient(hsla(1,16%,76%,.45), hsla(1,16%,76%,.75));
|
||||
}
|
||||
|
||||
/* Close button */
|
||||
|
||||
.devtools-closebutton {
|
||||
list-style-image: url("chrome://browser/skin/devtools/close.png");
|
||||
-moz-appearance: none;
|
||||
border: none;
|
||||
margin: 0 4px;
|
||||
min-width: 16px;
|
||||
width: 16px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.devtools-closebutton > .toolbarbutton-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-closebutton:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.devtools-closebutton:active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Splitters */
|
||||
|
||||
.devtools-horizontal-splitter {
|
||||
-moz-appearance: none;
|
||||
background-image: none;
|
||||
border-top: 1px solid black;
|
||||
border-bottom-width: 0;
|
||||
min-height: 3px;
|
||||
height: 3px;
|
||||
margin-bottom: -3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.devtools-side-splitter {
|
||||
-moz-appearance: none;
|
||||
background-image: none;
|
||||
border: 0;
|
||||
-moz-border-start: 1px solid black;
|
||||
min-width: 0;
|
||||
width: 3px;
|
||||
-moz-margin-end: -3px;
|
||||
position: relative;
|
||||
cursor: e-resize;
|
||||
}
|
||||
|
||||
/* In-tools sidebar */
|
||||
|
||||
.devtools-toolbox-side-iframe {
|
||||
min-width: 465px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs {
|
||||
-moz-appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabpanels {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs {
|
||||
-moz-appearance: none;
|
||||
font: inherit;
|
||||
position: static;
|
||||
color: #b6babf;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
background-color: #343c45;
|
||||
border-width: 0 0 1px 0;
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
border-style: solid;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > .tabs-right,
|
||||
.devtools-sidebar-tabs > tabs > .tabs-left {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
-moz-appearance: none;
|
||||
/* We want to match the height of a toolbar with a toolbarbutton
|
||||
* First, we need to replicated the padding of toolbar (4px),
|
||||
* then we need to take the border of the buttons into account (1px).
|
||||
*/
|
||||
padding: 5px 3px !important;
|
||||
-moz-padding-start: 6px;
|
||||
padding: 0;
|
||||
min-width: 78px;
|
||||
/* toolbar's min-height is button min-height (25px) + padding (2 * 4px): 33px.
|
||||
* -1px because the parent element (<tabs>) comes with a 1px bottom border.
|
||||
*/
|
||||
min-height: 32px;
|
||||
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
|
||||
text-align: center;
|
||||
color: inherit;
|
||||
-moz-box-flex: 1;
|
||||
border-width: 0;
|
||||
position: static;
|
||||
-moz-margin-start: -1px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:-moz-focusring {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:first-of-type {
|
||||
-moz-margin-start: -3px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
background-size: calc(100% - 2px) 100%, 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 1px, 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs:-moz-locale-dir(rtl) > tabs > tab {
|
||||
background-position: calc(100% - 1px), 100%;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:last-of-type {
|
||||
-moz-border-end-width: 0;
|
||||
}
|
||||
|
||||
%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
|
||||
%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
background-image: linear-gradient(transparent, transparent), @smallSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:hover {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @smallSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:hover:active {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @smallSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] + tab {
|
||||
background-image: linear-gradient(transparent, transparent), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover:active {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] {
|
||||
color: #f5f7fa;
|
||||
background-image: linear-gradient(#1d4f73, #1d4f73), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true]:hover {
|
||||
background-image: linear-gradient(#274f64, #274f64), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true]:hover:active {
|
||||
background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
|
||||
}
|
||||
|
||||
%include ../../shared/devtools/common.inc.css
|
@ -391,14 +391,25 @@
|
||||
}
|
||||
|
||||
#resume {
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-pause.png");
|
||||
-moz-image-region: rect(0px,16px,16px,0px);
|
||||
transition: background 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
#resume[checked] {
|
||||
background: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
|
||||
-moz-image-region: rect(0px,32px,16px,16px);
|
||||
}
|
||||
|
||||
#resume ~ toolbarbutton {
|
||||
transition: opacity 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
#resume:not([checked]) ~ toolbarbutton {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#step-over {
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png");
|
||||
}
|
||||
|
@ -1,274 +0,0 @@
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
#toolbox-controls {
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
#toolbox-controls > toolbarbutton,
|
||||
#toolbox-dock-buttons > toolbarbutton {
|
||||
margin: 0 4px;
|
||||
min-width: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
#toolbox-dock-bottom {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-side {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window {
|
||||
list-style-image: url("chrome://browser/skin/devtools/undock.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window,
|
||||
#toolbox-dock-bottom,
|
||||
#toolbox-dock-side {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
#toolbox-dock-window:hover,
|
||||
#toolbox-dock-bottom:hover,
|
||||
#toolbox-dock-side:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Command buttons */
|
||||
|
||||
.command-button {
|
||||
padding: 0 8px;
|
||||
margin: 0;
|
||||
border-width: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.command-button:hover {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
}
|
||||
.command-button:hover:active, .command-button[checked=true]:not(:hover) {
|
||||
background-color: hsla(206,37%,4%,.4);
|
||||
}
|
||||
|
||||
#command-button-paintflashing {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-paintflashing:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-paintflashing:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-paintflashing[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-responsive {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-responsive:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-responsive:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-responsive[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-tilt {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-tilt:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-tilt:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
#command-button-tilt[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
/* Tabs */
|
||||
|
||||
.devtools-tabbar {
|
||||
-moz-appearance: none;
|
||||
background-image: url("background-noise-toolbar.png"),
|
||||
linear-gradient(#303840, #2d3640);
|
||||
border-color: #060a0d;
|
||||
border-style: solid;
|
||||
border-width: 1px 0;
|
||||
box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
|
||||
0 -1px 0 hsla(206,37%,4%,.1) inset;
|
||||
min-height: 32px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#toolbox-tabs {
|
||||
margin: 0;
|
||||
border-left: 1px solid hsla(206,37%,4%,.45);
|
||||
}
|
||||
|
||||
.devtools-tab {
|
||||
-moz-appearance: none;
|
||||
min-width: 32px;
|
||||
min-height: 32px;
|
||||
max-width: 110px;
|
||||
color: #b6babf;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left, right;
|
||||
border-right: 1px solid hsla(206,37%,4%,.45);
|
||||
}
|
||||
|
||||
.devtools-tab > image {
|
||||
-moz-margin-end: 0;
|
||||
-moz-margin-start: 4px;
|
||||
opacity: 0.6;
|
||||
width: 16px; /* Prevents collapse during theme switching */
|
||||
}
|
||||
|
||||
#toolbox-tab-options > image {
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
.devtools-tab > label {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.devtools-tab:hover > image {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.devtools-tab:active > image,
|
||||
.devtools-tab[selected=true] > image {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.devtools-tab:hover {
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
|
||||
background-size: 1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: left, right;
|
||||
color: #ced3d9;
|
||||
}
|
||||
.devtools-tab:hover:active {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
color: #f5f7fa;
|
||||
}
|
||||
|
||||
.devtools-tab[selected=true] {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
|
||||
radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
|
||||
linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
|
||||
}
|
||||
|
||||
.devtools-tab:not([selected=true]).highlighted {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
|
||||
radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
}
|
||||
|
||||
.devtools-tab:not(.highlighted) > .highlighted-icon,
|
||||
.devtools-tab[selected=true] > .highlighted-icon,
|
||||
.devtools-tab:not([selected=true]).highlighted > .default-icon {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
||||
.options-vertical-pane {
|
||||
margin: 5px;
|
||||
width: calc(50% - 30px);
|
||||
min-width: 400px;
|
||||
-moz-padding-start: 5px;
|
||||
}
|
||||
|
||||
.options-vertical-pane > label {
|
||||
padding: 2px 0;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.options-groupbox {
|
||||
-moz-margin-start: 15px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-groupbox > * {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-citation-label {
|
||||
font-size: 1rem !important;
|
||||
/* !important is required otherwise font-size will still be 1.4rem */
|
||||
font-style: italic;
|
||||
padding: 4px 0 0; /* To align it with the checkbox */
|
||||
}
|
||||
|
||||
.options-citation-label + label {
|
||||
padding: 3px 0 0 !important; /* To align it with the checkbox */
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hidden-labels-box:not(.visible) > label,
|
||||
.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
|
||||
display: none;
|
||||
}
|
@ -248,9 +248,9 @@ browser.jar:
|
||||
skin/classic/browser/tabview/stack-expander.png (tabview/stack-expander.png)
|
||||
skin/classic/browser/tabview/tabview.png (tabview/tabview.png)
|
||||
skin/classic/browser/tabview/tabview.css (tabview/tabview.css)
|
||||
* skin/classic/browser/devtools/common.css (devtools/common.css)
|
||||
skin/classic/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
skin/classic/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
* skin/classic/browser/devtools/common.css (../shared/devtools/common.css)
|
||||
* skin/classic/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
* skin/classic/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
skin/classic/browser/devtools/controls.png (../shared/devtools/controls.png)
|
||||
* skin/classic/browser/devtools/widgets.css (devtools/widgets.css)
|
||||
skin/classic/browser/devtools/commandline-icon.png (devtools/commandline-icon.png)
|
||||
@ -331,7 +331,6 @@ browser.jar:
|
||||
skin/classic/browser/devtools/dock-side.png (devtools/dock-side.png)
|
||||
* skin/classic/browser/devtools/inspector.css (devtools/inspector.css)
|
||||
skin/classic/browser/devtools/profiler-stopwatch.png (devtools/profiler-stopwatch.png)
|
||||
skin/classic/browser/devtools/toolbox.css (devtools/toolbox.css)
|
||||
skin/classic/browser/devtools/tool-options.png (devtools/tool-options.png)
|
||||
skin/classic/browser/devtools/tool-webconsole.png (devtools/tool-webconsole.png)
|
||||
skin/classic/browser/devtools/tool-debugger.png (devtools/tool-debugger.png)
|
||||
|
@ -7,9 +7,10 @@
|
||||
/* UI Tour */
|
||||
|
||||
html|div#UITourHighlight {
|
||||
border-radius: 20px;
|
||||
border: 2px #5B9CD9 solid;
|
||||
box-shadow: 0 0 2px #5B9CD9, inset 0 0 1px #5B9CD9;
|
||||
background-image: radial-gradient(50% 100%, rgba(0,149,220,0.4) 50%, rgba(0,149,220,0.6) 100%);
|
||||
border-radius: 40px;
|
||||
border: 1px solid white;
|
||||
box-shadow: 0 0 3px 0 rgba(0,0,0,0.5);
|
||||
min-height: 32px;
|
||||
min-width: 32px;
|
||||
}
|
||||
|
@ -4,6 +4,50 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
%endif
|
||||
|
||||
:root {
|
||||
font: message-box;
|
||||
}
|
||||
|
||||
.devtools-monospace {
|
||||
%ifdef XP_MACOSX
|
||||
font-family: Menlo, monospace;
|
||||
%endif
|
||||
%ifdef XP_LINUX
|
||||
font-family: monospace;
|
||||
font-size: 80%;
|
||||
%endif
|
||||
%ifdef XP_WIN
|
||||
font-family: Consolas, monospace;
|
||||
%endif
|
||||
}
|
||||
|
||||
/* Splitters */
|
||||
.devtools-horizontal-splitter {
|
||||
-moz-appearance: none;
|
||||
border-top: 1px solid black;
|
||||
border-bottom-width: 0;
|
||||
min-height: 3px;
|
||||
height: 3px;
|
||||
margin-bottom: -3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.devtools-side-splitter {
|
||||
-moz-appearance: none;
|
||||
border: 0;
|
||||
-moz-border-start: 1px solid black;
|
||||
min-width: 0;
|
||||
width: 3px;
|
||||
background-color: transparent;
|
||||
-moz-margin-end: -3px;
|
||||
position: relative;
|
||||
cursor: e-resize;
|
||||
}
|
||||
|
||||
.devtools-toolbox-side-iframe {
|
||||
min-width: 465px;
|
||||
}
|
||||
|
||||
/* Autocomplete Popup */
|
||||
/* Dark and light theme */
|
||||
|
@ -47,8 +47,7 @@
|
||||
background: #26394D;
|
||||
}
|
||||
|
||||
.theme-bg-darker,
|
||||
.cm-s-mozilla .CodeMirror-gutters {
|
||||
.theme-bg-darker {
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
@ -220,6 +219,7 @@ div.CodeMirror span.eval-text {
|
||||
|
||||
.cm-s-mozilla .CodeMirror-gutters { /* vertical line next to line numbers */
|
||||
border-right-color: #343c45;
|
||||
background-color: #181d20;
|
||||
}
|
||||
|
||||
.cm-s-markup-view pre {
|
||||
@ -279,3 +279,5 @@ div.CodeMirror span.eval-text {
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
%include toolbars.inc.css
|
||||
|
@ -47,8 +47,7 @@
|
||||
background-color: #CCC;
|
||||
}
|
||||
|
||||
.theme-bg-darker,
|
||||
.cm-s-mozilla .CodeMirror-gutters {
|
||||
.theme-bg-darker {
|
||||
background: #EFEFEF;
|
||||
}
|
||||
|
||||
@ -219,6 +218,7 @@ div.CodeMirror span.eval-text {
|
||||
|
||||
.cm-s-mozilla .CodeMirror-gutters { /* vertical line next to line numbers */
|
||||
border-right-color: #a6a6a6;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
.cm-s-markup-view pre {
|
||||
@ -278,3 +278,5 @@ div.CodeMirror span.eval-text {
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
%include toolbars.inc.css
|
@ -1,20 +1,11 @@
|
||||
/* vim:set ts=2 sw=2 sts=2 et: */
|
||||
%if 0
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
/* Font for code */
|
||||
|
||||
:root {
|
||||
font: message-box;
|
||||
}
|
||||
|
||||
.devtools-monospace {
|
||||
font-family: monospace;
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/* Toolbar and Toolbar items */
|
||||
%endif
|
||||
%filter substitution
|
||||
%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
|
||||
%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
|
||||
|
||||
.devtools-toolbar {
|
||||
-moz-appearance: none;
|
||||
@ -71,7 +62,7 @@
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[checked=true] {
|
||||
color: hsl(208,100%,60%) !important;
|
||||
color: hsl(208,100%,60%);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[checked=true]:hover {
|
||||
@ -139,7 +130,7 @@
|
||||
margin: 0 3px;
|
||||
min-height: 22px;
|
||||
border: 1px solid hsla(210,8%,5%,.6);
|
||||
border-radius: 2px;
|
||||
border-radius: 20px;
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
|
||||
padding: 3px;
|
||||
@ -209,36 +200,8 @@
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Splitters */
|
||||
|
||||
.devtools-horizontal-splitter {
|
||||
-moz-appearance: none;
|
||||
border-top: 1px solid black;
|
||||
border-bottom-width: 0;
|
||||
min-height: 3px;
|
||||
height: 3px;
|
||||
margin-bottom: -3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.devtools-side-splitter {
|
||||
-moz-appearance: none;
|
||||
border: 0;
|
||||
-moz-border-start: 1px solid black;
|
||||
min-width: 0;
|
||||
width: 3px;
|
||||
background-color: transparent;
|
||||
-moz-margin-end: -3px;
|
||||
position: relative;
|
||||
cursor: e-resize;
|
||||
}
|
||||
|
||||
/* In-tools sidebar */
|
||||
|
||||
.devtools-toolbox-side-iframe {
|
||||
min-width: 465px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs {
|
||||
-moz-appearance: none;
|
||||
margin: 0;
|
||||
@ -253,6 +216,7 @@
|
||||
.devtools-sidebar-tabs > tabs {
|
||||
-moz-appearance: none;
|
||||
position: static;
|
||||
font: inherit;
|
||||
color: #b6babf;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
@ -287,8 +251,6 @@
|
||||
color: inherit;
|
||||
-moz-box-flex: 1;
|
||||
border-width: 0;
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
position: static;
|
||||
-moz-margin-start: -1px;
|
||||
}
|
||||
@ -307,11 +269,8 @@
|
||||
background-position: calc(100% - 1px), 100%;
|
||||
}
|
||||
|
||||
%filter substitution
|
||||
%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
|
||||
%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(transparent, transparent), @smallSeparator@;
|
||||
}
|
||||
|
||||
@ -348,4 +307,269 @@
|
||||
background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
|
||||
}
|
||||
|
||||
%include ../../shared/devtools/common.inc.css
|
||||
/* Toolbox - moved from toolbox.css.
|
||||
* Rules that apply to the global toolbox like command buttons,
|
||||
* devtools tabs, docking buttons, etc. */
|
||||
|
||||
#toolbox-controls {
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
#toolbox-controls > toolbarbutton,
|
||||
#toolbox-dock-buttons > toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
margin: 0 4px;
|
||||
min-width: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
#toolbox-controls > toolbarbutton > .toolbarbutton-text,
|
||||
#toolbox-dock-buttons > toolbarbutton > .toolbarbutton-text,
|
||||
.command-button > .toolbarbutton-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#toolbox-dock-bottom {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-side {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window {
|
||||
list-style-image: url("chrome://browser/skin/devtools/undock.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window,
|
||||
#toolbox-dock-bottom,
|
||||
#toolbox-dock-side {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
#toolbox-dock-window:hover,
|
||||
#toolbox-dock-bottom:hover,
|
||||
#toolbox-dock-side:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#toolbox-controls-separator {
|
||||
width: 3px;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0)),
|
||||
linear-gradient(hsla(206,37%,4%,0), hsla(206,37%,4%,.6), hsla(206,37%,4%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0, 1px, 2px;
|
||||
-moz-margin-start: 8px;
|
||||
}
|
||||
|
||||
/* Command buttons */
|
||||
|
||||
.command-button {
|
||||
-moz-appearance: none;
|
||||
padding: 0 8px;
|
||||
margin: 0;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.command-button:hover {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
}
|
||||
.command-button:hover:active, .command-button[checked=true]:not(:hover) {
|
||||
background-color: hsla(206,37%,4%,.4);
|
||||
}
|
||||
|
||||
#command-button-paintflashing {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-paintflashing:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-paintflashing:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-paintflashing[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-responsive {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-responsive:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-responsive:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-responsive[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-tilt {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-tilt:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-tilt:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
#command-button-tilt[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
/* Tabs */
|
||||
|
||||
.devtools-tabbar {
|
||||
-moz-appearance: none;
|
||||
background-image: url("background-noise-toolbar.png"),
|
||||
linear-gradient(#303840, #2d3640);
|
||||
border-color: #060a0d;
|
||||
border-style: solid;
|
||||
border-width: 1px 0;
|
||||
box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
|
||||
0 -1px 0 hsla(206,37%,4%,.1) inset;
|
||||
min-height: 32px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#toolbox-tabs {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.devtools-tab {
|
||||
-moz-binding: url("chrome://global/content/bindings/general.xml#control-item");
|
||||
-moz-box-align: center;
|
||||
}
|
||||
|
||||
.devtools-tab {
|
||||
-moz-appearance: none;
|
||||
min-width: 32px;
|
||||
min-height: 32px;
|
||||
max-width: 127px;
|
||||
color: #b6babf;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left, right;
|
||||
border-right: 1px solid hsla(206,37%,4%,.45);
|
||||
-moz-box-align: center;
|
||||
}
|
||||
|
||||
.devtools-tab > image {
|
||||
border: none;
|
||||
-moz-margin-end: 0;
|
||||
-moz-margin-start: 4px;
|
||||
opacity: 0.6;
|
||||
max-height: 16px;
|
||||
width: 16px; /* Prevents collapse during theme switching */
|
||||
}
|
||||
|
||||
#toolbox-tab-options > image {
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
.devtools-tab > label {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.devtools-tab:hover > image {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.devtools-tab:active > image,
|
||||
.devtools-tab[selected=true] > label {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.devtools-tab:hover {
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
|
||||
background-size: 1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: left, right;
|
||||
color: #ced3d9;
|
||||
}
|
||||
.devtools-tab:hover:active {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
color: #f5f7fa;
|
||||
}
|
||||
|
||||
.devtools-tab[selected=true] {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
|
||||
radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
|
||||
linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
|
||||
}
|
||||
|
||||
.devtools-tab:not([selected=true]).highlighted {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
|
||||
radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
}
|
||||
|
||||
.devtools-tab:not(.highlighted) > .highlighted-icon,
|
||||
.devtools-tab[selected=true] > .highlighted-icon,
|
||||
.devtools-tab:not([selected=true]).highlighted > .default-icon {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
||||
.hidden-labels-box:not(.visible) > label,
|
||||
.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
|
||||
display: none;
|
||||
}
|
@ -30,11 +30,6 @@ toolbarpaletteitem[place="palette"] > #downloads-button {
|
||||
-moz-image-region: rect(0px, 256px, 32px, 224px);
|
||||
}
|
||||
|
||||
#switch-to-metro-button[cui-areatype="menu-panel"],
|
||||
toolbarpaletteitem[place="palette"] > #switch-to-metro-button {
|
||||
-moz-image-region: rect(0px, 800px, 32px, 768px);
|
||||
}
|
||||
|
||||
#add-ons-button[cui-areatype="menu-panel"],
|
||||
toolbarpaletteitem[place="palette"] > #add-ons-button {
|
||||
-moz-image-region: rect(0px, 288px, 32px, 256px);
|
||||
|
@ -16,11 +16,6 @@
|
||||
-moz-image-region: rect(0, 72px, 18px, 54px);
|
||||
}
|
||||
|
||||
#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
|
||||
#forward-button:-moz-locale-dir(rtl) {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
#home-button[cui-areatype="toolbar"] {
|
||||
-moz-image-region: rect(0, 126px, 18px, 108px);
|
||||
}
|
||||
@ -49,10 +44,6 @@
|
||||
-moz-image-region: rect(0, 216px, 18px, 198px);
|
||||
}
|
||||
|
||||
#switch-to-metro-button[cui-areatype="toolbar"] {
|
||||
-moz-image-region: rect(0, 648px, 18px, 630px);
|
||||
}
|
||||
|
||||
#open-file-button[cui-areatype="toolbar"] {
|
||||
-moz-image-region: rect(0, 234px, 18px, 216px);
|
||||
}
|
||||
|
BIN
browser/themes/windows/Metro_Glyph-aero.png
Normal file
After Width: | Height: | Size: 609 B |
BIN
browser/themes/windows/Metro_Glyph-inverted.png
Normal file
After Width: | Height: | Size: 455 B |
BIN
browser/themes/windows/Metro_Glyph-menuPanel.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 9.1 KiB |
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 9.1 KiB |
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 14 KiB |
@ -688,6 +688,11 @@ menuitem.bookmark-item {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
#back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
|
||||
#forward-button:-moz-locale-dir(rtl) {
|
||||
transform: scaleX(-1);
|
||||
}
|
||||
|
||||
.unified-nav-back[_moz-menuactive]:-moz-locale-dir(ltr),
|
||||
.unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
|
||||
list-style-image: url("chrome://browser/skin/menu-back.png") !important;
|
||||
@ -2220,6 +2225,19 @@ toolbarbutton.bookmark-item[dragover="true"][open="true"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#switch-to-metro-button[cui-areatype="toolbar"] {
|
||||
list-style-image: url(chrome://browser/skin/Metro_Glyph.png);
|
||||
}
|
||||
|
||||
#switch-to-metro-button[cui-areatype="toolbar"]:-moz-lwtheme-brighttext {
|
||||
list-style-image: url(chrome://browser/skin/Metro_Glyph-inverted.png);
|
||||
}
|
||||
|
||||
#switch-to-metro-button[cui-areatype="menu-panel"],
|
||||
toolbarpaletteitem[place="palette"] > #switch-to-metro-button {
|
||||
list-style-image: url(chrome://browser/skin/Metro_Glyph-menuPanel.png);
|
||||
}
|
||||
|
||||
.toolbarbutton-badge-container {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
@ -1,364 +0,0 @@
|
||||
/* vim:set ts=2 sw=2 sts=2 et: */
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
/* Font for code */
|
||||
|
||||
:root {
|
||||
font: message-box;
|
||||
}
|
||||
|
||||
.devtools-monospace {
|
||||
font-family: Consolas, monospace;
|
||||
}
|
||||
|
||||
/* Toolbar and Toolbar items */
|
||||
|
||||
.devtools-toolbar {
|
||||
-moz-appearance: none;
|
||||
padding: 4px 3px;
|
||||
border-bottom-width: 1px;
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
|
||||
.devtools-menulist,
|
||||
.devtools-toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
-moz-box-align: center;
|
||||
min-width: 78px;
|
||||
min-height: 22px;
|
||||
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
|
||||
border: 1px solid hsla(211,68%,6%,.5);
|
||||
border-radius: 3px;
|
||||
background: linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2)) padding-box;
|
||||
box-shadow: 0 1px 0 hsla(209,29%,72%,.15) inset, 0 0 0 1px hsla(209,29%,72%,.1) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
|
||||
margin: 0;
|
||||
-moz-margin-end: 3px;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton > .toolbarbutton-menubutton-button {
|
||||
-moz-box-orient: horizontal;
|
||||
}
|
||||
|
||||
.devtools-menulist:-moz-focusring,
|
||||
.devtools-toolbarbutton:-moz-focusring {
|
||||
outline: 1px dotted hsla(210,30%,85%,0.7);
|
||||
outline-offset: -4px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton > .toolbarbutton-icon {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([label]) {
|
||||
min-width: 32px;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([label]) > .toolbarbutton-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton:not([checked=true]):hover:active {
|
||||
background-color: hsla(210,18%,9%,.1);
|
||||
background-image: linear-gradient(hsla(209,13%,54%,.35), hsla(209,13%,54%,.1) 85%, hsla(209,13%,54%,.2));
|
||||
box-shadow: 0 1px 3px hsla(211,68%,6%,.5) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
|
||||
}
|
||||
|
||||
.devtools-menulist[open=true],
|
||||
.devtools-toolbarbutton[open=true],
|
||||
.devtools-toolbarbutton[checked=true] {
|
||||
border-color: hsla(211,68%,6%,.6);
|
||||
background: linear-gradient(hsla(211,68%,6%,.1), hsla(211,68%,6%,.2));
|
||||
box-shadow: 0 1px 3px hsla(211,68%,6%,.5) inset, 0 0 0 1px hsla(209,29%,72%,.1), 0 1px 0 hsla(210,16%,76%,.1);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[checked=true] {
|
||||
color: hsl(200,100%,60%) !important;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[checked=true]:hover:active {
|
||||
background-color: hsla(211,68%,6%,.2);
|
||||
}
|
||||
|
||||
.devtools-option-toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/option-icon.png");
|
||||
-moz-image-region: rect(0px 16px 16px 0px);
|
||||
background: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.devtools-option-toolbarbutton[open=true] {
|
||||
-moz-image-region: rect(0px 32px 16px 16px);
|
||||
}
|
||||
|
||||
.devtools-menulist > .menulist-label-box {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.devtools-menulist > .menulist-dropmarker {
|
||||
-moz-appearance: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
|
||||
border-width: 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.devtools-menulist:focus:not([open="true"]):not(.menulist-compact) > .menulist-label-box {
|
||||
color: hsl(210,30%,85%) !important;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-button {
|
||||
-moz-appearance: none;
|
||||
color: inherit;
|
||||
border-width: 0;
|
||||
-moz-border-end: 1px solid hsla(210,8%,5%,.45);
|
||||
box-shadow: -1px 0 0 hsla(210,16%,76%,.15) inset, 1px 0 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu-button]:-moz-locale-dir(rtl) > .toolbarbutton-menubutton-button {
|
||||
box-shadow: 1px 0 0 hsla(210,16%,76%,.15) inset, -1px 0 0 hsla(210,16%,76%,.15);
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu-button] {
|
||||
padding: 0 1px;
|
||||
-moz-box-align: stretch;
|
||||
}
|
||||
|
||||
.devtools-toolbarbutton[type=menu] > .toolbarbutton-menu-dropmarker,
|
||||
.devtools-toolbarbutton[type=menu-button] > .toolbarbutton-menubutton-dropmarker {
|
||||
-moz-appearance: none !important;
|
||||
list-style-image: url("chrome://browser/skin/devtools/dropmarker.png");
|
||||
-moz-box-align: center;
|
||||
}
|
||||
|
||||
/* Text input */
|
||||
|
||||
.devtools-textinput,
|
||||
.devtools-searchinput {
|
||||
-moz-appearance: none;
|
||||
margin: 0 3px;
|
||||
min-height: 22px;
|
||||
border: 1px solid hsla(211,68%,6%,.6);
|
||||
box-shadow: inset 0 1px 0 hsla(211,68%,6%,.05), 0 0 0 1px hsla(210,40%,83%,.1);
|
||||
border-radius: 2px;
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
|
||||
padding: 3px;
|
||||
transition-property: background-color, border-color, box-shadow;
|
||||
transition-duration: 150ms;
|
||||
transition-timing-function: ease;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.devtools-searchinput {
|
||||
background-image: url(magnifying-glass.png), linear-gradient(hsla(210,16%,76%,.15), hsla(210,16%,76%,.35));
|
||||
background-repeat: no-repeat;
|
||||
background-position: 4px center, top left, top left;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
-moz-padding-start: 18px;
|
||||
-moz-padding-end: 12px;
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
.devtools-searchinput[focused] {
|
||||
border-color: hsl(200,70%,40%) hsl(200,75%,37%) hsl(200,80%,35%);
|
||||
background-origin: padding-box;
|
||||
background-clip: padding-box;
|
||||
box-shadow: inset 0 0 0 1px hsla(211,68%,6%,.1);
|
||||
}
|
||||
|
||||
.devtools-searchinput:-moz-locale-dir(rtl) {
|
||||
background-position: calc(100% - 4px) center, top left, top left;
|
||||
}
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-search-icons {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: hsl(208,10%,66%);
|
||||
}
|
||||
|
||||
.devtools-no-search-result {
|
||||
box-shadow: inset 0 0 0 1px hsla(0,68%,6%,.35);
|
||||
border-color: hsl(10,70%,40%) hsl(10,75%,37%) hsl(10,80%,35%) !important;
|
||||
background-image: url(magnifying-glass.png), linear-gradient(hsla(1,16%,76%,.45), hsla(1,16%,76%,.75));
|
||||
}
|
||||
|
||||
/* Close button */
|
||||
|
||||
.devtools-closebutton {
|
||||
list-style-image: url("chrome://browser/skin/devtools/close.png");
|
||||
-moz-appearance: none;
|
||||
border: none;
|
||||
margin: 0 4px;
|
||||
min-width: 16px;
|
||||
width: 16px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.devtools-closebutton > .toolbarbutton-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-closebutton:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.devtools-closebutton:hover:active {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* Splitters */
|
||||
|
||||
.devtools-horizontal-splitter {
|
||||
-moz-appearance: none;
|
||||
border-width: 1px 0 0 0;
|
||||
-moz-border-top-colors: black;
|
||||
background-color: transparent;
|
||||
min-height: 3px;
|
||||
height: 3px;
|
||||
margin-bottom: -3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.devtools-side-splitter {
|
||||
border: 0;
|
||||
-moz-border-start: 1px solid #242b33;
|
||||
min-width: 0;
|
||||
width: 3px;
|
||||
background-color: transparent;
|
||||
-moz-margin-end: -3px;
|
||||
position: relative;
|
||||
cursor: e-resize;
|
||||
}
|
||||
|
||||
/* In-tools sidebar */
|
||||
|
||||
.devtools-toolbox-side-iframe {
|
||||
min-width: 465px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs {
|
||||
-moz-appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabpanels {
|
||||
-moz-appearance: none;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs {
|
||||
-moz-appearance: none;
|
||||
position: static;
|
||||
color: #b6babf;
|
||||
margin-bottom: 0;
|
||||
padding: 0;
|
||||
background-color: #343c45;
|
||||
border-width: 0 0 1px 0;
|
||||
border-color: hsla(210,8%,5%,.6);
|
||||
border-style: solid;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > .tabs-right,
|
||||
.devtools-sidebar-tabs > tabs > .tabs-left {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
-moz-appearance: none;
|
||||
/* We want to match the height of a toolbar with a toolbarbutton
|
||||
* First, we need to replicated the padding of toolbar (4px),
|
||||
* then we need to take the border of the buttons into account (1px).
|
||||
*/
|
||||
padding: 5px 3px;
|
||||
-moz-padding-start: 6px;
|
||||
margin: 0;
|
||||
min-width: 78px;
|
||||
/* toolbar's min-height is button min-height (25px) + padding (2 * 4px): 33px.
|
||||
* -1px because the parent element (<tabs>) comes with a 1px bottom border.
|
||||
*/
|
||||
min-height: 32px;
|
||||
text-shadow: 0 -1px 0 hsla(210,8%,5%,.45);
|
||||
text-align: center;
|
||||
color: inherit;
|
||||
-moz-box-flex: 1;
|
||||
border-width: 0;
|
||||
background: transparent;
|
||||
border-radius: 0;
|
||||
position: static;
|
||||
-moz-margin-start: -1px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:-moz-focusring {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:last-of-type {
|
||||
-moz-border-end-width: 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:first-of-type {
|
||||
-moz-margin-start: -3px;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
background-size: calc(100% - 2px) 100%, 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 1px, 0;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs:-moz-locale-dir(rtl) > tabs > tab {
|
||||
background-position: calc(100% - 1px), 100%;
|
||||
}
|
||||
|
||||
%filter substitution
|
||||
%define smallSeparator linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%)
|
||||
%define solidSeparator linear-gradient(#2d5b7d, #2d5b7d)
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab {
|
||||
background-image: linear-gradient(transparent, transparent), @smallSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:hover {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @smallSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab:hover:active {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @smallSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] + tab {
|
||||
background-image: linear-gradient(transparent, transparent), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.2)), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] + tab:hover:active {
|
||||
background-image: linear-gradient(hsla(206,37%,4%,.4), hsla(206,37%,4%,.4)), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true] {
|
||||
color: #f5f7fa;
|
||||
background-image: linear-gradient(#1d4f73, #1d4f73), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true]:hover {
|
||||
background-image: linear-gradient(#274f64, #274f64), @solidSeparator@;
|
||||
}
|
||||
|
||||
.devtools-sidebar-tabs > tabs > tab[selected=true]:hover:active {
|
||||
background-image: linear-gradient(#1f3e4f, #1f3e4f), @solidSeparator@;
|
||||
}
|
||||
|
||||
%include ../../shared/devtools/common.inc.css
|
@ -389,14 +389,25 @@
|
||||
}
|
||||
|
||||
#resume {
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-pause.png");
|
||||
-moz-image-region: rect(0px,16px,16px,0px);
|
||||
transition: background 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
#resume[checked] {
|
||||
background: none;
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-play.png");
|
||||
-moz-image-region: rect(0px,32px,16px,16px);
|
||||
}
|
||||
|
||||
#resume ~ toolbarbutton {
|
||||
transition: opacity 0.15s ease-in-out;
|
||||
}
|
||||
|
||||
#resume:not([checked]) ~ toolbarbutton {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#step-over {
|
||||
list-style-image: url("chrome://browser/skin/devtools/debugger-step-over.png");
|
||||
}
|
||||
|
@ -1,283 +0,0 @@
|
||||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
#toolbox-controls {
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
#toolbox-controls > toolbarbutton,
|
||||
#toolbox-dock-buttons > toolbarbutton {
|
||||
-moz-appearance: none;
|
||||
border: none;
|
||||
margin: 0 4px;
|
||||
min-width: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
#toolbox-dock-bottom {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-bottom.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-side {
|
||||
list-style-image: url("chrome://browser/skin/devtools/dock-side.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window {
|
||||
list-style-image: url("chrome://browser/skin/devtools/undock.png");
|
||||
}
|
||||
|
||||
#toolbox-dock-window,
|
||||
#toolbox-dock-bottom,
|
||||
#toolbox-dock-side {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
#toolbox-dock-window:hover,
|
||||
#toolbox-dock-bottom:hover,
|
||||
#toolbox-dock-side:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#toolbox-controls-separator {
|
||||
width: 3px;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0)),
|
||||
linear-gradient(hsla(206,37%,4%,0), hsla(206,37%,4%,.6), hsla(206,37%,4%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,0), hsla(204,45%,98%,.1), hsla(204,45%,98%,0));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0, 1px, 2px;
|
||||
-moz-margin-start: 8px;
|
||||
}
|
||||
|
||||
|
||||
/* Command buttons */
|
||||
|
||||
.command-button {
|
||||
-moz-appearance: none;
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0 8px;
|
||||
width: 16px;
|
||||
}
|
||||
|
||||
.command-button:hover {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
}
|
||||
.command-button:hover:active, .command-button[checked=true]:not(:hover) {
|
||||
background-color: hsla(206,37%,4%,.4);
|
||||
}
|
||||
|
||||
#command-button-paintflashing {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-paintflashing.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-paintflashing:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-paintflashing:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-paintflashing[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-responsive {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-responsivemode.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-responsive:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
#command-button-responsive:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
#command-button-responsive[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-tilt {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-tilt.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
#command-button-tilt:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-tilt:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
#command-button-tilt[checked=true] {
|
||||
-moz-image-region: rect(0px, 64px, 16px, 48px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad {
|
||||
list-style-image: url("chrome://browser/skin/devtools/command-scratchpad.png");
|
||||
-moz-image-region: rect(0px, 16px, 16px, 0px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover {
|
||||
-moz-image-region: rect(0px, 32px, 16px, 16px);
|
||||
}
|
||||
|
||||
#command-button-scratchpad:hover:active {
|
||||
-moz-image-region: rect(0px, 48px, 16px, 32px);
|
||||
}
|
||||
|
||||
/* Tabs */
|
||||
|
||||
.devtools-tabbar {
|
||||
-moz-appearance: none;
|
||||
background-image: url("background-noise-toolbar.png"),
|
||||
linear-gradient(#303840, #2d3640);
|
||||
border-bottom: 1px solid #060a0d;
|
||||
box-shadow: 0 1px 0 hsla(204,45%,98%,.05) inset,
|
||||
0 -1px 0 hsla(206,37%,4%,.1) inset;
|
||||
min-height: 32px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#toolbox-tabs {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.devtools-tab {
|
||||
-moz-appearance: none;
|
||||
min-width: 32px;
|
||||
min-height: 32px;
|
||||
max-width: 110px;
|
||||
color: #b6babf;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1));
|
||||
background-size: 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: left, right;
|
||||
border-top: 1px solid #060a0d;
|
||||
border-right: 1px solid hsla(206,37%,4%,.45);
|
||||
}
|
||||
|
||||
.devtools-tab > image {
|
||||
-moz-margin-end: 0;
|
||||
-moz-margin-start: 4px;
|
||||
opacity: 0.6;
|
||||
width: 16px; /* Prevents collapse during theme switching */
|
||||
}
|
||||
|
||||
#toolbox-tab-options > image {
|
||||
margin: 0 8px;
|
||||
}
|
||||
|
||||
.devtools-tab:hover > image {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.devtools-tab:active > image,
|
||||
.devtools-tab[selected=true] > image {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.devtools-tab:hover {
|
||||
background-image: linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(206,37%,4%,.1), hsla(206,37%,4%,.2));
|
||||
background-size: 1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: left, right;
|
||||
color: #ced3d9;
|
||||
}
|
||||
.devtools-tab:hover:active {
|
||||
background-color: hsla(206,37%,4%,.2);
|
||||
color: #f5f7fa;
|
||||
}
|
||||
|
||||
.devtools-tab[selected=true] {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #9fdfff, hsla(200,100%,70%,.3)),
|
||||
radial-gradient(farthest-side at center top, hsla(200,100%,70%,.4), hsla(200,100%,70%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.02), hsla(204,45%,98%,.04)),
|
||||
linear-gradient(hsla(206,37%,4%,.2), hsla(206,37%,4%,.3));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
box-shadow: 1px -1px 0 hsla(206,37%,4%,.2) inset;
|
||||
}
|
||||
|
||||
.devtools-tab:not([selected=true]).highlighted {
|
||||
color: #f5f7fa;
|
||||
background-image: radial-gradient(farthest-corner at center top, #c0ff40, hsla(80,100%,63%,.5) 70%, hsla(80,100%,63%,.3) 97%),
|
||||
radial-gradient(farthest-side at center top, hsla(80,100%,35%,.5), hsla(80,100%,35%,0)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(204,45%,98%,.05), hsla(204,45%,98%,.1)),
|
||||
linear-gradient(hsla(99,100%,14%,.2), hsla(99,100%,14%,.2));
|
||||
background-size: 100% 1px,
|
||||
100% 5px,
|
||||
1px 100%,
|
||||
1px 100%,
|
||||
100%;
|
||||
background-repeat: no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
no-repeat,
|
||||
repeat-x;
|
||||
background-position: top right, top left, left, right;
|
||||
}
|
||||
|
||||
.devtools-tab:not(.highlighted) > .highlighted-icon,
|
||||
.devtools-tab[selected=true] > .highlighted-icon,
|
||||
.devtools-tab:not([selected=true]).highlighted > .default-icon {
|
||||
visibility: collapse;
|
||||
}
|
||||
|
||||
.options-vertical-pane {
|
||||
margin: 5px;
|
||||
width: calc(50% - 30px);
|
||||
min-width: 400px;
|
||||
-moz-padding-start: 5px;
|
||||
}
|
||||
|
||||
.options-vertical-pane > label {
|
||||
padding: 2px 0;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
.options-groupbox {
|
||||
-moz-margin-start: 15px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-groupbox > * {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.options-citation-label {
|
||||
font-size: 1rem !important;
|
||||
/* !important is required otherwise font-size will still be 1.4rem */
|
||||
font-style: italic;
|
||||
padding: 4px 0 0; /* To align it with the checkbox */
|
||||
}
|
||||
|
||||
.options-citation-label + label {
|
||||
padding: 3px 0 0 !important; /* To align it with the checkbox */
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.hidden-labels-box:not(.visible) > label,
|
||||
.hidden-labels-box.visible ~ .hidden-labels-box > label:last-child {
|
||||
display: none;
|
||||
}
|
@ -50,6 +50,9 @@ browser.jar:
|
||||
skin/classic/browser/menuPanel-exit.png
|
||||
skin/classic/browser/menuPanel-help.png
|
||||
skin/classic/browser/menuPanel-small.png
|
||||
skin/classic/browser/Metro_Glyph.png (Metro_Glyph-aero.png)
|
||||
skin/classic/browser/Metro_Glyph-inverted.png
|
||||
skin/classic/browser/Metro_Glyph-menuPanel.png
|
||||
skin/classic/browser/mixed-content-blocked-16.png
|
||||
skin/classic/browser/mixed-content-blocked-64.png
|
||||
skin/classic/browser/monitor.png
|
||||
@ -170,9 +173,9 @@ browser.jar:
|
||||
skin/classic/browser/tabview/tabview.png (tabview/tabview.png)
|
||||
skin/classic/browser/tabview/tabview-inverted.png (tabview/tabview-inverted.png)
|
||||
skin/classic/browser/tabview/tabview.css (tabview/tabview.css)
|
||||
* skin/classic/browser/devtools/common.css (devtools/common.css)
|
||||
skin/classic/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
skin/classic/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
* skin/classic/browser/devtools/common.css (../shared/devtools/common.css)
|
||||
* skin/classic/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
* skin/classic/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
skin/classic/browser/devtools/controls.png (../shared/devtools/controls.png)
|
||||
* skin/classic/browser/devtools/widgets.css (devtools/widgets.css)
|
||||
skin/classic/browser/devtools/commandline-icon.png (devtools/commandline-icon.png)
|
||||
@ -253,7 +256,6 @@ browser.jar:
|
||||
skin/classic/browser/devtools/floating-scrollbars-light.css (devtools/floating-scrollbars-light.css)
|
||||
skin/classic/browser/devtools/inspector.css (devtools/inspector.css)
|
||||
skin/classic/browser/devtools/profiler-stopwatch.png (devtools/profiler-stopwatch.png)
|
||||
skin/classic/browser/devtools/toolbox.css (devtools/toolbox.css)
|
||||
skin/classic/browser/devtools/tool-options.png (devtools/tool-options.png)
|
||||
skin/classic/browser/devtools/tool-webconsole.png (devtools/tool-webconsole.png)
|
||||
skin/classic/browser/devtools/tool-debugger.png (devtools/tool-debugger.png)
|
||||
@ -354,6 +356,9 @@ browser.jar:
|
||||
skin/classic/aero/browser/menuPanel-exit.png
|
||||
skin/classic/aero/browser/menuPanel-help.png
|
||||
skin/classic/aero/browser/menuPanel-small.png (menuPanel-small-aero.png)
|
||||
skin/classic/aero/browser/Metro_Glyph.png (Metro_Glyph-aero.png)
|
||||
skin/classic/aero/browser/Metro_Glyph-inverted.png
|
||||
skin/classic/aero/browser/Metro_Glyph-menuPanel.png
|
||||
skin/classic/aero/browser/mixed-content-blocked-16.png
|
||||
skin/classic/aero/browser/mixed-content-blocked-64.png
|
||||
skin/classic/aero/browser/monitor.png
|
||||
@ -472,9 +477,9 @@ browser.jar:
|
||||
skin/classic/aero/browser/tabview/tabview.png (tabview/tabview.png)
|
||||
skin/classic/aero/browser/tabview/tabview-inverted.png (tabview/tabview-inverted.png)
|
||||
skin/classic/aero/browser/tabview/tabview.css (tabview/tabview.css)
|
||||
* skin/classic/aero/browser/devtools/common.css (devtools/common.css)
|
||||
skin/classic/aero/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
skin/classic/aero/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
* skin/classic/aero/browser/devtools/common.css (../shared/devtools/common.css)
|
||||
* skin/classic/aero/browser/devtools/dark-theme.css (../shared/devtools/dark-theme.css)
|
||||
* skin/classic/aero/browser/devtools/light-theme.css (../shared/devtools/light-theme.css)
|
||||
skin/classic/aero/browser/devtools/controls.png (../shared/devtools/controls.png)
|
||||
* skin/classic/aero/browser/devtools/widgets.css (devtools/widgets.css)
|
||||
skin/classic/aero/browser/devtools/commandline-icon.png (devtools/commandline-icon.png)
|
||||
@ -555,7 +560,6 @@ browser.jar:
|
||||
skin/classic/aero/browser/devtools/floating-scrollbars-light.css (devtools/floating-scrollbars-light.css)
|
||||
skin/classic/aero/browser/devtools/inspector.css (devtools/inspector.css)
|
||||
skin/classic/aero/browser/devtools/profiler-stopwatch.png (devtools/profiler-stopwatch.png)
|
||||
skin/classic/aero/browser/devtools/toolbox.css (devtools/toolbox.css)
|
||||
skin/classic/aero/browser/devtools/tool-options.png (devtools/tool-options.png)
|
||||
skin/classic/aero/browser/devtools/tool-webconsole.png (devtools/tool-webconsole.png)
|
||||
skin/classic/aero/browser/devtools/tool-debugger.png (devtools/tool-debugger.png)
|
||||
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 25 KiB |
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 20 KiB |
@ -31,7 +31,10 @@ _JAVA_HARNESS := \
|
||||
$(NULL)
|
||||
|
||||
java-harness := $(addprefix $(srcdir)/,$(_JAVA_HARNESS))
|
||||
java-tests := $(wildcard $(TESTPATH)/*.java)
|
||||
java-tests := \
|
||||
$(wildcard $(TESTPATH)/*.java) \
|
||||
$(wildcard $(TESTPATH)/components/*.java) \
|
||||
$(wildcard $(TESTPATH)/helpers/*.java)
|
||||
|
||||
# pre-process TestConstants.java.in
|
||||
PP_TARGETS += testconstants
|
||||
|
@ -8511,11 +8511,17 @@ FireOrClearDelayedEvents(nsTArray<nsCOMPtr<nsIDocument> >& aDocuments,
|
||||
return;
|
||||
|
||||
for (uint32_t i = 0; i < aDocuments.Length(); ++i) {
|
||||
// NB: Don't bother trying to fire delayed events on documents that were
|
||||
// closed before this event ran.
|
||||
if (!aDocuments[i]->EventHandlingSuppressed()) {
|
||||
fm->FireDelayedEvents(aDocuments[i]);
|
||||
nsCOMPtr<nsIPresShell> shell = aDocuments[i]->GetShell();
|
||||
if (shell) {
|
||||
shell->FireOrClearDelayedEvents(aFireEvents);
|
||||
// Only fire events for active documents.
|
||||
bool fire = aFireEvents &&
|
||||
aDocuments[i]->GetInnerWindow() &&
|
||||
aDocuments[i]->GetInnerWindow()->IsCurrentInnerWindow();
|
||||
shell->FireOrClearDelayedEvents(fire);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -383,7 +383,7 @@ nsXMLHttpRequest::InitParameters(bool aAnon, bool aSystem)
|
||||
|
||||
// Chrome is always allowed access, so do the permission check only
|
||||
// for non-chrome pages.
|
||||
if (!IsSystemXHR()) {
|
||||
if (!IsSystemXHR() && aSystem) {
|
||||
nsCOMPtr<nsIDocument> doc = window->GetExtantDoc();
|
||||
if (!doc) {
|
||||
return;
|
||||
|
@ -236,7 +236,7 @@ public:
|
||||
|
||||
void SetParameters(bool aAnon, bool aSystem)
|
||||
{
|
||||
mIsAnon = aAnon;
|
||||
mIsAnon = aAnon || aSystem;
|
||||
mIsSystem = aSystem;
|
||||
}
|
||||
|
||||
|
@ -5,9 +5,7 @@ function handleRequest(request, response)
|
||||
request.getHeader("Authorization") == "Basic dXNlciAxOnBhc3N3b3JkIDE=") ||
|
||||
(request.queryString == "test=user1_evtsrc" &&
|
||||
request.hasHeader("Authorization") &&
|
||||
request.getHeader("Authorization") == "Basic dXNlciAxOnBhc3N3b3JkIDE=" &&
|
||||
request.hasHeader("Cookie") &&
|
||||
request.getHeader("Cookie") == "test=5c")) {
|
||||
request.getHeader("Authorization") == "Basic dXNlciAxOnBhc3N3b3JkIDE=")) {
|
||||
response.setStatusLine(null, 200, "OK");
|
||||
response.setHeader("Content-Type", "text/event-stream", false);
|
||||
response.setHeader("Access-Control-Allow-Origin", "http://mochi.test:8888", false);
|
||||
|
@ -521,6 +521,7 @@ support-files =
|
||||
[test_bug895974.html]
|
||||
[test_bug902847.html]
|
||||
[test_bug907892.html]
|
||||
[test_bug927196.html]
|
||||
[test_caretPositionFromPoint.html]
|
||||
[test_classList.html]
|
||||
[test_copypaste.html]
|
||||
|
@ -53,12 +53,11 @@ function runTests() {
|
||||
}
|
||||
ok(xhr instanceof XMLHttpRequest, "passed " + JSON.stringify(value));
|
||||
|
||||
// If the page doesnt have privileges to create a system or anon XHR,
|
||||
// these flags will always be false no matter what is passed.
|
||||
let expectedAnon = false;
|
||||
// If the page doesnt have privileges to create a system XHR,
|
||||
// this flag will always be false no matter what is passed.
|
||||
let expectedAnon = Boolean(value && value.mozAnon);
|
||||
let expectedSystem = false;
|
||||
if (havePrivileges) {
|
||||
expectedAnon = Boolean(value && value.mozAnon);
|
||||
expectedSystem = Boolean(value && value.mozSystem);
|
||||
}
|
||||
is(xhr.mozAnon, expectedAnon, "testing mozAnon");
|
||||
@ -84,13 +83,12 @@ function runTests() {
|
||||
|
||||
// ...and once with privileges.
|
||||
havePrivileges = true;
|
||||
SpecialPowers.addPermission("systemXHR", true, document);
|
||||
SpecialPowers.pushPermissions([{'type': 'systemXHR', 'allow': true, 'context': document}], function() {
|
||||
validParameters.forEach(testValidParameter);
|
||||
invalidParameters.forEach(testInvalidParameter);
|
||||
|
||||
validParameters.forEach(testValidParameter);
|
||||
invalidParameters.forEach(testInvalidParameter);
|
||||
SpecialPowers.removePermission("systemXHR", document);
|
||||
|
||||
SimpleTest.finish();
|
||||
SimpleTest.finish();
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
@ -464,8 +464,8 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=338583
|
||||
|
||||
function doTest5_c(test_id)
|
||||
{
|
||||
// credentials using the auth cache and cookies
|
||||
var xhr = new XMLHttpRequest({mozAnon: false, mozSystem: true});
|
||||
// credentials using the auth cache
|
||||
var xhr = new XMLHttpRequest({mozAnon: true, mozSystem: true});
|
||||
xhr.withCredentials = true;
|
||||
// also, test mixed mode UI
|
||||
xhr.open("GET", "https://example.com/tests/content/base/test/file_restrictedEventSource.sjs?test=user1_xhr", true, "user 1", "password 1");
|
||||
@ -494,7 +494,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=338583
|
||||
|
||||
function doTest5_d(test_id)
|
||||
{
|
||||
var xhr = new XMLHttpRequest({mozAnon: false, mozSystem: true});
|
||||
var xhr = new XMLHttpRequest({mozAnon: true, mozSystem: true});
|
||||
xhr.withCredentials = true;
|
||||
xhr.open("GET", "https://example.com/tests/content/base/test/file_restrictedEventSource.sjs?test=user2_xhr", true, "user 2", "password 2");
|
||||
xhr.send();
|
||||
@ -521,8 +521,8 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=338583
|
||||
|
||||
function doTest5_e(test_id)
|
||||
{
|
||||
// credentials using the auth cache and cookies
|
||||
var xhr = new XMLHttpRequest({mozAnon: false, mozSystem: true});
|
||||
// credentials using the auth cache
|
||||
var xhr = new XMLHttpRequest({mozAnon: true, mozSystem: true});
|
||||
xhr.withCredentials = true;
|
||||
xhr.open("GET", "http://example.org/tests/content/base/test/file_restrictedEventSource.sjs?test=user1_xhr", true, "user 1", "password 1");
|
||||
xhr.send();
|
||||
@ -550,7 +550,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=338583
|
||||
|
||||
function doTest5_f(test_id)
|
||||
{
|
||||
var xhr = new XMLHttpRequest({mozAnon: false, mozSystem: true});
|
||||
var xhr = new XMLHttpRequest({mozAnon: true, mozSystem: true});
|
||||
xhr.withCredentials = true;
|
||||
xhr.open("GET", "http://example.org/tests/content/base/test/file_restrictedEventSource.sjs?test=user2_xhr", true, "user 2", "password 2");
|
||||
xhr.send();
|
||||
|
@ -22,7 +22,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=426308
|
||||
const SJS_URL = "http://example.org:80/tests/content/base/test/bug426308-redirect.sjs";
|
||||
|
||||
function startTest() {
|
||||
var req = new XMLHttpRequest({mozAnon: false, mozSystem: true});
|
||||
var req = new XMLHttpRequest({mozAnon: true, mozSystem: true});
|
||||
req.open("GET", SJS_URL + "?" + window.location.href, false);
|
||||
req.send(null);
|
||||
|
||||
|