diff options
Diffstat (limited to 'arc-firefox-theme/chrome/browser/devtools/netmonitor.css')
| -rw-r--r-- | arc-firefox-theme/chrome/browser/devtools/netmonitor.css | 210 |
1 files changed, 117 insertions, 93 deletions
diff --git a/arc-firefox-theme/chrome/browser/devtools/netmonitor.css b/arc-firefox-theme/chrome/browser/devtools/netmonitor.css index 9448a39..1724759 100644 --- a/arc-firefox-theme/chrome/browser/devtools/netmonitor.css +++ b/arc-firefox-theme/chrome/browser/devtools/netmonitor.css @@ -7,15 +7,6 @@ * 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-dark { - --table-splitter-color: rgba(255,255,255,0.15); - --table-zebra-background: rgba(255,255,255,0.05); -} -:root.theme-light { - --table-splitter-color: rgba(0,0,0,0.15); - --table-zebra-background: rgba(0,0,0,0.05); -} - #requests-menu-empty-notice { margin: 0; padding: 12px; @@ -42,6 +33,7 @@ margin: 0; } + /* Network requests table */ #requests-menu-toolbar { @@ -57,9 +49,26 @@ padding: 3px; } -.requests-menu-header:not(:last-child), -.requests-menu-subitem:not(:last-child) { - -moz-border-end: 1px solid var(--table-splitter-color); +.theme-dark .requests-menu-header:not(:last-child), +.theme-dark .requests-menu-subitem:not(:last-child) { + -moz-border-end: 1px solid rgba(0,0,0,0.2); + box-shadow: 1px 0 0 rgba(128,128,128,0.15); +} + +.theme-dark .requests-menu-header:not(:last-child):-moz-locale-dir(rtl), +.theme-dark .requests-menu-subitem:not(:last-child):-moz-locale-dir(rtl) { + box-shadow: -1px 0 0 rgba(128,128,128,0.15); +} + +.theme-light .requests-menu-header:not(:last-child), +.theme-light .requests-menu-subitem:not(:last-child) { + -moz-border-end: 1px solid rgba(128,128,128,0.25); + box-shadow: 1px 0 0 transparent; +} + +.theme-light .requests-menu-header:not(:last-child):-moz-locale-dir(rtl), +.theme-light .requests-menu-subitem:not(:last-child):-moz-locale-dir(rtl) { + box-shadow: -1px 0 0 transparent; } .requests-menu-header-button { @@ -129,8 +138,12 @@ -moz-margin-end: 4px; } -.requests-menu-icon { - outline: 1px solid var(--table-splitter-color); +.theme-dark .requests-menu-icon { + outline: 1px solid rgba(0,0,0,0.2); +} + +.theme-light .requests-menu-icon { + outline: 1px solid rgba(128,128,128,0.25); } .requests-menu-file { @@ -143,28 +156,35 @@ } .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); +} + +.requests-security-state-icon:active { + -moz-image-region: rect(0px, 48px, 16px, 32px); } .security-state-insecure { - list-style-image: url(chrome://browser/skin/identity-not-secure.svg); + list-style-image: url(chrome://browser/skin/identity-icons-generic.png); } .security-state-secure { cursor: pointer; - list-style-image: url(chrome://browser/skin/identity-secure.svg); + list-style-image: url(chrome://browser/skin/identity-icons-https.png); } .security-state-weak { cursor: pointer; - list-style-image: url(chrome://browser/skin/identity-mixed-passive-loaded.svg); + list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-display.png); } .security-state-broken { cursor: pointer; - list-style-image: url(chrome://browser/skin/identity-mixed-active-loaded.svg); + list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-active.png); } .requests-menu-type { @@ -199,42 +219,70 @@ label.requests-menu-status-code { -moz-margin-end: -3em !important; } -box.requests-menu-status:not([code]) { - background-color: var(--theme-content-color2); +.theme-dark box.requests-menu-status:not([code]) { + background-color: rgba(95, 115, 135, 1); /* dark grey */ +} + +.theme-light box.requests-menu-status:not([code]) { + background-color: rgba(143, 161, 178, 1); /* grey */ } -box.requests-menu-status[code="cached"] { - border: 2px solid var(--theme-content-color2); - background-color: transparent; +.theme-dark box.requests-menu-status[code^="1"] { + background-color: rgba(70, 175, 227, 1); /* light blue */ } -box.requests-menu-status[code^="1"] { - background-color: var(---theme-highlight-blue); +.theme-light box.requests-menu-status[code^="1"] { + background-color: rgba(0, 136, 204, 1); /* light blue */ } -box.requests-menu-status[code^="2"] { - background-color: var(--theme-highlight-green); +.theme-dark box.requests-menu-status[code^="2"] { + background-color: rgba(112, 191, 83, 1); /* green */ +} + +.theme-light box.requests-menu-status[code^="2"] { + background-color: rgba(44, 187, 15, 1); /* green */ } /* 3xx are triangles */ -box.requests-menu-status[code^="3"] { +.theme-dark box.requests-menu-status[code^="3"] { + background-color: transparent; + width: 0; + height: 0; + border-left: 5px solid transparent; + border-right: 5px solid transparent; + border-bottom: 10px solid rgba(217, 155, 40, 1); /* light orange */ + border-radius: 0; +} + +.theme-light box.requests-menu-status[code^="3"] { background-color: transparent; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; - border-bottom: 10px solid var(--theme-highlight-lightorange); + border-bottom: 10px solid rgba(217, 126, 0, 1); /* light orange */ border-radius: 0; } /* 4xx and 5xx are squares - error codes */ -box.requests-menu-status[code^="4"] { - background-color: var(--theme-highlight-red); +.theme-dark box.requests-menu-status[code^="4"] { + background-color: rgba(235, 83, 104, 1); /* red */ + border-radius: 0; /* squares */ +} + +.theme-light box.requests-menu-status[code^="4"] { + background-color: rgba(237, 38, 85, 1); /* red */ border-radius: 0; /* squares */ } -box.requests-menu-status[code^="5"] { - background-color: var(--theme-highlight-pink); +.theme-dark box.requests-menu-status[code^="5"] { + background-color: rgba(223, 128, 255, 1); /* pink? */ + border-radius: 0; + transform: rotate(45deg); +} + +.theme-light box.requests-menu-status[code^="5"] { + background-color: rgba(184, 46, 229, 1); /* pink! */ border-radius: 0; transform: rotate(45deg); } @@ -375,26 +423,17 @@ box.requests-menu-status[code^="5"] { } /* SideMenuWidget */ -#network-table .side-menu-widget-empty-text, -#network-table .side-menu-widget-container { - background-color: var(--theme-body-background); -} - -#network-table .side-menu-widget-item { - border-top-color: transparent; - border-bottom-color: transparent; -} .side-menu-widget-item-contents { padding: 0px; } -.side-menu-widget-item:not(.selected)[odd] { - background-color: var(--table-zebra-background); +.theme-dark .side-menu-widget-item:not(.selected)[odd] { + background: rgba(255,255,255,0.05); } -.side-menu-widget-item:not(.selected):hover { - background-color: var(--theme-selection-background-semitransparent); +.theme-light .side-menu-widget-item:not(.selected)[odd] { + background: rgba(128,128,128,0.05); } /* Network request details */ @@ -420,7 +459,7 @@ box.requests-menu-status[code^="5"] { -moz-image-region: rect(0px,32px,16px,16px); } -@media (min-resolution: 1.25dppx) { +@media (min-resolution: 2dppx) { #details-pane-toggle { list-style-image: url("chrome://browser/skin/devtools/debugger-collapse@2x.png"); -moz-image-region: rect(0px,32px,32px,0px); @@ -437,16 +476,9 @@ box.requests-menu-status[code^="5"] { /* Network request details tabpanels */ -.tabpanel-content { - background-color: var(--theme-sidebar-background); -} - .theme-dark .tabpanel-content { - color: var(--theme-selection-color); -} - -#headers-tabpanel { background-color: var(--theme-toolbar-background); + color: var(--theme-selection-color); } /* Summary tabpanel */ @@ -466,10 +498,6 @@ box.requests-menu-status[code^="5"] { -moz-padding-start: 3px; } -.theme-dark .tabpanel-summary-value { - color: var(--theme-selection-color); -} - /* Headers tabpanel */ #headers-summary-status, @@ -560,7 +588,7 @@ box.requests-menu-status[code^="5"] { height: 12px; } -@media (min-resolution: 1.25dppx) { +@media (min-resolution: 2dppx) { .security-warning-icon { background-image: url(alerticon-warning@2x.png); } @@ -586,9 +614,16 @@ box.requests-menu-status[code^="5"] { /* Footer */ -#requests-menu-footer { +.theme-dark #requests-menu-footer { + border-top: 1px solid rgba(0,0,0,0.2); + box-shadow: 0 1px 0 rgba(128,128,128,0.15) inset; + background-color: var(--theme-toolbar-background); +} + +.theme-light #requests-menu-footer { + border-top: 1px solid rgba(128,128,128,0.25); + box-shadow: 0 1px 0 transparent inset; background-color: var(--theme-toolbar-background); - border-top: 1px solid var(--table-splitter-color); } .requests-menu-footer-button, @@ -615,12 +650,14 @@ box.requests-menu-status[code^="5"] { .theme-dark .requests-menu-footer-spacer:not(:first-child), .theme-dark .requests-menu-footer-button:not(:first-child) { - -moz-border-start: 1px solid var(--table-splitter-color); + -moz-border-start: 1px solid rgba(128,128,128,0.15); + box-shadow: -1px 0 0 rgba(0,0,0,0.2); } .theme-light .requests-menu-footer-spacer:not(:first-child), .theme-light .requests-menu-footer-button:not(:first-child) { - -moz-border-start: 1px solid var(--table-splitter-color); + -moz-border-start: 1px solid transparent; + box-shadow: -1px 0 0 rgba(128,128,128,0.25); } .requests-menu-footer-button { @@ -632,40 +669,27 @@ box.requests-menu-status[code^="5"] { background: rgba(0,0,0,0.10); } -.requests-menu-footer-button:hover:active { - background-color: var(--theme-selection-background-semitransparent); -} - -.requests-menu-footer-button:not(:active)[checked] { - background-color: var(--theme-selection-background); - color: var(--theme-selection-color); -} - -.requests-menu-footer-label { - padding-top: 3px; - font-weight: 600; +.theme-dark .requests-menu-footer-button:hover:active { + background-color: rgba(29,79,115,0.4); /* Select Highlight Blue at 40% opacity */ } -#requests-menu-filter-freetext-text { - transition-property: max-width, -moz-padding-end, -moz-padding-start; - transition-duration: 250ms; - transition-timing-function: ease; +.theme-light .requests-menu-footer-button:hover:active { + background-color: rgba(76,158,217,0.4); /* Select Highlight Blue at 40% opacity */ } -#requests-menu-filter-freetext-text:not([focused]):not([filled]) > .textbox-input-box { - overflow: hidden; +.theme-dark .requests-menu-footer-button:not(:active)[checked] { + background-color: rgba(29,79,115,1); /* Select Highlight Blue */ + color: rgba(245,247,250,1); /* Light foreground text */ } -#requests-menu-filter-freetext-text:not([focused]):not([filled]) { - max-width: 20px !important; - -moz-padding-end: 5px; - -moz-padding-start: 22px; - background-position: 8px center, top left, top left; +.theme-light .requests-menu-footer-button:not(:active)[checked] { + background-color: rgba(76,158,217,1); /* Select Highlight Blue */ + color: rgba(245,247,250,1); /* Light foreground text */ } -#requests-menu-filter-freetext-text[focused], -#requests-menu-filter-freetext-text[filled] { - max-width: 200px !important; +.requests-menu-footer-label { + padding-top: 3px; + font-weight: 600; } /* Performance analysis buttons */ @@ -718,7 +742,7 @@ box.requests-menu-status[code^="5"] { } #network-statistics-charts { - background-color: var(--theme-sidebar-background); + background-color: var(--theme-toolbar-background); } #network-statistics-charts .pie-chart-container { |