overlay.css 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  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. @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  5. @namespace html url("http://www.w3.org/1999/xhtml");
  6. /*
  7. * General styles
  8. */
  9. #status4evar-status-widget,
  10. #status4evar-progress-widget
  11. {
  12. -moz-box-align: center;
  13. }
  14. [forcevisible="true"]
  15. {
  16. visibility: visible !important;
  17. }
  18. #wrapper-status4evar-progress-widget progressmeter,
  19. #wrapper-status4evar-download-button toolbarbutton
  20. {
  21. visibility: visible;
  22. }
  23. #wrapper-status4evar-status-widget toolbaritem label
  24. {
  25. background-color: rgba(0,0,0,0.2);
  26. padding: 2px 4px;
  27. }
  28. /*
  29. * Options button
  30. */
  31. #status4evar-options-button
  32. {
  33. list-style-image: url("chrome://browser/skin/statusbar/pms24.png");
  34. }
  35. toolbar[iconsize="small"] #status4evar-options-button
  36. {
  37. list-style-image: url("chrome://browser/skin/statusbar/pms16.png");
  38. }
  39. /*
  40. * Download status
  41. */
  42. toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"],
  43. toolbar[mode="text"] #status4evar-download-button
  44. {
  45. -moz-box-orient: horizontal !important;
  46. }
  47. toolbar[mode="icons"] #status4evar-download-button[forcelabel="true"] > label
  48. {
  49. display: -moz-box !important;
  50. }
  51. #status4evar-download-progress-bar
  52. {
  53. border: 1px solid gray;
  54. -moz-appearance: none;
  55. margin: 0px;
  56. min-height: 0px;
  57. min-width: 0px;
  58. }
  59. #status4evar-download-progress-bar > *
  60. {
  61. -moz-appearance: none;
  62. background: #FFFFFF;
  63. }
  64. #status4evar-download-progress-bar[pmType$="unknown"] > .progress-bar
  65. {
  66. background-image: url("chrome://browser/skin/statusbar/pulse.png");
  67. }
  68. #status4evar-download-notification-container
  69. {
  70. min-height: 1px;
  71. min-width: 1px;
  72. height: 1px;
  73. margin-bottom: -1px;
  74. position: relative;
  75. z-index: 5;
  76. }
  77. #status4evar-download-notification-icon
  78. {
  79. opacity: 0;
  80. background-size: 16px;
  81. background-position: center;
  82. background-repeat: no-repeat;
  83. width: 16px;
  84. height: 16px;
  85. }
  86. @keyframes status4evar-download-notification-finish
  87. {
  88. from { opacity: 0; transform: scale(1); }
  89. 20% { opacity: .65; animation-timing-function: ease-in; }
  90. to { opacity: 0; transform: scale(8); }
  91. }
  92. #status4evar-download-notification-anchor[notification="finish"][forcevisible="true"] #status4evar-download-notification-icon
  93. {
  94. background-image: url("chrome://browser/skin/downloads/download-notification-finish.png");
  95. animation-name: status4evar-download-notification-finish;
  96. animation-duration: 1s;
  97. }
  98. /*
  99. * Splitter
  100. */
  101. splitter.status4evar-status-splitter
  102. {
  103. -moz-appearance: splitter;
  104. border: none;
  105. background: transparent;
  106. position: relative;
  107. }
  108. splitter.status4evar-status-splitter:not(:hover)
  109. {
  110. -moz-appearance: none;
  111. }
  112. /*
  113. * General progress
  114. */
  115. #status4evar-progress-bar[s4estyle="true"] > *
  116. {
  117. border: none;
  118. }
  119. #status4evar-progress-bar > .progress-remainder
  120. {
  121. background-image: none;
  122. background-color: transparent;
  123. }
  124. #status4evar-progress-bar[s4estyle="true"] > .progress-bar
  125. {
  126. border-right: 1px solid rgba(0,0,0,.2);
  127. }
  128. #status4evar-progress-bar[s4estyle="true"][value="0"] > .progress-bar,
  129. #status4evar-progress-bar[s4estyle="true"][value="100"] > .progress-bar
  130. {
  131. border-right: none;
  132. }
  133. /*
  134. * Status bar
  135. */
  136. #status-bar > .statusbar-resizerpanel
  137. {
  138. display: none !important;
  139. }