зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1479006 - Move old devtools tooltip widget to debugger folder;r=nchevobbe
MozReview-Commit-ID: ATHQoGbcX2b --HG-- rename : devtools/client/shared/widgets/tooltip/Tooltip.js => devtools/client/debugger/content/tooltip/Tooltip.js rename : devtools/client/shared/widgets/tooltip/VariableContentHelper.js => devtools/client/debugger/content/tooltip/VariableContentHelper.js extra : rebase_source : decb6a1ba1f1dd554e54cf67cf9c4afb432302b5
This commit is contained in:
Julian Descottes
Родитель
c9c73b50e7
Коммит
fa08454638
|
|
@ -6,6 +6,7 @@
|
|||
DIRS += [
|
||||
'actions',
|
||||
'reducers',
|
||||
'tooltip',
|
||||
'views',
|
||||
]
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
# vim: set filetype=python:
|
||||
# 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/.
|
||||
|
||||
DevToolsModules(
|
||||
'Tooltip.js',
|
||||
'VariableContentHelper.js',
|
||||
)
|
||||
|
|
@ -0,0 +1,173 @@
|
|||
/* 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/. */
|
||||
|
||||
:root.theme-light {
|
||||
--old-tooltip-simpletext-color: black;
|
||||
--old-tooltip-simpletext-border: #d9e1e8;
|
||||
--old-tooltip-arrow-vertical: url("chrome://devtools/skin/tooltip/arrow-vertical-light.png");
|
||||
--old-tooltip-arrow-horizontal: url("chrome://devtools/skin/tooltip/arrow-horizontal-light.png");
|
||||
--old-tooltip-arrow-vertical-2x: url("chrome://devtools/skin/tooltip/arrow-vertical-light@2x.png");
|
||||
--old-tooltip-arrow-horizontal-2x: url("chrome://devtools/skin/tooltip/arrow-horizontal-light@2x.png");
|
||||
--old-tooltip-arrowcontent-background: rgba(255, 255, 255, .9);
|
||||
--old-tooltip-arrowcontent-border: #d9e1e8;
|
||||
}
|
||||
|
||||
:root.theme-dark {
|
||||
--old-tooltip-simpletext-color: white;
|
||||
--old-tooltip-simpletext-border: #434850;
|
||||
--old-tooltip-arrow-vertical: url("chrome://devtools/skin/tooltip/arrow-vertical-dark.png");
|
||||
--old-tooltip-arrow-horizontal: url("chrome://devtools/skin/tooltip/arrow-horizontal-dark.png");
|
||||
--old-tooltip-arrow-vertical-2x: url("chrome://devtools/skin/tooltip/arrow-vertical-dark@2x.png");
|
||||
--old-tooltip-arrow-horizontal-2x: url("chrome://devtools/skin/tooltip/arrow-horizontal-dark@2x.png");
|
||||
--old-tooltip-arrowcontent-background: rgba(19, 28, 38, .9);
|
||||
--old-tooltip-arrowcontent-border: #434850;
|
||||
}
|
||||
|
||||
.devtools-tooltip .panel-arrowcontent {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.devtools-tooltip .panel-arrowcontainer {
|
||||
/* Reseting the transition used when panels are shown */
|
||||
transition: none;
|
||||
/* Panels slide up/down/left/right when they appear using a transform.
|
||||
Since we want to remove the transition, we don't need to transform anymore
|
||||
plus it can interfeer by causing mouseleave events on the underlying nodes */
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.devtools-tooltip[clamped-dimensions] {
|
||||
min-height: 100px;
|
||||
max-height: 400px;
|
||||
min-width: 100px;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.devtools-tooltip[clamped-dimensions-no-min-height] {
|
||||
min-height: 0;
|
||||
max-height: 400px;
|
||||
min-width: 100px;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.devtools-tooltip[clamped-dimensions-no-max-or-min-height] {
|
||||
min-width: 400px;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
.devtools-tooltip[clamped-dimensions] .panel-arrowcontent,
|
||||
.devtools-tooltip[clamped-dimensions-no-min-height] .panel-arrowcontent,
|
||||
.devtools-tooltip[clamped-dimensions-no-max-or-min-height] .panel-arrowcontent {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.devtools-tooltip[wide] {
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
/* Tooltip: Simple Text */
|
||||
|
||||
.devtools-tooltip-simple-text {
|
||||
max-width: 400px;
|
||||
margin: 0 -4px; /* Compensate for the .panel-arrowcontent padding. */
|
||||
padding: 8px 12px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.devtools-tooltip-simple-text:first-child {
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.devtools-tooltip-simple-text:last-child {
|
||||
margin-bottom: -4px;
|
||||
}
|
||||
|
||||
/* Tooltip: Variables View */
|
||||
|
||||
.devtools-tooltip-variables-view-box {
|
||||
margin: -4px; /* Compensate for the .panel-arrowcontent padding. */
|
||||
}
|
||||
|
||||
.devtools-tooltip-variables-view-box .variable-or-property > .title {
|
||||
padding-inline-end: 6px;
|
||||
}
|
||||
|
||||
.devtools-tooltip-iframe {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* Overring panel arrow images to fit with our light and dark themes */
|
||||
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrowcontent {
|
||||
padding: 4px;
|
||||
background: var(--old-tooltip-arrowcontent-background);
|
||||
border-radius: 5px;
|
||||
box-shadow: none;
|
||||
border: 3px solid var(--old-tooltip-arrowcontent-border);
|
||||
}
|
||||
|
||||
/* Overring panel arrow images to fit with our light and dark themes */
|
||||
|
||||
.theme-tooltip-panel .panel-arrow {
|
||||
--arrow-margin: -4px;
|
||||
}
|
||||
|
||||
:root[platform="win"] .theme-tooltip-panel .panel-arrow {
|
||||
--arrow-margin: -7px;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="top"],
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
list-style-image: var(--old-tooltip-arrow-vertical);
|
||||
/* !important is needed to override the popup.css rules in toolkit/themes */
|
||||
width: 39px !important;
|
||||
height: 16px !important;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"],
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
list-style-image: var(--old-tooltip-arrow-horizontal);
|
||||
/* !important is needed to override the popup.css rules in toolkit/themes */
|
||||
width: 16px !important;
|
||||
height: 39px !important;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="top"] {
|
||||
margin-bottom: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
margin-top: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"] {
|
||||
margin-right: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
margin-left: var(--arrow-margin);
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.theme-tooltip-panel .panel-arrow[side="top"],
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
list-style-image: var(--old-tooltip-arrow-vertical-2x);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"],
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
list-style-image: var(--old-tooltip-arrow-horizontal-2x);
|
||||
}
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text {
|
||||
color: var(--old-tooltip-simpletext-color);
|
||||
border-bottom: 1px solid var(--old-tooltip-simpletext-border);
|
||||
}
|
||||
|
|
@ -147,7 +147,7 @@ var DevToolsUtils = require("devtools/shared/DevToolsUtils");
|
|||
var promise = require("devtools/shared/deprecated-sync-thenables");
|
||||
var Editor = require("devtools/client/sourceeditor/editor");
|
||||
var DebuggerEditor = require("devtools/client/sourceeditor/debugger");
|
||||
var Tooltip = require("devtools/client/shared/widgets/tooltip/Tooltip");
|
||||
var Tooltip = require("./content/tooltip/Tooltip");
|
||||
var FastListWidget = require("devtools/client/shared/widgets/FastListWidget");
|
||||
var {LocalizationHelper, ELLIPSIS} = require("devtools/shared/l10n");
|
||||
var {PrefsHelper} = require("devtools/client/shared/prefs");
|
||||
|
|
|
|||
|
|
@ -5,8 +5,10 @@
|
|||
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://devtools/content/shared/widgets/widgets.css" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://devtools/content/debugger/debugger.css" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://devtools/content/debugger/content/tooltip/tooltips-old.css" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://devtools/skin/widgets.css" type="text/css"?>
|
||||
<?xml-stylesheet href="chrome://devtools/skin/debugger.css" type="text/css"?>
|
||||
|
||||
<!DOCTYPE window [
|
||||
<!ENTITY % debuggerDTD SYSTEM "chrome://devtools/locale/debugger.dtd">
|
||||
%debuggerDTD;
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
/* globals document, window */
|
||||
"use strict";
|
||||
|
||||
const {setTooltipVariableContent} = require("devtools/client/shared/widgets/tooltip/VariableContentHelper");
|
||||
const {setTooltipVariableContent} = require("devtools/client/debugger/content/tooltip/VariableContentHelper");
|
||||
|
||||
/**
|
||||
* Functions handling the variables bubble UI.
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@ devtools.jar:
|
|||
content/sourceeditor/codemirror/old-debugger.css (sourceeditor/codemirror/old-debugger.css)
|
||||
content/debugger/new/index.html (debugger/new/index.html)
|
||||
* content/debugger/index.xul (debugger/index.xul)
|
||||
content/debugger/content/tooltip/tooltips-old.css (debugger/content/tooltip/tooltips-old.css)
|
||||
content/debugger/debugger.css (debugger/debugger.css)
|
||||
content/debugger/debugger-controller.js (debugger/debugger-controller.js)
|
||||
content/debugger/debugger-view.js (debugger/debugger-view.js)
|
||||
|
|
|
|||
|
|
@ -13,8 +13,6 @@ DevToolsModules(
|
|||
'SwatchColorPickerTooltip.js',
|
||||
'SwatchCubicBezierTooltip.js',
|
||||
'SwatchFilterTooltip.js',
|
||||
'Tooltip.js',
|
||||
'TooltipToggle.js',
|
||||
'VariableContentHelper.js',
|
||||
'VariableTooltipHelper.js'
|
||||
)
|
||||
|
|
|
|||
|
|
@ -259,79 +259,6 @@ div.CodeMirror span.eval-text {
|
|||
min-height: 1.4em;
|
||||
}
|
||||
|
||||
/* XUL panel styling (see devtools/client/shared/widgets/tooltip/Tooltip.js) */
|
||||
|
||||
.theme-tooltip-panel .panel-arrowcontent {
|
||||
padding: 5px;
|
||||
background: rgba(19, 28, 38, .9);
|
||||
border-radius: 5px;
|
||||
box-shadow: none;
|
||||
border: 3px solid #434850;
|
||||
}
|
||||
|
||||
/* Overring panel arrow images to fit with our light and dark themes */
|
||||
|
||||
.theme-tooltip-panel .panel-arrow {
|
||||
--arrow-margin: -4px;
|
||||
}
|
||||
|
||||
:root[platform="win"] .theme-tooltip-panel .panel-arrow {
|
||||
--arrow-margin: -7px;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="top"],
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-vertical-dark.png");
|
||||
/* !important is needed to override the popup.css rules in toolkit/themes */
|
||||
width: 39px !important;
|
||||
height: 16px !important;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"],
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-horizontal-dark.png");
|
||||
/* !important is needed to override the popup.css rules in toolkit/themes */
|
||||
width: 16px !important;
|
||||
height: 39px !important;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="top"] {
|
||||
margin-bottom: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
margin-top: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"] {
|
||||
margin-right: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
margin-left: var(--arrow-margin);
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.theme-tooltip-panel .panel-arrow[side="top"],
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-vertical-dark@2x.png");
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"],
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-horizontal-dark@2x.png");
|
||||
}
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text {
|
||||
color: white;
|
||||
border-bottom: 1px solid #434850;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.devtools-textinput,
|
||||
.devtools-searchinput,
|
||||
.devtools-filterinput {
|
||||
|
|
|
|||
|
|
@ -242,79 +242,6 @@ div.CodeMirror span.eval-text {
|
|||
min-height: 1.4em;
|
||||
}
|
||||
|
||||
/* XUL panel styling (see devtools/client/shared/widgets/tooltip/Tooltip.js) */
|
||||
|
||||
.theme-tooltip-panel .panel-arrowcontent {
|
||||
padding: 4px;
|
||||
background: rgba(255, 255, 255, .9);
|
||||
border-radius: 5px;
|
||||
box-shadow: none;
|
||||
border: 3px solid #d9e1e8;
|
||||
}
|
||||
|
||||
/* Overring panel arrow images to fit with our light and dark themes */
|
||||
|
||||
.theme-tooltip-panel .panel-arrow {
|
||||
--arrow-margin: -4px;
|
||||
}
|
||||
|
||||
:root[platform="win"] .theme-tooltip-panel .panel-arrow {
|
||||
--arrow-margin: -7px;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="top"],
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-vertical-light.png");
|
||||
/* !important is needed to override the popup.css rules in toolkit/themes */
|
||||
width: 39px !important;
|
||||
height: 16px !important;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"],
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-horizontal-light.png");
|
||||
/* !important is needed to override the popup.css rules in toolkit/themes */
|
||||
width: 16px !important;
|
||||
height: 39px !important;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="top"] {
|
||||
margin-bottom: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
margin-top: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"] {
|
||||
margin-right: var(--arrow-margin);
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
margin-left: var(--arrow-margin);
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
.theme-tooltip-panel .panel-arrow[side="top"],
|
||||
.theme-tooltip-panel .panel-arrow[side="bottom"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-vertical-light@2x.png");
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .panel-arrow[side="left"],
|
||||
.theme-tooltip-panel .panel-arrow[side="right"] {
|
||||
list-style-image: url("chrome://devtools/skin/tooltip/arrow-horizontal-light@2x.png");
|
||||
}
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text {
|
||||
color: black;
|
||||
border-bottom: 1px solid #d9e1e8;
|
||||
}
|
||||
|
||||
.theme-tooltip-panel .devtools-tooltip-simple-text:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.CodeMirror-hints,
|
||||
.CodeMirror-Tern-tooltip {
|
||||
box-shadow: 0 0 4px rgba(128, 128, 128, .5);
|
||||
|
|
|
|||
|
|
@ -24,46 +24,6 @@
|
|||
--onboarding-link-active-color: var(--blue-70);
|
||||
}
|
||||
|
||||
/* Tooltip widget (see devtools/client/shared/widgets/tooltip/Tooltip.js) */
|
||||
|
||||
.devtools-tooltip .panel-arrowcontent {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.devtools-tooltip .panel-arrowcontainer {
|
||||
/* Reseting the transition used when panels are shown */
|
||||
transition: none;
|
||||
/* Panels slide up/down/left/right when they appear using a transform.
|
||||
Since we want to remove the transition, we don't need to transform anymore
|
||||
plus it can interfeer by causing mouseleave events on the underlying nodes */
|
||||
transform: none;
|
||||
}
|
||||
|
||||
.devtools-tooltip[clamped-dimensions] {
|
||||
min-height: 100px;
|
||||
max-height: 400px;
|
||||
min-width: 100px;
|
||||
max-width: 400px;
|
||||
}
|
||||
.devtools-tooltip[clamped-dimensions-no-min-height] {
|
||||
min-height: 0;
|
||||
max-height: 400px;
|
||||
min-width: 100px;
|
||||
max-width: 400px;
|
||||
}
|
||||
.devtools-tooltip[clamped-dimensions-no-max-or-min-height] {
|
||||
min-width: 400px;
|
||||
max-width: 400px;
|
||||
}
|
||||
.devtools-tooltip[clamped-dimensions] .panel-arrowcontent,
|
||||
.devtools-tooltip[clamped-dimensions-no-min-height] .panel-arrowcontent,
|
||||
.devtools-tooltip[clamped-dimensions-no-max-or-min-height] .panel-arrowcontent {
|
||||
overflow: hidden;
|
||||
}
|
||||
.devtools-tooltip[wide] {
|
||||
max-width: 600px;
|
||||
}
|
||||
|
||||
/* Tooltip: CSS variables tooltip */
|
||||
|
||||
.devtools-tooltip-css-variable {
|
||||
|
|
@ -71,33 +31,6 @@
|
|||
padding: 2px;
|
||||
}
|
||||
|
||||
/* Tooltip: Simple Text */
|
||||
|
||||
.devtools-tooltip-simple-text {
|
||||
max-width: 400px;
|
||||
margin: 0 -4px; /* Compensate for the .panel-arrowcontent padding. */
|
||||
padding: 8px 12px;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.devtools-tooltip-simple-text:first-child {
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.devtools-tooltip-simple-text:last-child {
|
||||
margin-bottom: -4px;
|
||||
}
|
||||
|
||||
/* Tooltip: Variables View */
|
||||
|
||||
.devtools-tooltip-variables-view-box {
|
||||
margin: -4px; /* Compensate for the .panel-arrowcontent padding. */
|
||||
}
|
||||
|
||||
.devtools-tooltip-variables-view-box .variable-or-property > .title {
|
||||
padding-inline-end: 6px;
|
||||
}
|
||||
|
||||
/* Tooltip: Tiles */
|
||||
|
||||
.devtools-tooltip-tiles {
|
||||
|
|
@ -108,11 +41,6 @@
|
|||
background-position: 0 0, 10px 10px;
|
||||
}
|
||||
|
||||
.devtools-tooltip-iframe {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.tooltip-container {
|
||||
display: none;
|
||||
position: fixed;
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче