LCARStrek/browser/customizableui/panelUIOverlay.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 /* === BEGIN panelUIOverlay.inc.css === */
   6
   7 #PanelUI-popup #PanelUI-contents:empty {
   8   height: 128px;
   9 }
  10
  11 #PanelUI-popup #PanelUI-contents:empty::before {
  12   content: "";
  13   background-image: url("chrome://browser/skin/customizableui/whimsy-bw.png");
  14   display: block;
  15   width: 64px;
  16   height: 64px;
  17   position: absolute;
  18   transition: transform 1s ease-out;
  19   animation: whimsyMoveX 3.05s linear 0s infinite alternate,
  20              whimsyMoveY 3.4s linear 0s infinite alternate;
  21 }
  22
  23 #PanelUI-popup #PanelUI-contents:active:empty::before {
  24   animation: whimsyMoveX 3.05s linear 0s infinite alternate,
  25              whimsyMoveY 3.4s linear 0s infinite alternate,
  26              whimsyRotate 1s linear 0s infinite normal;
  27 }
  28
  29 #PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):empty::before {
  30   animation: whimsyMoveXRTL 3.05s linear 0s infinite alternate,
  31              whimsyMoveY 3.4s linear 0s infinite alternate;
  32 }
  33
  34 #PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):active:empty::before {
  35   animation: whimsyMoveXRTL 3.05s linear 0s infinite alternate,
  36              whimsyMoveY 3.4s linear 0s infinite alternate,
  37              whimsyRotate 1s linear 0s infinite normal;
  38 }
  39
  40 #PanelUI-popup #PanelUI-contents:empty:hover::before {
  41   background-image: url("chrome://browser/skin/customizableui/whimsy.png");
  42 }
  43
  44 @media (min-resolution: 2dppx) {
  45   #PanelUI-popup #PanelUI-contents:empty::before {
  46     background-image: url("chrome://browser/skin/customizableui/whimsy-bw@2x.png");
  47     background-size: 64px 64px;
  48   }
  49   #PanelUI-popup #PanelUI-contents:empty:hover::before {
  50     background-image: url("chrome://browser/skin/customizableui/whimsy@2x.png");
  51   }
  52 }
  53
  54 @keyframes whimsyMoveX {
  55   /* These values are adjusted for the padding on the panel. */
  56   from { margin-left: -9px; } to { margin-left: calc(100% - 55px); }
  57 }
  58
  59 @keyframes whimsyMoveXRTL {
  60   /* These values are adjusted for the padding on the panel. */
  61   from { margin-right: -9px; } to { margin-right: calc(100% - 55px); }
  62 }
  63
  64 @keyframes whimsyMoveY {
  65   /* These values are adjusted for the padding and height of the panel. */
  66   from { margin-top: -.5em; } to { margin-top: calc(64px - .5em); }
  67 }
  68
  69 @keyframes whimsyRotate {
  70   to { transform: perspective(5000px) rotateY(360deg); }
  71 }
  72
  73 #customization-panelHolder {
  74   border-radius: 4px;
  75 }
  76
  77 #PanelUI-button {
  78   -moz-margin-start: 3px;
  79 }
  80
  81 #PanelUI-button:-moz-locale-dir(rtl) {
  82 }
  83
  84 .panel-subviews {
  85   padding: 4px;
  86   background-color: #000000;
  87   -moz-margin-start: 38px;
  88 }
  89
  90 .panel-viewstack[viewtype="main"] > .panel-subviews {
  91   transform: translateX(22.35em);
  92 }
  93
  94 .panel-viewstack[viewtype="main"] > .panel-subviews:-moz-locale-dir(rtl) {
  95   transform: translateX(-22.35em);
  96 }
  97
  98 panelmultiview[nosubviews=true] > .panel-viewcontainer > .panel-viewstack > .panel-subviews {
  99   display: none;
 100 }
 101
 102 .panel-viewstack:not([viewtype="main"]) > .panel-mainview > #PanelUI-mainView {
 103   -moz-box-flex: 1;
 104 }
 105
 106 .panel-subview-body {
 107   overflow-y: auto;
 108   overflow-x: hidden;
 109   -moz-box-flex: 1;
 110 }
 111
 112 #PanelUI-popup .panel-subview-body {
 113   margin: -4px;
 114   padding: 4px 4px;
 115 }
 116
 117 .panel-subview-header,
 118 .subviewbutton.panel-subview-footer {
 119   box-sizing: border-box;
 120 /*  min-height: 41px; */
 121   padding: 3px;
 122 }
 123
 124 .panel-subview-header {
 125   margin: 0 0 4px;
 126   background-color: #A09090;
 127   color: #000000;
 128   border-radius: 4px;
 129 }
 130
 131 .panel-subview-footer {
 132   border-top: 1px solid #A09090;
 133 }
 134
 135 .cui-widget-panelview .panel-subview-header {
 136   display: none;
 137 }
 138
 139 .cui-widget-panelview .subviewbutton.panel-subview-footer {
 140   margin: 4px 0 0;
 141   -moz-box-pack: center;
 142 }
 143
 144 #PanelUI-mainView {
 145   display: flex;
 146   flex-direction: column;
 147   border-radius: 4px;
 148 }
 149
 150 #app-extension-point-end > #PanelUI-menu-button {
 151   padding: 2px 5px;
 152 }
 153 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-text {
 154   display: none;
 155 }
 156 #app-extension-point-end > #PanelUI-menu-button .toolbarbutton-icon {
 157   margin: 0;
 158 }
 159
 160 #PanelUI-popup > arrowscrollbox > autorepeatbutton {
 161   display: none;
 162 }
 163 #PanelUI-popup > arrowscrollbox > scrollbox {
 164   overflow: visible;
 165 }
 166
 167 #PanelUI-popup > .panel-arrowcontainer > .panel-arrowcontent {
 168   overflow: hidden;
 169   padding: 0;
 170 }
 171
 172 #PanelUI-contents {
 173   padding: .5em 0;
 174 }
 175
 176 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
 177 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
 178 /*  line-height: 1.1;*/
 179   max-height: 2.2em;
 180 }
 181
 182 .panelUI-grid .toolbarbutton-1:not([auto-hyphens="off"]) > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
 183 .panelUI-grid .toolbarbutton-1:not([auto-hyphens="off"]) > .toolbarbutton-multiline-text {
 184   -moz-hyphens: auto;
 185 }
 186
 187 .panelUI-grid:not([customize-transitioning]) .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text,
 188 .panelUI-grid:not([customize-transitioning]) .toolbarbutton-1 > .toolbarbutton-multiline-text {
 189   position: absolute;
 190   clip: rect(auto, auto, 2.3em, auto);
 191 }
 192
 193 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-text,
 194 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-multiline-text {
 195   text-align: center;
 196   /* Need to override toolkit theming which sets margin: 0 !important; */
 197   margin: 2px 0 0 !important;
 198 }
 199
 200 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
 201   text-align: center;
 202   margin: -1px 0 0;
 203 }
 204
 205 #wrapper-edit-controls:-moz-any([place="palette"],[place="panel"]) > #edit-controls,
 206 #wrapper-zoom-controls:-moz-any([place="palette"],[place="panel"]) > #zoom-controls {
 207   -moz-margin-start: 0;
 208 }
 209
 210 #PanelUI-contents {
 211   max-width: 22.35em;
 212 }
 213
 214 #BMB_bookmarksPopup,
 215 .panel-mainview:not([panelid="PanelUI-popup"]) {
 216   max-width: 30em;
 217 }
 218
 219 panelview:not([mainview]) .toolbarbutton-text,
 220 .cui-widget-panel toolbarbutton > .toolbarbutton-text {
 221   text-align: start;
 222   display: -moz-box;
 223 }
 224
 225 .cui-widget-panel > .panel-arrowcontainer > .panel-arrowcontent {
 226   padding: 0;
 227 }
 228
 229 .cui-widget-panel.cui-widget-panelWithFooter > .panel-arrowcontainer > .panel-arrowcontent {
 230   padding-bottom: 0;
 231 }
 232
 233 .cui-widget-panel > :-moz-any(menu,menuitem,toolbarbutton):first-child {
 234   border-radius: 4px 4px 0 0;
 235 }
 236
 237 .cui-widget-panel > :-moz-any(menu,menuitem,toolbarbutton):last-child {
 238   border-radius: 0 0 4px 4px;
 239 }
 240
 241 #PanelUI-contents {
 242   display: block;
 243   flex: 1 0 auto;
 244   margin-left: auto;
 245   margin-right: auto;
 246   max-width: 22.35em;
 247 }
 248
 249 #PanelUI-contents-scroller {
 250   overflow-y: auto;
 251   overflow-x: hidden;
 252   width: 22.35em;
 253   flex: auto;
 254 }
 255
 256 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton > .toolbarbutton-icon {
 257   min-width: 0;
 258   min-height: 0;
 259   margin: 0;
 260 }
 261
 262 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item),
 263 .panelUI-grid .toolbarbutton-1,
 264 .panel-customization-placeholder-child {
 265   -moz-appearance: none;
 266   -moz-box-orient: vertical;
 267   width: calc(22.35em / 3 - 0.1px - 2px); /* LCARStrek: XXX: found out to be needed to fit the icons */
 268   height: calc(51px + 2.2em);
 269 }
 270
 271 /* In order to have button labels constrained appropriately, items inside the toolbarpaletteitem
 272  * should have a min-width set so they abide by the width set above (which they do outside of
 273  * customize mode because they're in a flexed container) */
 274 toolbarpaletteitem[place="panel"]:not([haswideitem=true]) > .toolbarbutton-1 {
 275   min-width: 0.01px;
 276 }
 277
 278 /* Help SDK buttons fit in. */
 279 toolbarpaletteitem[place="palette"] > toolbarbutton[sdk-button="true"] > .toolbarbutton-icon,
 280 toolbarbutton[sdk-button="true"][cui-areatype="menu-panel"] > .toolbarbutton-icon {
 281   height: 32px;
 282   width: 32px;
 283 }
 284
 285 .customization-palette .toolbarbutton-1 {
 286   -moz-appearance: none;
 287   -moz-box-orient: vertical;
 288 }
 289
 290 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button {
 291   -moz-appearance: none;
 292   -moz-box-orient: vertical;
 293   width: calc(22.35em / 3 - 0.1px - 2px);
 294   height: calc(49px + 2.2em);
 295   border: 0;
 296 }
 297
 298 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text,
 299 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-multiline-text {
 300   margin-top: 2px; /* Hack needed to get the label of type=menu-button aligned with other buttons */
 301 }
 302
 303 .panel-customization-placeholder-child {
 304   margin: 6px 0 0;
 305 /*  padding: 2px 6px;*/
 306 }
 307
 308 .panelUI-grid .toolbarbutton-1[type="menu"] {
 309   background-image: url("chrome://global/skin/arrow/arrow-down-sharp.gif");
 310   background-position: right 3px top 16px;
 311   background-repeat: no-repeat;
 312 }
 313
 314 .panelUI-grid .toolbarbutton-1[type="menu"]:-moz-locale-dir(rtl) {
 315   background-position: left 3px top 16px;
 316 }
 317
 318 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menu-dropmarker {
 319   display: none;
 320 }
 321
 322 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
 323   -moz-box-align: center;
 324   width: 16px;
 325   -moz-margin-start: -16px;
 326   height: 51px;
 327   margin-bottom: 2.2em;
 328   padding: 0;
 329 }
 330
 331 .panelUI-grid .toolbarbutton-1:not([buttonover]):not([disabled]):-moz-any([open],:hover:active) > .toolbarbutton-menubutton-dropmarker {
 332   border-radius: 0 0 0 2px;
 333 }
 334
 335 .panelUI-grid .toolbarbutton-1:not([buttonover]):not([disabled]):-moz-any([open],:hover:active)> .toolbarbutton-menubutton-dropmarker:-moz-locale-dir(rtl) {
 336   border-radius: 0 0 2px 0;
 337 }
 338
 339 #main-window:not([customizing]) .panel-combined-button[disabled] > .toolbarbutton-icon {
 340 /*  opacity: .5; */
 341 }
 342
 343 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) {
 344   width: calc(22.35em / 3 - 0.1px);
 345   margin: 0 !important;
 346 }
 347
 348 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) {
 349   -moz-box-align: center;
 350   -moz-box-pack: center;
 351 }
 352
 353 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"] > iframe {
 354   margin: 4px auto;
 355 }
 356
 357 #PanelUI-multiView[viewtype="subview"] > .panel-viewcontainer > .panel-viewstack > .panel-mainview >  #PanelUI-mainView {
 358 }
 359
 360 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-contents-scroller > #PanelUI-contents > .panel-wide-item,
 361 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-contents-scroller > #PanelUI-contents > .toolbarbutton-1:not([panel-multiview-anchor="true"]),
 362 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-fxa-status,
 363 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > toolbarseparator,
 364 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > #PanelUI-customize,
 365 #PanelUI-multiView[viewtype="subview"] #PanelUI-mainView > #PanelUI-footer > #PanelUI-footer-inner > #PanelUI-help:not([panel-multiview-anchor="true"]) {
 366   opacity: .5;
 367 }
 368
 369 /*
 370  * XXXgijs: this is a workaround for a layout issue that was caused by these iframes,
 371  * which was affecting subview display. Because of this, we're hiding the iframe *only*
 372  * when displaying a subview. The discerning user might notice this, but it's not nearly
 373  * as bad as the brokenness.
 374  * This hack should be removed once https://bugzilla.mozilla.org/show_bug.cgi?id=975375
 375  * is addressed.
 376  */
 377 #PanelUI-multiView[viewtype="subview"] toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > iframe {
 378   visibility: hidden;
 379 }
 380
 381 toolbaritem[cui-areatype="menu-panel"][sdkstylewidget="true"]:not(.panel-wide-item) > .toolbarbutton-text {
 382   text-align: center;
 383 }
 384
 385 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
 386 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-icon,
 387 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-container,
 388 .customization-palette .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
 389 .customization-palette .toolbarbutton-1 > .toolbarbutton-icon,
 390 .customization-palette .toolbarbutton-1 > .toolbarbutton-badge-container,
 391 .panelUI-grid #bookmarks-toolbar-placeholder > .toolbarbutton-icon,
 392 .customization-palette #bookmarks-toolbar-placeholder > .toolbarbutton-icon,
 393 .panel-customization-placeholder-child > .toolbarbutton-icon {
 394   min-width: 32px;
 395   min-height: 32px;
 396   /* Explanation for the below formula (A / B - C)
 397      A
 398        Each button is 22.35em / 3 - 0.1px wide
 399      B
 400        Each button has two margins.
 401      C (44px / 2 = 22px)
 402        The button icon is 32 pixels wide.
 403        The button has 12px of horizontal padding (6 on each side).
 404        The button has 0px of horizontal border (0 on each side).
 405        Total width of button's icon + button padding should therefore be 44px,
 406        which means each horizontal margin should be the half the button's width - (44/2) px.
 407   */
 408   margin: 4px calc((22.35em / 3 - 0.1px) / 2 - 22px);
 409 }
 410
 411 /* above we treat the container as the icon for the margins, that is so the
 412 /* badge itself is positioned correctly. Here we make sure that the icon itself
 413 /* has the minum size we want, but no padding/margin. */
 414 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-badge-container > .toolbarbutton-icon {
 415   min-width: 32px;
 416   min-height: 32px;
 417   margin: 0;
 418   padding: 0;
 419 }
 420
 421 toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton {
 422   -moz-box-flex: 1;
 423 }
 424
 425 #personal-bookmarks[overflowedItem=true] > #bookmarks-toolbar-placeholder {
 426   -moz-box-flex: 1;
 427 }
 428
 429 #personal-bookmarks[cui-areatype="toolbar"][overflowedItem=true] > #bookmarks-toolbar-placeholder > .toolbarbutton-icon {
 430   -moz-margin-end: 2px;
 431 }
 432
 433 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
 434 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-reset-button {
 435   border-left: none;
 436   border-right: none;
 437   border-radius: 0;
 438 }
 439
 440 #zoom-in-button > .toolbarbutton-text,
 441 #zoom-out-button > .toolbarbutton-text,
 442 #zoom-reset-button > .toolbarbutton-icon {
 443   display: none;
 444 }
 445
 446 #PanelUI-footer {
 447   display: flex;
 448   flex-shrink: 0;
 449   flex-direction: column;
 450 /*  background-color: hsla(210,4%,10%,.07);*/
 451   padding: 0;
 452   margin: 0;
 453 /*  min-height: 4em;*/
 454   border-bottom-right-radius: 4px;
 455   border-bottom-left-radius: 4px;
 456 }
 457
 458 #PanelUI-footer-inner {
 459   display: flex;
 460   border-top: 1px solid #9C9CFF;
 461 }
 462
 463 #PanelUI-multiView[viewtype="subview"] #PanelUI-footer-inner {
 464   position: relative;
 465 }
 466
 467 #PanelUI-footer-inner > toolbarseparator {
 468   border: 0;
 469   border-left: 1px solid #9C9CFF;
 470   margin: 0;
 471 }
 472
 473 #PanelUI-footer-inner:hover > toolbarseparator {
 474 /*  margin: 0;*/
 475 }
 476
 477 #PanelUI-help,
 478 #PanelUI-fxa-status,
 479 #PanelUI-customize,
 480 #PanelUI-quit {
 481   margin: 0;
 482   padding: 11px 0;
 483   box-sizing: border-box;
 484   min-height: 40px;
 485   box-shadow: none;
 486   border: none;
 487   border-radius: 0;
 488   transition: background-color;
 489   -moz-box-orient: horizontal;
 490 }
 491
 492 #PanelUI-fxa-status {
 493   border-top: 1px solid #9C9CFF;
 494   border-bottom: 1px solid transparent;
 495   margin-bottom: -1px;
 496 }
 497
 498 #PanelUI-fxa-status > .toolbarbutton-text {
 499   width: 0; /* Fancy cropping solution for flexbox. */
 500 }
 501
 502 #PanelUI-help[panel-multiview-anchor="true"] {
 503   -moz-image-region: rect(0, 32px, 16px, 16px);
 504 }
 505
 506 #PanelUI-help,
 507 #PanelUI-quit {
 508   min-width: 44px;
 509 }
 510
 511 #PanelUI-fxa-status > .toolbarbutton-text,
 512 #PanelUI-customize > .toolbarbutton-text {
 513   margin: 0;
 514   padding: 0 6px;
 515   text-align: start;
 516 }
 517
 518 #PanelUI-help > .toolbarbutton-text,
 519 #PanelUI-quit > .toolbarbutton-text {
 520   display: none;
 521 }
 522
 523 #PanelUI-help > .toolbarbutton-icon,
 524 #PanelUI-quit > .toolbarbutton-icon {
 525   -moz-margin-end: 0;
 526 }
 527
 528 #PanelUI-customize {
 529   flex: 1;
 530   -moz-padding-start: 15px;
 531   -moz-border-start-style: none;
 532 }
 533
 534 #PanelUI-fxa-status {
 535   list-style-image: url("chrome://browser/skin/syncFx-horizontalbar.png");
 536 }
 537
 538 #PanelUI-fxa-status[status="active"] {
 539   list-style-image: url("chrome://browser/skin/syncFxProgress-horizontalbar.png");
 540 }
 541
 542 #PanelUI-customize {
 543   list-style-image: url("chrome://browser/skin/menuPanel-customize.png");
 544 }
 545
 546 #customization-panelHolder #PanelUI-customize {
 547   list-style-image: url("chrome://browser/skin/customizableui/menuPanel-customizeFinish.png");
 548 }
 549
 550 #PanelUI-help {
 551   list-style-image: url("chrome://browser/skin/menuPanel-help.png");
 552 }
 553
 554 #PanelUI-quit {
 555   -moz-border-end-style: none;
 556   list-style-image: url("chrome://browser/skin/menuPanel-exit.png");
 557 }
 558
 559 #PanelUI-fxa-status,
 560 #PanelUI-customize,
 561 #PanelUI-help,
 562 #PanelUI-quit {
 563   -moz-image-region: rect(0, 16px, 16px, 0);
 564 }
 565
 566 #PanelUI-customize:hover,
 567 #PanelUI-help:not([disabled]):hover,
 568 #PanelUI-quit:not([disabled]):hover,
 569 #PanelUI-customize:hover:active,
 570 #PanelUI-help:not([disabled]):hover:active,
 571 #PanelUI-quit:not([disabled]):hover:active {
 572   -moz-image-region: rect(0, 32px, 16px, 16px);
 573 }
 574
 575 #PanelUI-help[disabled],
 576 #PanelUI-quit[disabled] {
 577   -moz-image-region: rect(0, 48px, 16px, 32px);
 578 }
 579
 580 #PanelUI-fxa-status:not([disabled]):hover,
 581 #PanelUI-help:not([disabled]):hover,
 582 #PanelUI-customize:hover,
 583 #PanelUI-quit:not([disabled]):hover {
 584 }
 585
 586 #PanelUI-fxa-status:not([disabled]):hover:active,
 587 #PanelUI-help:not([disabled]):hover:active,
 588 #PanelUI-customize:hover:active,
 589 #PanelUI-quit:not([disabled]):hover:active {
 590 }
 591
 592 #PanelUI-fxa-status:not([disabled]):hover,
 593 #PanelUI-fxa-status:not([disabled]):hover:active {
 594 }
 595
 596 #PanelUI-quit:not([disabled]):hover {
 597   background-color: #FF0000;
 598 }
 599
 600 #PanelUI-quit:not([disabled]):hover:active {
 601   background-color: #FF9F00;
 602 }
 603
 604 #customization-panelHolder #PanelUI-customize {
 605   color: #FFCF00;
 606   background-color: #008484;
 607   text-shadow: none;
 608   margin-top: -1px;
 609 }
 610
 611 #customization-panelHolder #PanelUI-customize + toolbarseparator {
 612   display: none;
 613 }
 614
 615 #customization-panelHolder #PanelUI-customize:hover,
 616 #customization-panelHolder #PanelUI-customize:hover:active {
 617   background-color: #FFCF00;
 618   color: #000000;
 619 }
 620
 621 #customization-palette .toolbarbutton-multiline-text,
 622 #customization-palette .toolbarbutton-text {
 623   display: none;
 624 }
 625
 626 panelview .toolbarbutton-1,
 627 .subviewbutton,
 628 .widget-overflow-list .toolbarbutton-1,
 629 .panelUI-grid .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 630 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton {
 631 /*  padding: 0 6px;
 632   background-color: hsla(210,4%,10%,0);
 633   border-radius: 2px;
 634   border-style: solid;
 635   border-color: hsla(210,4%,10%,0);*/
 636 }
 637
 638 panelview .toolbarbutton-1,
 639 .subviewbutton,
 640 .widget-overflow-list .toolbarbutton-1,
 641 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton {
 642   border-width: 0;
 643 }
 644
 645 .subviewbutton.panel-subview-footer {
 646 /*  border-radius: 0; */
 647   margin: 2px 0 0;
 648 }
 649
 650 .subviewbutton.panel-subview-footer > .menu-text {
 651   -moz-margin-start: 0px !important;
 652   -moz-padding-start: 6px;
 653   -moz-padding-end: 6px;
 654   -moz-box-flex: 0;
 655   text-align: center;
 656 }
 657
 658 .subviewbutton.panel-subview-footer > .toolbarbutton-icon {
 659   margin: 0;
 660 }
 661
 662 .subviewbutton.panel-subview-footer > .toolbarbutton-text {
 663   text-align: center;
 664   padding: 0;
 665 }
 666
 667 .subviewbutton.panel-subview-footer > .menu-accel-container {
 668   -moz-padding-start: 6px;
 669 }
 670
 671 .subviewbutton:not(.panel-subview-footer) {
 672   margin: 0;
 673 }
 674
 675 .subviewbutton:not(.panel-subview-footer) > .toolbarbutton-text,
 676 /* Bookmark items need a more specific selector. */
 677 .PanelUI-subView .subviewbutton:not(.panel-subview-footer) > .menu-text,
 678 .PanelUI-subView .subviewbutton:not(.panel-subview-footer) > .menu-iconic-text {
 679 /*  font: menu;*/
 680 }
 681
 682 .PanelUI-subView .subviewbutton[shortcut]::after {
 683   content: attr(shortcut);
 684   float: right;
 685   color: #A09090;
 686 }
 687
 688 .PanelUI-subView.cui-widget-panelview .subviewbutton[shortcut]::after {
 689   -moz-margin-start: 10px;
 690 }
 691
 692 /* This is a <label> but it should fit in with the menu font- and colorwise. */
 693 #PanelUI-characterEncodingView-autodetect-label {
 694   font: menu;
 695   color: inherit;
 696 }
 697
 698 .cui-widget-panelview .subviewbutton:not(.panel-subview-footer) {
 699 /*  margin-left: 4px;
 700   margin-right: 4px;*/
 701 }
 702
 703 panelview .toolbarbutton-1,
 704 .widget-overflow-list .toolbarbutton-1 {
 705   margin-top: 6px;
 706 }
 707
 708 /*
 709 panelview .toolbarbutton-1:not(:-moz-any([disabled],[open],:active)):hover,
 710 toolbarbutton.subviewbutton:not(:-moz-any([disabled],[open],:active)):hover,
 711 menu.subviewbutton:not(:-moz-any([disabled],:active))[_moz-menuactive],
 712 menuitem.subviewbutton:not(:-moz-any([disabled],:active))[_moz-menuactive],
 713 .widget-overflow-list .toolbarbutton-1:not(:-moz-any([disabled],[open],:active)):hover,
 714 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])
 715     > toolbarbutton:not(:-moz-any([disabled],[checked="true"],[open],:active)):hover {
 716   background-color: hsla(210,4%,10%,.08);
 717   border-color: hsla(210,4%,10%,.11);
 718 }
 719
 720 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]):not(:-moz-any([disabled],[open],:active)):hover {
 721   border-color: hsla(210,4%,10%,.11);
 722 }
 723
 724 panelview .toolbarbutton-1:-moz-any(:not([disabled]):-moz-any([open],:hover:active),[checked=true]),
 725 toolbarbutton.subviewbutton:not([disabled]):-moz-any([open],:hover:active),
 726 menu.subviewbutton:not([disabled])[_moz-menuactive]:active,
 727 menuitem.subviewbutton:not([disabled])[_moz-menuactive]:active,
 728 .widget-overflow-list .toolbarbutton-1:not([disabled]):-moz-any([open],:hover:active),
 729 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true])
 730     > toolbarbutton:not([disabled]):-moz-any([open],:hover:active) {
 731   background-color: hsla(210,4%,10%,.12);
 732   border-color: hsla(210,4%,10%,.14);
 733   box-shadow: 0 1px 0 hsla(210,4%,10%,.03) inset;
 734 }
 735
 736 .subviewbutton.panel-subview-footer {
 737   margin: 4px -4px -4px;
 738   background-color: hsla(210,4%,10%,.07);
 739   border-top: 1px solid hsla(210,4%,10%,.12);
 740   border-radius: 0;
 741   color: hsl(0,0%,25%)
 742 }
 743
 744 menuitem.panel-subview-footer:not(:-moz-any([disabled],[open],:active)):hover,
 745 .subviewbutton.panel-subview-footer:not(:-moz-any([disabled],[open],:active)):hover {
 746   background-color: hsla(210,4%,10%,.1);
 747   border-top: 1px solid hsla(210,4%,10%,.12);
 748 }
 749
 750 menuitem.panel-subview-footer:not([disabled]):-moz-any([open],:hover:active),
 751 .subviewbutton.panel-subview-footer:not([disabled]):-moz-any([open],:hover:active) {
 752   background-color: hsla(210,4%,10%,.15);
 753   border-top: 1px solid hsla(210,4%,10%,.12);
 754   box-shadow: 0 1px 0 hsla(210,4%,10%,.05) inset;
 755 }
 756
 757 #BMB_bookmarksPopup .subviewbutton {
 758   font: menu;
 759   font-weight: normal;
 760 }
 761
 762 #BMB_bookmarksPopup .subviewbutton:not([disabled="true"]) {
 763   color: inherit;
 764 }
 765
 766 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-up,
 767 #BMB_bookmarksPopup > .panel-arrowcontainer > .panel-arrowcontent > .popup-internal-box > .autorepeatbutton-down {
 768   -moz-appearance: none;
 769   margin-top: 0;
 770   margin-bottom: 0;
 771 }
 772
 773 / Remove padding on xul:arrowscrollbox to avoid extra padding on footer /
 774 #BMB_bookmarksPopup arrowscrollbox {
 775   padding-bottom: 0px;
 776 }
 777
 778 #BMB_bookmarksPopup menupopup > .bookmarks-actions-menuseparator {
 779   / Hide bottom separator as the styled footer includes a top border serving the same purpose /
 780   display: none;
 781 }
 782
 783 / Popups with only one item don't have a footer /
 784 #BMB_bookmarksPopup menupopup[placespopup=true][singleitempopup=true] > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
 785 / These popups never have a footer /
 786 #BMB_bookmarksToolbarPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox,
 787 #BMB_unsortedBookmarksPopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox {
 788   / And so they need some bottom padding: /
 789   padding-bottom: 4px;
 790 }
 791
 792 / Disabled (empty) item is always alone and never has an icon, so fix its left padding /
 793 #BMB_bookmarksPopup menupopup[emptyplacesresult] .bookmark-item.subviewbutton {
 794   padding-left: 6px;
 795 }
 796 */
 797
 798 .PanelUI-subView menuseparator,
 799 .PanelUI-subView toolbarseparator,
 800 .cui-widget-panelview menuseparator {
 801   -moz-appearance: none;
 802   min-height: 0;
 803   border-top: 1px solid #9C9CFF;
 804   margin: 2px 0;
 805   padding: 0;
 806 }
 807
 808 .PanelUI-subView menuseparator,
 809 .PanelUI-subView toolbarseparator {
 810 /*  -moz-margin-start: -5px;
 811   -moz-margin-end: -4px;*/
 812 }
 813
 814 .PanelUI-subView menuseparator.small-separator,
 815 .PanelUI-subView toolbarseparator.small-separator {
 816 /*  margin-left: 5px;
 817   margin-right: 5px;*/
 818 }
 819
 820 .cui-widget-panelview menuseparator.small-separator {
 821 /*  margin-left: 10px;
 822   margin-right: 10px;*/
 823 }
 824
 825 .subviewbutton > .menu-accel-container {
 826   -moz-box-pack: start;
 827   -moz-margin-start: 10px;
 828   -moz-margin-end: auto;
 829   color: #A09090;
 830 }
 831
 832 #PanelUI-historyItems > toolbarbutton {
 833   list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
 834 }
 835
 836 #PanelUI-recentlyClosedWindows > toolbarbutton > .toolbarbutton-icon,
 837 #PanelUI-recentlyClosedTabs > toolbarbutton > .toolbarbutton-icon,
 838 #PanelUI-historyItems > toolbarbutton > .toolbarbutton-icon {
 839   width: 16px;
 840   height: 16px;
 841 }
 842
 843 toolbarbutton[panel-multiview-anchor="true"],
 844 toolbarbutton[panel-multiview-anchor="true"] > .toolbarbutton-menubutton-button {
 845   color: #000000;
 846   background-color: #008484;
 847 }
 848
 849 #PanelUI-help[panel-multiview-anchor="true"] + toolbarseparator {
 850   display: none;
 851 }
 852
 853 #PanelUI-help[panel-multiview-anchor="true"] {
 854   background-image: none;
 855 }
 856
 857 #PanelUI-help[panel-multiview-anchor="true"]::after {
 858   content: "";
 859   position: absolute;
 860   top: 0;
 861   height: 100%;
 862   width: 38px;
 863   background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png");
 864   background-repeat: no-repeat;
 865   background-color: #008484;
 866   background-position: left 10px center, 0; /* this doesn't need to be changed for RTL */
 867 }
 868
 869 toolbarbutton[panel-multiview-anchor="true"] {
 870   background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted.png");
 871   background-position: right 5px center;
 872   background-repeat: no-repeat;
 873 }
 874
 875 toolbarbutton[panel-multiview-anchor="true"]:-moz-locale-dir(rtl) {
 876   background-image: url("chrome://browser/skin/customizableui/subView-arrow-back-inverted-rtl.png");
 877   background-position: left 5px center;
 878 }
 879
 880 toolbarpaletteitem[place="palette"] > .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker,
 881 #bookmarks-menu-button[cui-areatype="menu-panel"] > .toolbarbutton-menubutton-dropmarker {
 882   display: none;
 883 }
 884
 885 #search-container[cui-areatype="menu-panel"],
 886 #wrapper-search-container[place="panel"] {
 887   width: 22.35em;
 888 }
 889
 890 #search-container[cui-areatype="menu-panel"] {
 891   margin-top: 6px;
 892   margin-bottom: 6px;
 893 }
 894
 895 toolbarpaletteitem[place="palette"] > #search-container {
 896   min-width: 7em;
 897   width: 7em;
 898 }
 899
 900 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) {
 901   padding: 0;
 902   transition-property: background-color, border-color;
 903   transition-duration: 150ms;
 904 }
 905
 906 /* Make direct siblings overlap borders: */
 907 .toolbaritem-combined-buttons + .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) {
 908 /*  border-top-color: transparent !important; */
 909 }
 910
 911 .toolbaritem-combined-buttons + .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]),
 912 toolbarpaletteitem[haswideitem][place="panel"] + toolbarpaletteitem[haswideitem][place="panel"] {
 913 /*  margin-top: -1px; */
 914 }
 915
 916 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton {
 917   border: 0;
 918   padding: .5em;
 919   margin: 0;
 920   -moz-box-flex: 1;
 921   min-width: calc(22.35em / 3 - 0.1px);
 922   max-width: calc(22.35em / 3 - 0.1px);
 923   /* We'd prefer to use height: auto here but it leads to layout bugs in the panel. Cope:
 924      1.2em for line height + 2 * .5em padding + margin on the label (2 * 2px) */
 925   height: calc(2.2em + 4px);
 926   max-height: none;
 927   -moz-box-orient: horizontal;
 928 }
 929
 930 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #copy-button,
 931 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-reset-button {
 932   /* reduce the width with 2px for this button to compensate for two separators
 933      of 1px. */
 934   min-width: calc(22.35em / 3 - 0.1px - 2px);
 935   max-width: calc(22.35em / 3 - 0.1px - 2px);
 936 }
 937
 938 #main-window:not([customizing]) .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > toolbarbutton[disabled] > .toolbarbutton-icon {
 939 /*  opacity: .25; */
 940 }
 941
 942 #zoom-controls[cui-areatype="toolbar"] > #zoom-reset-button > .toolbarbutton-text {
 943   min-width: 7ch;
 944 }
 945
 946 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:-moz-locale-dir(ltr),
 947 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:-moz-locale-dir(rtl),
 948 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:-moz-locale-dir(ltr),
 949 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:-moz-locale-dir(rtl) {
 950   border-top-right-radius: 0;
 951   border-bottom-right-radius: 0;
 952 }
 953
 954 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #cut-button:-moz-locale-dir(rtl),
 955 #edit-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #paste-button:-moz-locale-dir(ltr),
 956 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-out-button:-moz-locale-dir(rtl),
 957 #zoom-controls:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > #zoom-in-button:-moz-locale-dir(ltr) {
 958   border-top-left-radius: 0;
 959   border-bottom-left-radius: 0;
 960 }
 961
 962 .toolbaritem-combined-buttons > separator {
 963   -moz-appearance: none;
 964   width: 3px;
 965   -moz-box-align: stretch;
 966 }
 967
 968 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]) > separator {
 969   margin: .5em 0;
 970   width: 1px;
 971   height: auto;
 972 /*  background: hsla(210,4%,10%,.15);*/
 973   transition-property: margin;
 974   transition-duration: 10ms;
 975   transition-timing-function: ease;
 976 }
 977
 978 .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem=true]):hover > separator {
 979   margin: 0;
 980 }
 981
 982 #widget-overflow > .panel-arrowcontainer > .panel-arrowcontent {
 983   padding: 0;
 984 }
 985
 986 .cui-widget-panelview,
 987 #widget-overflow-scroller {
 988   overflow-y: auto;
 989   overflow-x: hidden;
 990 }
 991
 992 #widget-overflow-scroller {
 993   max-height: 30em;
 994   margin-top: 10px;
 995   margin-bottom: 10px;
 996 }
 997
 998 #widget-overflow-list {
 999   width: 22.35em;
1000   padding-left: 10px;
1001   padding-right: 10px;
1002 }
1003
1004 toolbaritem[overflowedItem=true],
1005 toolbarbutton[overflowedItem=true] {
1006   width: 100%;
1007   max-width: 22.35em;
1008   min-height: 36px;
1009   background-repeat: no-repeat;
1010   background-position: 0 center;
1011 }
1012
1013 .widget-overflow-list .toolbarbutton-1,
1014 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1015   -moz-box-align: center;
1016   -moz-box-orient: horizontal;
1017 }
1018
1019 .widget-overflow-list .toolbarbutton-1:not(.toolbarbutton-combined) > .toolbarbutton-text,
1020 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-text {
1021   text-align: start;
1022   -moz-padding-start: .5em;
1023 }
1024
1025 #widget-overflow-list > .toolbaritem-combined-buttons {
1026   min-height: 28px;
1027 }
1028
1029 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button::after {
1030   content: "";
1031   display: -moz-box;
1032   width: 1px;
1033   height: 18px;
1034   -moz-margin-end: -1px;
1035 }
1036
1037 .subviewbutton[checked="true"] {
1038   background-image: url("chrome://global/skin/menu/menu-check.gif");
1039   background-position: top 5px left 4px;
1040   background-repeat: no-repeat;
1041 }
1042
1043 .subviewbutton[checked="true"]:-moz-locale-dir(rtl) {
1044   background-position: top 5px right 4px;
1045 }
1046
1047 .subviewbutton[checked="true"]:hover {
1048   background-image: url("chrome://global/skin/menu/menu-check-hover.gif");
1049 }
1050
1051 .subbiewbutton > .menu-iconic-left {
1052   -moz-margin-end: 3px;
1053 }
1054
1055 menuitem[checked="true"].subviewbutton > .menu-iconic-left {
1056   visibility: hidden;
1057 }
1058
1059 .panel-mainview[panelid=customizationui-widget-panel],
1060 #customizationui-widget-multiview > .panel-viewcontainer,
1061 #customizationui-widget-multiview > .panel-viewcontainer > .panel-viewstack,
1062 #PanelUI-panicView > .panel-subview-body,
1063 #PanelUI-panicView {
1064   overflow: visible;
1065   color: #FF9F00;
1066 }
1067
1068 #PanelUI-panicView.cui-widget-panelview {
1069   min-width: 280px;
1070 }
1071
1072 #PanelUI-panic-timeframe {
1073   padding: 15px;
1074   border-bottom: 1px solid #A09090;
1075 }
1076
1077 #panic-button-success-icon,
1078 #PanelUI-panic-timeframe-icon,
1079 #PanelUI-panic-timeframe-icon-small {
1080   background-color: transparent;
1081   -moz-margin-end: 10px;
1082 }
1083
1084 #panic-button-success-icon,
1085 #PanelUI-panic-timeframe-icon {
1086   list-style-image: url(chrome://browser/skin/panic-panel/header.png);
1087   max-height: 48px;
1088   width: 48px;
1089 }
1090
1091 #PanelUI-panic-timeframe-icon-small {
1092   list-style-image: url(chrome://browser/skin/panic-panel/header-small.png);
1093   max-height: 32px;
1094   width: 32px;
1095 }
1096
1097 /* current attribute is only set when in use as a subview instead of a main view */
1098 #PanelUI-panicView[current] #PanelUI-panic-timeframe-icon {
1099   display: none;
1100 }
1101
1102 #PanelUI-panicView.cui-widget-panelview #PanelUI-panic-timeframe-icon-small {
1103   display: none;
1104 }
1105
1106 #panic-button-success-header,
1107 #PanelUI-panic-header {
1108   -moz-box-align: center;
1109   margin-bottom: 5px;
1110 }
1111
1112 #PanelUI-panicView.cui-widget-panelview #PanelUI-panic-header {
1113   margin-bottom: 0;
1114 }
1115
1116 #PanelUI-panic-timeframe-icon-small:-moz-locale-dir(rtl),
1117 #PanelUI-panic-timeframe-icon:-moz-locale-dir(rtl) {
1118   transform: scaleX(-1);
1119 }
1120
1121 /*
1122 .subviewradio {
1123 }
1124
1125 .subviewradio@buttonStateHover@ {
1126 }
1127
1128 .subviewradio[selected],
1129 .subviewradio[selected]:hover,
1130 .subviewradio@buttonStateActive@ {
1131 }
1132
1133 .subviewradio > .radio-check {
1134 }
1135
1136 .subviewradio > .radio-check[selected] {
1137 }
1138 */
1139
1140 #PanelUI-panic-explanations {
1141   padding: 10px 10px 0;
1142 }
1143
1144 #PanelUI-panic-actionlist-main-label {
1145   color: #A09090;
1146   font-size: 0.9em;
1147 }
1148
1149 .PanelUI-panic-actionlist {
1150   -moz-padding-start: 20px;
1151   padding-top: 2px;
1152   padding-bottom: 2px;
1153   background-size: 16px 16px;
1154   background-repeat: no-repeat;
1155   background-color: transparent;
1156   background-position: center left;
1157 }
1158
1159 .PanelUI-panic-actionlist:-moz-locale-dir(rtl) {
1160   background-position: center right;
1161 }
1162
1163 #PanelUI-panic-actionlist-cookies {
1164   background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 16, 16, 0);
1165 }
1166
1167 #PanelUI-panic-actionlist-history {
1168   background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 32, 16, 16);
1169 }
1170
1171 #PanelUI-panic-actionlist-windows {
1172   background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 48, 16, 32);
1173 }
1174
1175 #PanelUI-panic-actionlist-newwindow {
1176   background-image: -moz-image-rect(url(chrome://browser/skin/panic-panel/icons.png), 0, 64, 16, 48);
1177 }
1178
1179 #PanelUI-panic-warning {
1180   color: #FF0000;
1181   text-align: center;
1182   width: 100%;
1183   margin-top: 20px;
1184 }
1185
1186 #PanelUI-panic-view-button {
1187   background-color: #FF0000;
1188   color: #000000;
1189 }
1190
1191 #PanelUI-panic-view-button:hover {
1192   background-color: #FFCF00;
1193 }
1194
1195 #PanelUI-panic-view-button:hover:active {
1196   background-color: #FF9F00;
1197 }
1198
1199 #PanelUI-panic-view-button > .toolbarbutton-text {
1200   text-align: center;
1201   text-shadow: none;
1202 }
1203
1204 #panic-button-success-closebutton {
1205 }
1206
1207 #panic-button-success-closebutton:hover {
1208 }
1209
1210 #panic-button-success-closebutton:hover:active {
1211 }
1212
1213 /* === END panelUIOverlay.inc.css === */
1214
1215 #PanelUI-contents #zoom-out-btn {
1216   padding-left: 12px;
1217   padding-right: 12px;
1218 }
1219
1220 #PanelUI-contents #zoom-in-btn {
1221   padding-left: 12px;
1222   padding-right: 12px;
1223 }
1224
1225 /* bookmark panel submenus */
1226
1227 #BMB_bookmarksPopup menupopup[placespopup=true] {
1228 /*  background: transparent;
1229   border: none;
1230   padding: 6px;*/
1231 }
1232
1233 #BMB_bookmarksPopup menupopup[placespopup=true] > hbox {
1234   /* emulating chrome://browser/content/places/menu.xml#places-popup-arrow but without the arrow */
1235 /*  background: #FFF;
1236   border: 1px solid rgba(0,0,0,0.25);
1237   border-radius: 3.5px;
1238   margin-top: -4px;*/
1239 }
1240
1241 #BMB_bookmarksPopup menupopup {
1242 /*  padding-top: 2px;*/
1243 }
1244
1245 /* Add some space at the top because there are no headers: */
1246 #BMB_bookmarksPopup menupopup[placespopup=true] > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox  {
1247 /*  padding-top: 4px;*/
1248 }
1249
1250 #BMB_bookmarksPopup .menu-text {
1251 /*  color: #000;*/
1252 }
1253
1254 /* bookmark panel separator */
1255 #BMB_bookmarksPopup menuseparator {
1256   padding-top: 0;
1257   padding-bottom: 0;
1258 }
1259
1260 .subviewbutton > .menu-right,
1261 .subviewbutton > .menu-iconic-left {
1262 /*  padding-top: 1px;
1263   margin-top: 1px;
1264   margin-bottom: 2px;*/
1265 }
1266
1267 /* Disabled empty item looks too small otherwise, because it has no icon. */
1268 menuitem.subviewbutton[disabled]:not(.menuitem-iconic),
1269 /* Same for checkbox menu items, whose icons lose size due to -moz-appearance: none: */
1270 menuitem[type="checkbox"].subviewbutton {
1271   /* This is 16px for an icon + 3px for its margins + 1px for its padding +
1272    * 2px for its border, see above */
1273 /*  min-height: 22px;*/
1274 }
1275
1276 .subviewbutton > .toolbarbutton-text {
1277 /*  padding-top: 3px;
1278   padding-bottom: 3px;*/
1279 }
1280
1281 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-button {
1282   -moz-appearance: none;
1283   border: 0;
1284   -moz-margin-start: 3px;
1285 }
1286
1287 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
1288   padding: 0 2px;
1289   -moz-padding-start: 0;
1290   height: 18px;
1291 }
1292
1293 .widget-overflow-list .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
1294   padding: 0 6px;
1295 }
1296
1297 .subviewbutton > .toolbarbutton-text {
1298   -moz-padding-start: 16px;
1299 }
1300
1301 .subviewbutton:-moz-any([image],[targetURI],.cui-withicon, .restoreallitem, .bookmark-item) > .toolbarbutton-text {
1302   -moz-padding-start: 0;
1303 }
1304
1305 .subviewbutton.bookmark-item > .toolbarbutton-icon {
1306   -moz-margin-start: 3px;
1307 }
1308
1309 /* subviewbutton entries for social sidebars have images that come from external
1310 /* sources, and are not guaranteed to be the size we want, so force the size on
1311 /* those icons. */
1312 toolbarbutton.social-provider-menuitem > .toolbarbutton-icon {
1313   width: 16px;
1314   height: 16px;
1315 }
1316
1317 .subviewbutton:-moz-any([image],[targetURI],.cui-withicon, .restoreallitem, .bookmark-item)[checked="true"] > .toolbarbutton-icon {
1318   visibility: hidden;
1319 }
1320
1321 menu.subviewbutton > .menu-right {
1322   list-style-image: url("chrome://global/skin/menu/menu-arrow.gif");
1323 }
1324 menu.subviewbutton:hover > .menu-right,
1325 menu.subviewbutton[_moz-menuactive="true"] > .menu-right {
1326   list-style-image: url("chrome://global/skin/menu/menu-arrow-hover.gif");
1327 }
1328 menu[disabled="true"].subviewbutton > .menu-right {
1329   list-style-image: url("chrome://global/skin/menu/menu-arrow-disabled.gif");
1330 }