The Tor Browser / file comparison
comparison: browser/devtools/styleinspector/computedview.xhtml
browser/devtools/styleinspector/computedview.xhtml
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:852d9183baa4 |
|---|---|
| 1 <?xml version="1.0"?> | |
| 2 <!-- This Source Code Form is subject to the terms of the Mozilla Public | |
| 3 - License, v. 2.0. If a copy of the MPL was not distributed with this | |
| 4 - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> | |
| 5 | |
| 6 <!DOCTYPE window [ | |
| 7 <!ENTITY % inspectorDTD SYSTEM "chrome://browser/locale/devtools/styleinspector.dtd"> | |
| 8 %inspectorDTD; | |
| 9 <!ELEMENT loop ANY> | |
| 10 <!ATTLIST li foreach CDATA #IMPLIED> | |
| 11 <!ATTLIST div foreach CDATA #IMPLIED> | |
| 12 <!ATTLIST loop foreach CDATA #IMPLIED> | |
| 13 <!ATTLIST a target CDATA #IMPLIED> | |
| 14 <!ATTLIST a __pathElement CDATA #IMPLIED> | |
| 15 <!ATTLIST div _id CDATA #IMPLIED> | |
| 16 <!ATTLIST div save CDATA #IMPLIED> | |
| 17 <!ATTLIST table save CDATA #IMPLIED> | |
| 18 <!ATTLIST loop if CDATA #IMPLIED> | |
| 19 <!ATTLIST tr if CDATA #IMPLIED> | |
| 20 ]> | |
| 21 | |
| 22 <html xmlns="http://www.w3.org/1999/xhtml" | |
| 23 xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" | |
| 24 class="theme-sidebar"> | |
| 25 | |
| 26 <head> | |
| 27 | |
| 28 <title>&computedViewTitle;</title> | |
| 29 | |
| 30 <link rel="stylesheet" href="chrome://global/skin/global.css" type="text/css"/> | |
| 31 <link rel="stylesheet" href="chrome://browser/skin/devtools/common.css" type="text/css"/> | |
| 32 <link rel="stylesheet" href="chrome://browser/skin/devtools/computedview.css" type="text/css"/> | |
| 33 | |
| 34 <script type="application/javascript;version=1.8" src="theme-switching.js"/> | |
| 35 | |
| 36 <script type="application/javascript;version=1.8"> | |
| 37 window.setPanel = function(panel, iframe) { | |
| 38 let {devtools} = Components.utils.import("resource://gre/modules/devtools/Loader.jsm", {}); | |
| 39 let inspector = devtools.require("devtools/styleinspector/style-inspector"); | |
| 40 this.computedview = new inspector.ComputedViewTool(panel, window, iframe); | |
| 41 } | |
| 42 window.onunload = function() { | |
| 43 if (this.computedview) { | |
| 44 this.computedview.destroy(); | |
| 45 } | |
| 46 } | |
| 47 </script> | |
| 48 </head> | |
| 49 | |
| 50 <body> | |
| 51 | |
| 52 <!-- The output from #templateProperty (below) is appended here. --> | |
| 53 <div id="propertyContainer" class="devtools-monospace"> | |
| 54 </div> | |
| 55 | |
| 56 <!-- When no properties are found the following block is displayed. --> | |
| 57 <div id="noResults" hidden=""> | |
| 58 &noPropertiesFound; | |
| 59 </div> | |
| 60 | |
| 61 <!-- The output from #templateRoot (below) is inserted here. --> | |
| 62 <div id="root" class="devtools-monospace"></div> | |
| 63 | |
| 64 <!-- | |
| 65 To visually debug the templates without running firefox, alter the display:none | |
| 66 --> | |
| 67 <div style="display:none;"> | |
| 68 <!-- | |
| 69 templateRoot sits at the top of the window and contains the "include default | |
| 70 styles" checkbox. For data it needs an instance of CssHtmlTree. | |
| 71 --> | |
| 72 <div id="templateRoot"> | |
| 73 <xul:hbox class="devtools-toolbar" flex="1" align="center"> | |
| 74 <xul:checkbox class="includebrowserstyles" | |
| 75 save="${includeBrowserStylesCheckbox}" | |
| 76 oncommand="${includeBrowserStylesChanged}" checked="false" | |
| 77 label="&browserStylesLabel;"/> | |
| 78 <xul:textbox class="devtools-searchinput" type="search" save="${searchField}" | |
| 79 placeholder="&userStylesSearch;" flex="1" | |
| 80 oncommand="${filterChanged}"/> | |
| 81 </xul:hbox> | |
| 82 </div> | |
| 83 | |
| 84 | |
| 85 <!-- | |
| 86 A templateMatchedSelectors sits inside each templateProperties showing the | |
| 87 list of selectors that affect that property. Each needs data like this: | |
| 88 { | |
| 89 matchedSelectorViews: ..., // from cssHtmlTree.propertyViews[name].matchedSelectorViews | |
| 90 } | |
| 91 This is a template so the parent does not need to be a table, except that | |
| 92 using a div as the parent causes the DOM to muck with the tr elements | |
| 93 --> | |
| 94 <div id="templateMatchedSelectors"> | |
| 95 <loop foreach="selector in ${matchedSelectorViews}"> | |
| 96 <p> | |
| 97 <span class="rule-link"> | |
| 98 <a target="_blank" class="link theme-link" | |
| 99 onclick="${selector.openStyleEditor}" | |
| 100 onkeydown="${selector.maybeOpenStyleEditor}" | |
| 101 title="${selector.href}" | |
| 102 sourcelocation="${selector.source}" | |
| 103 tabindex="0">${selector.source}</a> | |
| 104 </span> | |
| 105 <span dir="ltr" class="rule-text ${selector.statusClass} theme-fg-color3" title="${selector.statusText}"> | |
| 106 ${selector.sourceText} | |
| 107 <span class="other-property-value theme-fg-color1">${selector.outputFragment}</span> | |
| 108 </span> | |
| 109 </p> | |
| 110 </loop> | |
| 111 </div> | |
| 112 </div> | |
| 113 | |
| 114 </body> | |
| 115 </html> |
