From 976787c0273b2f4d60e979dc7754d76acbaea8ed Mon Sep 17 00:00:00 2001 From: Horst3180 Date: Thu, 24 Sep 2015 02:11:04 +0200 Subject: update to 42.0b1 --- .../chrome/browser/devtools/canvasdebugger.css | 4 - .../chrome/browser/devtools/computedview.css | 5 - .../chrome/browser/devtools/dark-theme.css | 36 ++---- .../chrome/browser/devtools/debugger.css | 8 +- .../chrome/browser/devtools/filetype-dir-close.svg | 2 +- .../chrome/browser/devtools/filetype-dir-open.svg | 2 +- .../chrome/browser/devtools/filetype-globe.svg | 2 +- .../chrome/browser/devtools/filetype-store.svg | 2 +- .../chrome/browser/devtools/filters.svg | 22 ++-- .../chrome/browser/devtools/light-theme.css | 36 ++---- .../chrome/browser/devtools/netmonitor.css | 15 +-- .../chrome/browser/devtools/performance.css | 12 +- .../chrome/browser/devtools/promisedebugger.css | 3 + .../chrome/browser/devtools/ruleview.css | 16 ++- .../chrome/browser/devtools/scratchpad.css | 4 - .../chrome/browser/devtools/shadereditor.css | 4 - .../chrome/browser/devtools/splitview.css | 17 --- .../chrome/browser/devtools/storage.css | 4 +- .../chrome/browser/devtools/webaudioeditor.css | 4 - .../chrome/browser/devtools/widgets.css | 144 ++++++++------------- 20 files changed, 118 insertions(+), 224 deletions(-) create mode 100644 arc-firefox-theme/chrome/browser/devtools/promisedebugger.css (limited to 'arc-firefox-theme/chrome/browser/devtools') diff --git a/arc-firefox-theme/chrome/browser/devtools/canvasdebugger.css b/arc-firefox-theme/chrome/browser/devtools/canvasdebugger.css index 69e847c..a749260 100644 --- a/arc-firefox-theme/chrome/browser/devtools/canvasdebugger.css +++ b/arc-firefox-theme/chrome/browser/devtools/canvasdebugger.css @@ -1,7 +1,3 @@ -/* 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/. */ - /* 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/. */ diff --git a/arc-firefox-theme/chrome/browser/devtools/computedview.css b/arc-firefox-theme/chrome/browser/devtools/computedview.css index f8b0d62..f770681 100644 --- a/arc-firefox-theme/chrome/browser/devtools/computedview.css +++ b/arc-firefox-theme/chrome/browser/devtools/computedview.css @@ -124,11 +124,6 @@ body { border-bottom-width: 1px; } -/* This rule is necessary because Templater.jsm breaks LTR TDs in RTL docs */ -.rule-text { - direction: ltr; -} - .matched { text-decoration: line-through; } diff --git a/arc-firefox-theme/chrome/browser/devtools/dark-theme.css b/arc-firefox-theme/chrome/browser/devtools/dark-theme.css index bfc0fa1..53a868f 100644 --- a/arc-firefox-theme/chrome/browser/devtools/dark-theme.css +++ b/arc-firefox-theme/chrome/browser/devtools/dark-theme.css @@ -138,7 +138,7 @@ .cm-s-mozilla .cm-unused-line { text-decoration: line-through; - text-decoration-color: #5f88b0; + text-decoration-color: #0072ab; } .cm-s-mozilla .cm-executed-line { @@ -953,73 +953,57 @@ div.CodeMirror span.eval-text { text-shadow: none; } -.devtools-sidebar-tabs tabs > tab:first-child { - -moz-border-start-width: 0; +.devtools-sidebar-tabs tabs > tab { + border-image: linear-gradient(transparent 15%, var(--theme-splitter-color) 15%, var(--theme-splitter-color) 85%, transparent 85%) 1 1; } -.theme-dark .devtools-sidebar-tabs tabs > tab { - border-image: linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%) 1 1; +.devtools-sidebar-tabs tabs > tab[selected], +.devtools-sidebar-tabs tabs > tab[selected] + tab { + border-image: linear-gradient(var(--theme-splitter-color), var(--theme-splitter-color)) 1 1; +} + +.devtools-sidebar-tabs tabs > tab:first-child { + -moz-border-start-width: 0; } .theme-dark .devtools-sidebar-tabs tabs > tab:hover { background: hsla(206,37%,4%,.2); - border-image: linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab:hover:active { background: hsla(206,37%,4%,.4); - border-image: linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%) 1 1; -} - -.theme-dark .devtools-sidebar-tabs tabs > tab[selected] + tab { - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab[selected] + tab:hover { background: hsla(206,37%,4%,.2); - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab[selected] + tab:hover:active { background: hsla(206,37%,4%,.4); - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab[selected], .theme-dark .devtools-sidebar-tabs tabs > tab[selected]:hover:active { color: var(--theme-selection-color); background: #1d4f73; - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; -} - -.theme-light .devtools-sidebar-tabs tabs > tab { - border-image: linear-gradient(transparent 15%, #aaa 15%, #aaa 85%, transparent 85%) 1 1; } .theme-light .devtools-sidebar-tabs tabs > tab:hover { background: #ddd; - border-image: linear-gradient(transparent 15%, #aaa 15%, #aaa 85%, transparent 85%) 1 1; } .theme-light .devtools-sidebar-tabs tabs > tab:hover:active { background: #ddd; - border-image: linear-gradient(transparent 15%, #aaa 15%, #aaa 85%, transparent 85%) 1 1; -} - -.theme-light .devtools-sidebar-tabs tabs > tab[selected] + tab { - border-image: linear-gradient(#aaa, #aaa); } .theme-light .devtools-sidebar-tabs tabs > tab[selected] + tab:hover { background: #ddd; - border-image: linear-gradient(#aaa, #aaa); } .theme-light .devtools-sidebar-tabs tabs > tab[selected], .theme-light .devtools-sidebar-tabs tabs > tab[selected]:hover:active { color: var(--theme-selection-color); background: #4c9ed9; - border-image: linear-gradient(#aaa, #aaa); } /* Toolbox - moved from toolbox.css. diff --git a/arc-firefox-theme/chrome/browser/devtools/debugger.css b/arc-firefox-theme/chrome/browser/devtools/debugger.css index fb7be09..97eb3b0 100644 --- a/arc-firefox-theme/chrome/browser/devtools/debugger.css +++ b/arc-firefox-theme/chrome/browser/devtools/debugger.css @@ -1,7 +1,3 @@ -/* 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/. */ - /* 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 @@ -96,6 +92,10 @@ } } +#toggle-promise-debugger { + /* TODO Bug 1186119: Add a toggle promise debugger image */ +} + #sources-toolbar .devtools-toolbarbutton:not([label]) { -moz-image-region: rect(0px,16px,16px,0px); } diff --git a/arc-firefox-theme/chrome/browser/devtools/filetype-dir-close.svg b/arc-firefox-theme/chrome/browser/devtools/filetype-dir-close.svg index fa893f4..ae6f221 100644 --- a/arc-firefox-theme/chrome/browser/devtools/filetype-dir-close.svg +++ b/arc-firefox-theme/chrome/browser/devtools/filetype-dir-close.svg @@ -2,6 +2,6 @@ - + diff --git a/arc-firefox-theme/chrome/browser/devtools/filetype-dir-open.svg b/arc-firefox-theme/chrome/browser/devtools/filetype-dir-open.svg index 1faebe4..c7fafc2 100644 --- a/arc-firefox-theme/chrome/browser/devtools/filetype-dir-open.svg +++ b/arc-firefox-theme/chrome/browser/devtools/filetype-dir-open.svg @@ -2,6 +2,6 @@ - + diff --git a/arc-firefox-theme/chrome/browser/devtools/filetype-globe.svg b/arc-firefox-theme/chrome/browser/devtools/filetype-globe.svg index bf1fe2d..a5580b4 100644 --- a/arc-firefox-theme/chrome/browser/devtools/filetype-globe.svg +++ b/arc-firefox-theme/chrome/browser/devtools/filetype-globe.svg @@ -2,5 +2,5 @@ - 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/. --> - + diff --git a/arc-firefox-theme/chrome/browser/devtools/filetype-store.svg b/arc-firefox-theme/chrome/browser/devtools/filetype-store.svg index 01d3625..c85c560 100644 --- a/arc-firefox-theme/chrome/browser/devtools/filetype-store.svg +++ b/arc-firefox-theme/chrome/browser/devtools/filetype-store.svg @@ -1,7 +1,7 @@ - + diff --git a/arc-firefox-theme/chrome/browser/devtools/filters.svg b/arc-firefox-theme/chrome/browser/devtools/filters.svg index 1f51d32..700fdbf 100644 --- a/arc-firefox-theme/chrome/browser/devtools/filters.svg +++ b/arc-firefox-theme/chrome/browser/devtools/filters.svg @@ -3,20 +3,14 @@ - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> - - - - - - - - - - - - - - + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/devtools/light-theme.css b/arc-firefox-theme/chrome/browser/devtools/light-theme.css index ea8b1fe..92515ff 100644 --- a/arc-firefox-theme/chrome/browser/devtools/light-theme.css +++ b/arc-firefox-theme/chrome/browser/devtools/light-theme.css @@ -28,7 +28,7 @@ --theme-highlight-green: #2cbb0f; --theme-highlight-blue: #0088cc; - --theme-highlight-bluegrey: #5f88b0; + --theme-highlight-bluegrey: #0072ab; --theme-highlight-purple: #5b5fff; --theme-highlight-lightorange: #d97e00; --theme-highlight-orange: #f13c00; @@ -951,73 +951,57 @@ div.CodeMirror span.eval-text { text-shadow: none; } -.devtools-sidebar-tabs tabs > tab:first-child { - -moz-border-start-width: 0; +.devtools-sidebar-tabs tabs > tab { + border-image: linear-gradient(transparent 15%, var(--theme-splitter-color) 15%, var(--theme-splitter-color) 85%, transparent 85%) 1 1; } -.theme-dark .devtools-sidebar-tabs tabs > tab { - border-image: linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%) 1 1; +.devtools-sidebar-tabs tabs > tab[selected], +.devtools-sidebar-tabs tabs > tab[selected] + tab { + border-image: linear-gradient(var(--theme-splitter-color), var(--theme-splitter-color)) 1 1; +} + +.devtools-sidebar-tabs tabs > tab:first-child { + -moz-border-start-width: 0; } .theme-dark .devtools-sidebar-tabs tabs > tab:hover { background: hsla(206,37%,4%,.2); - border-image: linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab:hover:active { background: hsla(206,37%,4%,.4); - border-image: linear-gradient(transparent 15%, #5a6169 15%, #5a6169 85%, transparent 85%) 1 1; -} - -.theme-dark .devtools-sidebar-tabs tabs > tab[selected] + tab { - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab[selected] + tab:hover { background: hsla(206,37%,4%,.2); - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab[selected] + tab:hover:active { background: hsla(206,37%,4%,.4); - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; } .theme-dark .devtools-sidebar-tabs tabs > tab[selected], .theme-dark .devtools-sidebar-tabs tabs > tab[selected]:hover:active { color: var(--theme-selection-color); background: #1d4f73; - border-image: linear-gradient(#2d5b7d, #2d5b7d) 1 1; -} - -.theme-light .devtools-sidebar-tabs tabs > tab { - border-image: linear-gradient(transparent 15%, #aaa 15%, #aaa 85%, transparent 85%) 1 1; } .theme-light .devtools-sidebar-tabs tabs > tab:hover { background: #ddd; - border-image: linear-gradient(transparent 15%, #aaa 15%, #aaa 85%, transparent 85%) 1 1; } .theme-light .devtools-sidebar-tabs tabs > tab:hover:active { background: #ddd; - border-image: linear-gradient(transparent 15%, #aaa 15%, #aaa 85%, transparent 85%) 1 1; -} - -.theme-light .devtools-sidebar-tabs tabs > tab[selected] + tab { - border-image: linear-gradient(#aaa, #aaa); } .theme-light .devtools-sidebar-tabs tabs > tab[selected] + tab:hover { background: #ddd; - border-image: linear-gradient(#aaa, #aaa); } .theme-light .devtools-sidebar-tabs tabs > tab[selected], .theme-light .devtools-sidebar-tabs tabs > tab[selected]:hover:active { color: var(--theme-selection-color); background: #4c9ed9; - border-image: linear-gradient(#aaa, #aaa); } /* Toolbox - moved from toolbox.css. diff --git a/arc-firefox-theme/chrome/browser/devtools/netmonitor.css b/arc-firefox-theme/chrome/browser/devtools/netmonitor.css index 92f2efc..9448a39 100644 --- a/arc-firefox-theme/chrome/browser/devtools/netmonitor.css +++ b/arc-firefox-theme/chrome/browser/devtools/netmonitor.css @@ -143,31 +143,28 @@ } .requests-security-state-icon { + width: 16px; + height: 16px; -moz-margin-end: 4px; - -moz-image-region:rect(0px, 16px, 16px, 0px); -} - -.requests-security-state-icon:hover { - -moz-image-region: rect(0px, 32px, 16px, 16px); } .security-state-insecure { - list-style-image: url(chrome://browser/skin/identity-icons-generic.png); + list-style-image: url(chrome://browser/skin/identity-not-secure.svg); } .security-state-secure { cursor: pointer; - list-style-image: url(chrome://browser/skin/identity-icons-https.png); + list-style-image: url(chrome://browser/skin/identity-secure.svg); } .security-state-weak { cursor: pointer; - list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-display.png); + list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg); } .security-state-broken { cursor: pointer; - list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-active.png); + list-style-image: url(chrome://browser/skin/identity-mixed-active-loaded.svg); } .requests-menu-type { diff --git a/arc-firefox-theme/chrome/browser/devtools/performance.css b/arc-firefox-theme/chrome/browser/devtools/performance.css index 1187fd8..8eafa36 100644 --- a/arc-firefox-theme/chrome/browser/devtools/performance.css +++ b/arc-firefox-theme/chrome/browser/devtools/performance.css @@ -1,7 +1,3 @@ -/* 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/. */ - /* 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, @@ -225,10 +221,10 @@ width: 4.5vw; } -.call-tree-header[type="allocations"], -.call-tree-cell[type="allocations"], -.call-tree-header[type="self-allocations"], -.call-tree-cell[type="self-allocations"] { +.call-tree-header[type="count"], +.call-tree-cell[type="count"], +.call-tree-header[type="self-count"], +.call-tree-cell[type="self-count"] { width: 9vw; } diff --git a/arc-firefox-theme/chrome/browser/devtools/promisedebugger.css b/arc-firefox-theme/chrome/browser/devtools/promisedebugger.css new file mode 100644 index 0000000..e003224 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/devtools/promisedebugger.css @@ -0,0 +1,3 @@ +/* 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/. */ diff --git a/arc-firefox-theme/chrome/browser/devtools/ruleview.css b/arc-firefox-theme/chrome/browser/devtools/ruleview.css index c38224c..8fad666 100644 --- a/arc-firefox-theme/chrome/browser/devtools/ruleview.css +++ b/arc-firefox-theme/chrome/browser/devtools/ruleview.css @@ -243,14 +243,28 @@ border-bottom-color: hsl(0,0%,50%); } -.ruleview-selector { +.ruleview-selectorcontainer { word-wrap: break-word; + cursor: text; } .ruleview-selector-separator, .ruleview-selector-unmatched { color: #888; } +.ruleview-selector-matched > .ruleview-selector-attribute { + /* TODO: Bug 1178535 Awaiting UX feedback on highlight colors */ +} + +.ruleview-selector-matched > .ruleview-selector-pseudo-class { + /* TODO: Bug 1178535 Awaiting UX feedback on highlight colors */ +} + +.ruleview-selector-matched > .ruleview-selector-pseudo-class-lock { + font-weight: bold; + color: var(--theme-highlight-orange); +} + .ruleview-selectorhighlighter { background: url("chrome://browser/skin/devtools/vview-open-inspector.png") no-repeat 0 0; padding-left: 16px; diff --git a/arc-firefox-theme/chrome/browser/devtools/scratchpad.css b/arc-firefox-theme/chrome/browser/devtools/scratchpad.css index 96d6f70..4c8a5d1 100644 --- a/arc-firefox-theme/chrome/browser/devtools/scratchpad.css +++ b/arc-firefox-theme/chrome/browser/devtools/scratchpad.css @@ -1,7 +1,3 @@ -/* 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/. */ - #scratchpad-sidebar > tabs { height: 0; diff --git a/arc-firefox-theme/chrome/browser/devtools/shadereditor.css b/arc-firefox-theme/chrome/browser/devtools/shadereditor.css index c63a4c6..9ba9ff8 100644 --- a/arc-firefox-theme/chrome/browser/devtools/shadereditor.css +++ b/arc-firefox-theme/chrome/browser/devtools/shadereditor.css @@ -1,7 +1,3 @@ -/* 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/. */ - /* 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/. */ diff --git a/arc-firefox-theme/chrome/browser/devtools/splitview.css b/arc-firefox-theme/chrome/browser/devtools/splitview.css index 9710c38..902fedb 100644 --- a/arc-firefox-theme/chrome/browser/devtools/splitview.css +++ b/arc-firefox-theme/chrome/browser/devtools/splitview.css @@ -133,20 +133,3 @@ min-width: 48px; min-height: 0; } - - -/* Resizers */ - -.splitview-portrait-resizer { - -moz-appearance: none; - background: linear-gradient(black 1px, rgba(255,255,255,0.2) 1px), - linear-gradient(hsl(210,11%,36%), hsl(210,11%,18%)); - height: 12px; - background-size: 10px 2px, 100% 12px; - background-clip: content-box, border-box; - background-repeat: repeat-y, no-repeat; - background-position: center center; - padding: 2px 0; - border-top: 1px solid hsla(210,8%,5%,.5); - border-bottom: 1px solid hsla(210,8%,5%,.5); -} diff --git a/arc-firefox-theme/chrome/browser/devtools/storage.css b/arc-firefox-theme/chrome/browser/devtools/storage.css index 5f6d78e..a5a897e 100644 --- a/arc-firefox-theme/chrome/browser/devtools/storage.css +++ b/arc-firefox-theme/chrome/browser/devtools/storage.css @@ -10,8 +10,8 @@ overflow: auto; } -.theme-dark #storage-tree { - background: #343c45; /* Toolbars */ +#storage-tree { + background: var(--theme-sidebar-background); } #storage-tree .tree-widget-item[type="store"]:after { diff --git a/arc-firefox-theme/chrome/browser/devtools/webaudioeditor.css b/arc-firefox-theme/chrome/browser/devtools/webaudioeditor.css index 11439a6..0d66638 100644 --- a/arc-firefox-theme/chrome/browser/devtools/webaudioeditor.css +++ b/arc-firefox-theme/chrome/browser/devtools/webaudioeditor.css @@ -1,7 +1,3 @@ -/* 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/. */ - /* 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/. */ diff --git a/arc-firefox-theme/chrome/browser/devtools/widgets.css b/arc-firefox-theme/chrome/browser/devtools/widgets.css index 17a96ad..18a6757 100644 --- a/arc-firefox-theme/chrome/browser/devtools/widgets.css +++ b/arc-firefox-theme/chrome/browser/devtools/widgets.css @@ -7,6 +7,14 @@ * 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/. */ +.theme-dark { + --table-splitter-color: rgba(255,255,255,0.15); + --table-zebra-background: rgba(255,255,255,0.05); +} +.theme-light { + --table-splitter-color: rgba(0,0,0,0.15); + --table-zebra-background: rgba(0,0,0,0.05); +} /* Generic pane helpers */ @@ -1199,43 +1207,16 @@ overflow: auto; } -.theme-light .table-widget-body { - background: var(--theme-sidebar-background); -} - -.theme-dark .table-widget-body, -.theme-dark .table-widget-empty-text { - background-color: var(--theme-toolbar-background); -} - -.theme-dark .table-widget-body:-moz-locale-dir(ltr) { - box-shadow: inset -1px 0 0 #000; -} - -.theme-dark .table-widget-body:-moz-locale-dir(rtl) { - box-shadow: inset 1px 0 0 #000; -} - -.table-widget-body:-moz-locale-dir(ltr) { - box-shadow: inset -1px 0 0 #aaa; -} - -.table-widget-body:-moz-locale-dir(rtl) { - box-shadow: inset 1px 0 0 #aaa; +.table-widget-body, +.table-widget-empty-text { + background-color: var(--theme-body-background); } /* Column Headers */ -.theme-dark .table-widget-column-header, -.theme-dark .table-widget-cell { - -moz-border-end: 1px solid rgba(0,0,0,0.2); - box-shadow: inset 1px 0 0 rgba(128,128,128,0.15); -} - -.theme-light .table-widget-column-header, -.theme-light .table-widget-cell { - -moz-border-end: 1px solid rgba(128,128,128,0.25); - box-shadow: inset 1px 0 0 transparent; +.table-widget-column-header, +.table-widget-cell { + -moz-border-end: 1px solid var(--table-splitter-color) !important; } /* Table widget column header colors are taken from netmonitor.inc.css to match @@ -1246,10 +1227,8 @@ background: rgba(0,0,0,0); position: sticky; top: 0; - min-height: 32px; width: 100%; - border: none; - padding: 8px 0 0 !important; + padding: 5px 0 0 !important; color: inherit; text-align: center; font-weight: inherit !important; @@ -1257,27 +1236,29 @@ } .table-widget-column-header:hover { - background: rgba(0,0,0,0.10); + background-image: linear-gradient(rgba(0,0,0,0.10), rgba(0,0,0,0.10)); } .table-widget-column-header:hover:active { - background: rgba(0,0,0,0.25); + background-image: linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)); } .table-widget-column-header:not(:active)[sorted] { - background: rgba(0,0,0,0.15); + background-image: linear-gradient(rgba(0,0,0,0.15), rgba(0,0,0,0.15)); } .table-widget-column-header:not(:active)[sorted=ascending] { - background-image: radial-gradient(farthest-side at center top, hsla(200,100%,70%,.7), hsla(200,100%,70%,0.3)); - background-size: 100% 1px; - background-repeat: no-repeat; + background-image: radial-gradient(farthest-side at center top, hsla(200,100%,70%,.7), hsla(200,100%,70%,0.3)), + linear-gradient(rgba(0,0,0,0.15), rgba(0,0,0,0.15)); + background-size: 100% 1px, auto; + background-repeat: no-repeat, repeat; } .table-widget-column-header:not(:active)[sorted=descending] { - background-image: radial-gradient(farthest-side at center bottom, hsla(200,100%,70%,.7), hsla(200,100%,70%,0.3)); - background-size: 100% 1px; - background-repeat: no-repeat; + background-image: radial-gradient(farthest-side at center bottom, hsla(200,100%,70%,.7), hsla(200,100%,70%,0.3)), + linear-gradient(rgba(0,0,0,0.15), rgba(0,0,0,0.15)); + background-size: 100% 1px, auto; + background-repeat: no-repeat, repeat; background-position: bottom; } @@ -1285,44 +1266,22 @@ .table-widget-cell { width: 100%; - margin: -1px 0 !important; padding: 3px 4px; background-clip: padding-box; min-width: 100px; -moz-user-focus: normal; -} - -.theme-dark .table-widget-cell { - border-top: 1px solid rgba(0,0,0,0.2); - border-bottom: 1px solid rgba(128,128,128,0.15); - color: var(--theme-selection-color); -} - -.theme-dark:not(.filtering) .table-widget-cell:nth-child(odd):not(.theme-selected), -.theme-dark .table-widget-cell:not(.theme-selected)[odd] { - background: rgba(255,255,255,0.05); -} - -.theme-dark .table-widget-cell:last-of-type { - box-shadow: inset 0 -1px 0 rgba(0,0,0,0.2); -} - -.theme-light .table-widget-cell { - border-top: 1px solid rgba(128,128,128,0.15); + margin-bottom: -1px !important; border-bottom: 1px solid transparent; -} - -.theme-light .table-widget-cell:not(.theme-selected) { color: var(--theme-body-color); } -.theme-light:not(.filtering) .table-widget-cell:nth-child(odd):not(.theme-selected), -.theme-light .table-widget-cell:not(.theme-selected)[odd] { - background: rgba(128,128,128,0.05); +.table-widget-cell:last-child { + border-bottom: 1px solid var(--table-splitter-color); } -.theme-light .table-widget-cell:last-of-type { - box-shadow: inset 0 -1px 0 rgba(128,128,128,0.15); +:root:not(.filtering) .table-widget-cell:nth-child(odd):not(.theme-selected), +.table-widget-cell:not(.theme-selected)[odd] { + background: var(--table-zebra-background); } .table-widget-cell.flash-out { @@ -1344,10 +1303,6 @@ margin-top: -20px !important; } -.theme-light .table-widget-empty-text { - background: #F7F7F7; /* Background-Sidebar */ -} - .table-widget-body:empty + .table-widget-empty-text:not([value=""]), .table-widget-body[empty] + .table-widget-empty-text:not([value=""]) { display: block; @@ -1399,11 +1354,11 @@ } .tree-widget-item[level="1"] { - font-weight: 800; + font-weight: 700; } /* Twisties */ -.tree-widget-item:before { +.tree-widget-item::before { content: ""; width: 14px; height: 14px; @@ -1416,24 +1371,24 @@ background-position: -28px -14px; } -.tree-widget-item:-moz-locale-dir(rtl):before { +.tree-widget-item:-moz-locale-dir(rtl)::before { float: right; transform: scaleX(-1); } -.theme-light .tree-widget-item:before { +.theme-light .tree-widget-item:not(.theme-selected)::before { background-position: 0 -14px; } -.tree-widget-item[empty]:before { +.tree-widget-item[empty]::before { background: transparent; } -.tree-widget-item[expanded]:before { +.tree-widget-item[expanded]::before { background-position: -42px -14px; } -.theme-light .tree-widget-item[expanded]:before { +.theme-light .tree-widget-item:not(.theme-selected)[expanded]:before { background-position: -14px -14px; } @@ -1511,7 +1466,7 @@ /* Custom icons for certain tree items indicating the type of the item */ -.tree-widget-item[type]:after { +.tree-widget-item[type]::after { content: ""; float: left; width: 16px; @@ -1519,31 +1474,36 @@ -moz-margin-end: 4px; background-repeat: no-repeat; background-size: 20px auto; - filter: url('filters.svg#invert'); background-position: 0 0; background-size: auto 20px; + opacity: 0.75; +} + +.tree-widget-item.theme-selected[type]::after { + opacity: 1; } -.tree-widget-item:-moz-locale-dir(rtl):after { +.tree-widget-item:-moz-locale-dir(rtl)::after { float: right; } -.theme-dark .tree-widget-item[type]:after { - filter: url('filters.svg#invert-white'); +.theme-light .tree-widget-item.theme-selected[type]::after, +.theme-dark .tree-widget-item[type]::after { + filter: invert(1); } -.tree-widget-item[type="dir"]:after { +.tree-widget-item[type="dir"]::after { background-image: url(chrome://browser/skin/devtools/filetype-dir-close.svg); background-position: 2px 0; background-size: auto 16px; width: 20px; } -.tree-widget-item[type="dir"][expanded]:not([empty]):after { +.tree-widget-item[type="dir"][expanded]:not([empty])::after { background-image: url(chrome://browser/skin/devtools/filetype-dir-open.svg); } -.tree-widget-item[type="url"]:after { +.tree-widget-item[type="url"]::after { background-image: url(chrome://browser/skin/devtools/filetype-globe.svg); background-size: auto 18px; width: 18px; -- cgit v1.2.3