X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Finspector.css;h=cb1b54093b1da2769673c309b6f516912c608ce7;hp=f05bf34d612b8b5eddcb5717981c25e860b2dbb9;hb=1988bb88c279ec0deae5bbf72308e7b356416ae5;hpb=445863a284a9920d9f9633ca01b87ca65609a94c diff --git a/LCARStrek/browser/devtools/inspector.css b/LCARStrek/browser/devtools/inspector.css index f05bf34d..cb1b5409 100644 --- a/LCARStrek/browser/devtools/inspector.css +++ b/LCARStrek/browser/devtools/inspector.css @@ -1,3 +1,7 @@ +/* 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/. */ + window { padding: 0; } @@ -6,227 +10,365 @@ window { border-top: none; } -.devtools-side-splitter { - border: none; -} - -/* -#inspector-inspect-toolbutton { - list-style-image: url("chrome://browser/skin/devtools/inspect-button.png"); - -moz-image-region: rect(0px 16px 16px 0px); -} - -#inspector-inspect-toolbutton[checked=true] { - -moz-image-region: rect(0px 32px 16px 16px); -} - -/* Highlighter toolbar - breadcrumbs * +/* Highlighter toolbar - breadcrumbs */ #inspector-breadcrumbs { -moz-margin-end: 3px; /* A fake 1px-shadow is included in the border-images of the inspector-breadcrumbs-buttons, to match toolbar-buttons style. This negative margin compensate the extra row of pixels created - by the shadow.* - margin: -1px 0; + by the shadow.*/ + /*margin: -1px 0;*/ } #inspector-breadcrumbs > .scrollbutton-up, #inspector-breadcrumbs > .scrollbutton-down { - -moz-appearance: none; - border: 1px solid hsla(210,8%,5%,.45); - background: -moz-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); - margin: 1px 0 1px; + min-height: 25px; + margin-top: 0; + margin-bottom: 0; +} + +#inspector-breadcrumbs > .scrollbutton-up { + -moz-margin-end: 1px; +} + +#inspector-breadcrumbs > .scrollbutton-down { + -moz-margin-end: 0; } #inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover, #inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover { - border-color: hsla(210,8%,5%,.6); - background: -moz-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); } #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon, #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon { - -moz-appearance: none; - list-style-image: url("chrome://browser/skin/devtools/breadcrumbs-scrollbutton.png"); - -moz-image-region: rect(0px 7px 16px 0px); - margin: 0 5px; + /* margin: 0 5px; */ } #inspector-breadcrumbs > .scrollbutton-up[disabled] > .toolbarbutton-icon, #inspector-breadcrumbs > .scrollbutton-down[disabled] > .toolbarbutton-icon { - opacity: 0.5; } #inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover > .toolbarbutton-icon, #inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover > .toolbarbutton-icon { - -moz-image-region: rect(0px 14px 16px 7px); +} + +#inspector-breadcrumbs > .scrollbutton-up:-moz-locale-dir(ltr) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(ltr) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +#inspector-breadcrumbs > .scrollbutton-up:-moz-locale-dir(rtl) { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +#inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(rtl) { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl), #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) { - transform: scaleX(-1); +/* transform: scaleX(-1); */ } .inspector-breadcrumbs-button { - -moz-appearance: none; - background-color: transparent; + background-color: #000000; + border-radius: 0; border-style: solid; border-width: 2px 13px; outline: none; - color: hsl(210,30%,85%); - width: 85px; /* Can't use max-width. See bug 723132 * - /* The content of the button can be larger than the button * + color: #FF9F00; + width: 85px; /* Can't use max-width. See bug 723132 */ + /* The content of the button can be larger than the button */ overflow: hidden; min-height: 25px; margin: 0 -11px 0 0; padding: 0 9px; } +.inspector-breadcrumbs-button:hover { + background-color: #FFCF00; + color: #000000; +} + +.inspector-breadcrumbs-button[checked]:not(:hover) { + background-color: #008484; + color: #000000; +} + +.inspector-breadcrumbs-button[siblings-menu-open], +.inspector-breadcrumbs-button:active { + background-color: #FF9F00; + color: #000000; +} + .inspector-breadcrumbs-button:-moz-focusring > .button-box { border-width: 0; } .inspector-breadcrumbs-button:-moz-focusring > label { - border-bottom: 1px dotted hsla(210,30%,85%,0.4); + border-bottom: 1px dotted #008484; } .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-tag { - color: hsl(200,100%,60%); + /*color: hsl(208,100%,60%); */ } .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-id { - color: hsl(200,100%,70%); + /*color: hsl(205,100%,70%); */ } .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-pseudo-classes { - color: hsl(20, 100%, 70%); + color: #FF9F00; } .inspector-breadcrumbs-id, .inspector-breadcrumbs-classes { - color: #8d99a6; + /*color: #8d99a6; */ } .inspector-breadcrumbs-pseudo-classes { - color: hsl(20, 100%, 85%); + color: #FFCF00; +} + +/* fit height of other buttons to breadcrumbs */ +#inspector-toolbar .devtools-toolbarbutton, +#highlighter-closebutton, +#inspector-option-toolbarbutton { + min-height: 25px; } -/* Highlighter toolbar - breadcrumbs - LTR * +/* Highlighter toolbar - breadcrumbs - LTR */ + +.inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type { +} .inspector-breadcrumbs-button { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:not([checked]), .inspector-breadcrumbs-button:not([checked]):hover:active { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button[checked] { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[checked][siblings-menu-open], .inspector-breadcrumbs-button[checked]:hover:active { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:first-of-type { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:first-of-type:not([checked]), .inspector-breadcrumbs-button:first-of-type:not([checked]):hover:active { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:first-of-type[checked] { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:first-of-type[checked], .inspector-breadcrumbs-button:first-of-type[checked]:hover:active { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:last-of-type { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 2 13 2 13 fill stretch; -} - -#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type { - border-left-width: 0; -} - -#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:-moz-locale-dir(ltr):last-of-type { - border-right-width: 0; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]), .inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:last-of-type[checked] { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type[checked], .inspector-breadcrumbs-button:last-of-type[checked]:hover:active { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected-pressed.png") 2 13 2 13 fill stretch; } -/* Highlighter toolbar - breadcrumbs - RTL * +/* Highlighter toolbar - breadcrumbs - RTL */ + +.inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type { +} .inspector-breadcrumbs-button:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:not([checked]):-moz-locale-dir(rtl), .inspector-breadcrumbs-button:not([checked]):hover:active:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button[checked]:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[checked][siblings-menu-open]:-moz-locale-dir(rtl), .inspector-breadcrumbs-button[checked]:hover:active:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:first-of-type:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:first-of-type:not([checked]):-moz-locale-dir(rtl), .inspector-breadcrumbs-button:first-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:first-of-type[checked]:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:first-of-type[checked]:-moz-locale-dir(rtl), .inspector-breadcrumbs-button:first-of-type[checked]:hover:active:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 2 13 2 13 fill stretch; -} - -#inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type { - border-right-width: 0; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 2 13 2 13 fill stretch; } #inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) { - border-left-width: 0; } +.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]):-moz-locale-dir(rtl), .inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 2 13 2 13 fill stretch; } .inspector-breadcrumbs-button:last-of-type[checked]:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected.png") 2 13 2 13 fill stretch; } +.inspector-breadcrumbs-button[siblings-menu-open]:last-of-type[checked]:-moz-locale-dir(rtl), .inspector-breadcrumbs-button:last-of-type[checked]:hover:active:-moz-locale-dir(rtl) { - -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected-pressed.png") 2 13 2 13 fill stretch; + border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected-pressed.png") 2 13 2 13 fill stretch; +} + +#inspector-searchbox { + transition-property: max-width, -moz-padding-end, -moz-padding-start; + transition-duration: 250ms; + transition-timing-function: ease; +} + +#inspector-searchbox:not([focused]):not([filled]) > .textbox-input-box { + overflow: hidden; +} + +#inspector-searchbox:not([focused]):not([filled]) { + max-width: 20px !important; + -moz-padding-end: 6px; + -moz-padding-start: 22px; + background-position: 8px center, top left, top left; +} + +#inspector-searchbox[focused], +#inspector-searchbox[filled] { + max-width: 200px !important; +} + +/* Tooltip: Events */ + +#devtools-tooltip-events-container { + margin: -4px; /* Compensate for the .panel-arrowcontent padding. */ + max-width: 390px; +} + +.event-header { + display: flex; + align-items: center; + cursor: pointer; +} + +.event-tooltip-event-type, +.event-tooltip-filename, +.event-tooltip-attributes { + -moz-margin-start: 0; + flex-shrink: 0; + cursor: pointer; +} + +.event-tooltip-event-type { + font-weight: bold; + font-size: 13px; +} + +.event-tooltip-filename { + -moz-margin-end: 0; + font-size: 100%; + flex-shrink: 1; +} + +.event-tooltip-debugger-icon { + width: 16px; + height: 16px; + -moz-margin-end: 4px; + opacity: 0.6; + flex-shrink: 0; +} + +.event-tooltip-debugger-icon:hover { + opacity: 1; +} + +.event-tooltip-content-box { + display: none; + overflow: auto; + -moz-margin-end: 0; +} + +.event-tooltip-content-box[open] { + display: block; +} + +.event-tooltip-source-container { + margin-top: 5px; + margin-bottom: 10px; + -moz-margin-start: 5px; + -moz-margin-end: 0; +} + +.event-tooltip-source { + margin-bottom: 0; +} + +.event-tooltip-attributes-container { + background-color: #000000; + color: #9C9CFF; +} + +.event-tooltip-attributes-container { + display: flex; + flex-shrink: 0; + align-items: center; + border-radius: 3px; + padding: 2px; + -moz-margin-start: 5px; +} + +.event-tooltip-attributes { + margin: 0; + font-size: 9px; + padding-top: 2px; } -*/ \ No newline at end of file