LCARStrek/browser/devtools/inspector.css

   1 window {
   2   padding: 0;
   3 }
   4
   5 #inspector-toolbar {
   6   border-top: none;
   7 }
   8
   9 #inspector-inspect-toolbutton {
  10   list-style-image: url("chrome://browser/skin/devtools/inspect-button.png");
  11   -moz-image-region: rect(0 16px 16px 0);
  12 }
  13
  14 #inspector-inspect-toolbutton[checked=true],
  15 #inspector-inspect-toolbutton:hover {
  16   -moz-image-region: rect(0 32px 16px 16px);
  17 }
  18
  19 /* Highlighter toolbar - breadcrumbs */
  20
  21 #inspector-breadcrumbs {
  22   -moz-margin-end: 3px;
  23   /* A fake 1px-shadow is included in the border-images of the
  24      inspector-breadcrumbs-buttons, to match toolbar-buttons style.
  25      This negative margin compensate the extra row of pixels created
  26      by the shadow.*/
  27   /*margin: -1px 0;*/
  28 }
  29
  30 #inspector-breadcrumbs > .scrollbutton-up,
  31 #inspector-breadcrumbs > .scrollbutton-down {
  32   min-height: 25px;
  33   margin-top: 0;
  34   margin-bottom: 0;
  35 }
  36
  37 #inspector-breadcrumbs > .scrollbutton-up {
  38   -moz-margin-end: 1px;
  39 }
  40
  41 #inspector-breadcrumbs > .scrollbutton-down {
  42   -moz-margin-end: 0;
  43 }
  44
  45 #inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover,
  46 #inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover {
  47 }
  48
  49 #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon,
  50 #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon {
  51   /* margin: 0 5px; */
  52 }
  53
  54 #inspector-breadcrumbs > .scrollbutton-up[disabled] > .toolbarbutton-icon,
  55 #inspector-breadcrumbs > .scrollbutton-down[disabled] > .toolbarbutton-icon {
  56 }
  57
  58 #inspector-breadcrumbs > .scrollbutton-up:not([disabled]):active:hover > .toolbarbutton-icon,
  59 #inspector-breadcrumbs > .scrollbutton-down:not([disabled]):active:hover > .toolbarbutton-icon {
  60 }
  61
  62 #inspector-breadcrumbs > .scrollbutton-up:-moz-locale-dir(ltr) {
  63   border-top-right-radius: 0;
  64   border-bottom-right-radius: 0;
  65 }
  66
  67 #inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(ltr) {
  68   border-top-left-radius: 0;
  69   border-bottom-left-radius: 0;
  70 }
  71
  72 #inspector-breadcrumbs > .scrollbutton-up:-moz-locale-dir(rtl) {
  73   border-top-left-radius: 0;
  74   border-bottom-left-radius: 0;
  75 }
  76
  77 #inspector-breadcrumbs > .scrollbutton-down:-moz-locale-dir(rtl) {
  78   border-top-right-radius: 0;
  79   border-bottom-right-radius: 0;
  80 }
  81
  82 #inspector-breadcrumbs > .scrollbutton-up > .toolbarbutton-icon:-moz-locale-dir(rtl),
  83 #inspector-breadcrumbs > .scrollbutton-down > .toolbarbutton-icon:-moz-locale-dir(ltr) {
  84 /*  transform: scaleX(-1); */
  85 }
  86
  87 .inspector-breadcrumbs-button {
  88   background-color: #000000;
  89   border-radius: 0;
  90   border-style: solid;
  91   border-width: 2px 13px;
  92   outline: none;
  93   color: #FF9F00;
  94   width: 85px; /* Can't use max-width. See bug 723132 */
  95   /* The content of the button can be larger than the button */
  96   overflow: hidden;
  97   min-height: 25px;
  98   margin: 0 -11px 0 0;
  99   padding: 0 9px;
 100 }
 101
 102 .inspector-breadcrumbs-button:hover {
 103   background-color: #FFCF00;
 104   color: #000000;
 105 }
 106
 107 .inspector-breadcrumbs-button[checked]:not(:hover) {
 108   background-color: #008484;
 109   color: #000000;
 110 }
 111
 112 .inspector-breadcrumbs-button[siblings-menu-open],
 113 .inspector-breadcrumbs-button:active {
 114   background-color: #FF9F00;
 115   color: #000000;
 116 }
 117
 118 .inspector-breadcrumbs-button:-moz-focusring > .button-box {
 119   border-width: 0;
 120 }
 121
 122 .inspector-breadcrumbs-button:-moz-focusring > label {
 123   border-bottom: 1px dotted #008484;
 124 }
 125
 126 .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-tag {
 127   /*color: hsl(208,100%,60%); */
 128 }
 129
 130 .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-id {
 131   /*color: hsl(205,100%,70%); */
 132 }
 133
 134 .inspector-breadcrumbs-button[checked] > .inspector-breadcrumbs-pseudo-classes {
 135   color: #FF9F00;
 136 }
 137
 138 .inspector-breadcrumbs-id,
 139 .inspector-breadcrumbs-classes {
 140   /*color: #8d99a6; */
 141 }
 142
 143 .inspector-breadcrumbs-pseudo-classes {
 144   color: #FFCF00;
 145 }
 146
 147 /* fit height of other buttons to breadcrumbs */
 148 #inspector-toolbar .devtools-toolbarbutton,
 149 #highlighter-closebutton,
 150 #inspector-option-toolbarbutton {
 151   min-height: 25px;
 152 }
 153
 154 /* Highlighter toolbar - breadcrumbs - LTR */
 155
 156 .inspector-breadcrumbs-button:-moz-locale-dir(ltr):first-of-type {
 157 }
 158
 159 .inspector-breadcrumbs-button {
 160   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle.png") 2 13 2 13 fill stretch;
 161 }
 162
 163 .inspector-breadcrumbs-button[siblings-menu-open]:not([checked]),
 164 .inspector-breadcrumbs-button:not([checked]):hover:active {
 165   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-pressed.png") 2 13 2 13 fill stretch;
 166 }
 167
 168 .inspector-breadcrumbs-button[checked] {
 169   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected.png") 2 13 2 13 fill stretch;
 170 }
 171
 172 .inspector-breadcrumbs-button[checked][siblings-menu-open],
 173 .inspector-breadcrumbs-button[checked]:hover:active {
 174   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-middle-selected-pressed.png") 2 13 2 13 fill stretch;
 175 }
 176
 177 .inspector-breadcrumbs-button:first-of-type {
 178   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start.png") 2 13 2 13 fill stretch;
 179 }
 180
 181 .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type:not([checked]),
 182 .inspector-breadcrumbs-button:first-of-type:not([checked]):hover:active {
 183   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-pressed.png") 2 13 2 13 fill stretch;
 184 }
 185
 186 .inspector-breadcrumbs-button:first-of-type[checked] {
 187   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected.png") 2 13 2 13 fill stretch;
 188 }
 189
 190 .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type[checked],
 191 .inspector-breadcrumbs-button:first-of-type[checked]:hover:active {
 192   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-start-selected-pressed.png") 2 13 2 13 fill stretch;
 193 }
 194
 195 .inspector-breadcrumbs-button:last-of-type {
 196   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end.png") 2 13 2 13 fill stretch;
 197 }
 198
 199 .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]),
 200 .inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active {
 201   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-pressed.png") 2 13 2 13 fill stretch;
 202 }
 203
 204 .inspector-breadcrumbs-button:last-of-type[checked] {
 205   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected.png") 2 13 2 13 fill stretch;
 206 }
 207
 208 .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type[checked],
 209 .inspector-breadcrumbs-button:last-of-type[checked]:hover:active {
 210   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/ltr-end-selected-pressed.png") 2 13 2 13 fill stretch;
 211 }
 212
 213 /* Highlighter toolbar - breadcrumbs - RTL */
 214
 215 .inspector-breadcrumbs-button:-moz-locale-dir(rtl):first-of-type {
 216 }
 217
 218 .inspector-breadcrumbs-button:-moz-locale-dir(rtl) {
 219   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle.png") 2 13 2 13 fill stretch;
 220 }
 221
 222 .inspector-breadcrumbs-button[siblings-menu-open]:not([checked]):-moz-locale-dir(rtl),
 223 .inspector-breadcrumbs-button:not([checked]):hover:active:-moz-locale-dir(rtl) {
 224   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-pressed.png") 2 13 2 13 fill stretch;
 225 }
 226
 227 .inspector-breadcrumbs-button[checked]:-moz-locale-dir(rtl) {
 228   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected.png") 2 13 2 13 fill stretch;
 229 }
 230
 231 .inspector-breadcrumbs-button[checked][siblings-menu-open]:-moz-locale-dir(rtl),
 232 .inspector-breadcrumbs-button[checked]:hover:active:-moz-locale-dir(rtl) {
 233   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-middle-selected-pressed.png") 2 13 2 13 fill stretch;
 234 }
 235
 236 .inspector-breadcrumbs-button:first-of-type:-moz-locale-dir(rtl) {
 237   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start.png") 2 13 2 13 fill stretch;
 238 }
 239
 240 .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type:not([checked]):-moz-locale-dir(rtl),
 241 .inspector-breadcrumbs-button:first-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) {
 242   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-pressed.png") 2 13 2 13 fill stretch;
 243 }
 244
 245 .inspector-breadcrumbs-button:first-of-type[checked]:-moz-locale-dir(rtl) {
 246   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected.png") 2 13 2 13 fill stretch;
 247 }
 248
 249 .inspector-breadcrumbs-button[siblings-menu-open]:first-of-type[checked]:-moz-locale-dir(rtl),
 250 .inspector-breadcrumbs-button:first-of-type[checked]:hover:active:-moz-locale-dir(rtl) {
 251   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-start-selected-pressed.png") 2 13 2 13 fill stretch;
 252 }
 253
 254 .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) {
 255   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end.png") 2 13 2 13 fill stretch;
 256 }
 257
 258 #inspector-breadcrumbs[overflows] > .inspector-breadcrumbs-button:last-of-type:-moz-locale-dir(rtl) {
 259 }
 260
 261 .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type:not([checked]):-moz-locale-dir(rtl),
 262 .inspector-breadcrumbs-button:last-of-type:not([checked]):hover:active:-moz-locale-dir(rtl) {
 263   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-pressed.png") 2 13 2 13 fill stretch;
 264 }
 265
 266 .inspector-breadcrumbs-button:last-of-type[checked]:-moz-locale-dir(rtl) {
 267   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected.png") 2 13 2 13 fill stretch;
 268 }
 269
 270 .inspector-breadcrumbs-button[siblings-menu-open]:last-of-type[checked]:-moz-locale-dir(rtl),
 271 .inspector-breadcrumbs-button:last-of-type[checked]:hover:active:-moz-locale-dir(rtl) {
 272   -moz-border-image: url("chrome://browser/skin/devtools/breadcrumbs/rtl-end-selected-pressed.png") 2 13 2 13 fill stretch;
 273 }
 274
 275 #inspector-searchbox {
 276   transition-property: max-width, -moz-padding-end, -moz-padding-start;
 277   transition-duration: 250ms;
 278   transition-timing-function: ease;
 279 }
 280
 281 #inspector-searchbox:not([focused]):not([filled]) > .textbox-input-box {
 282   overflow: hidden;
 283 }
 284
 285 #inspector-searchbox:not([focused]):not([filled]) {
 286   max-width: 20px !important;
 287   -moz-padding-end: 6px;
 288   -moz-padding-start: 22px;
 289   background-position: 8px center, top left, top left;
 290 }
 291
 292 #inspector-searchbox[focused],
 293 #inspector-searchbox[filled] {
 294   max-width: 200px !important;
 295 }