autocomplete.css 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  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. /* ===== autocomplete.css =================================================
  5. == Styles used by the autocomplete widget.
  6. ======================================================================= */
  7. @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  8. @namespace html url("http://www.w3.org/1999/xhtml");
  9. /* ::::: autocomplete ::::: */
  10. /* .padded is used by autocomplete widgets that don't have an icon. Gross. -dwh */
  11. textbox:not(.padded) {
  12. cursor: default;
  13. padding: 0;
  14. }
  15. textbox[enablehistory="true"] {
  16. -moz-appearance: none;
  17. border: 0;
  18. background-color: transparent;
  19. }
  20. textbox[nomatch="true"][highlightnonmatches="true"] {
  21. color: red;
  22. }
  23. .private-autocomplete-textbox-container {
  24. -moz-box-align: center;
  25. }
  26. textbox[enablehistory="true"] > .autocomplete-textbox-container {
  27. -moz-appearance: menulist-textfield;
  28. }
  29. textbox:not(.padded) .textbox-input-box {
  30. margin: 0 3px;
  31. }
  32. .textbox-input-box {
  33. -moz-box-align: center;
  34. }
  35. /* ::::: autocomplete popups ::::: */
  36. panel[type="private-autocomplete"],
  37. panel[type="private-autocomplete-richlistbox"],
  38. .private-autocomplete-history-popup {
  39. border-width: 1px;
  40. -moz-border-top-colors: ThreeDDarkShadow;
  41. -moz-border-right-colors: ThreeDDarkShadow;
  42. -moz-border-bottom-colors: ThreeDDarkShadow;
  43. -moz-border-left-colors: ThreeDDarkShadow;
  44. padding: 0;
  45. background-color: -moz-Field;
  46. }
  47. .private-autocomplete-history-popup {
  48. max-height: 180px;
  49. }
  50. /* ::::: tree ::::: */
  51. .private-autocomplete-tree {
  52. -moz-appearance: none !important;
  53. border: none !important;
  54. background-color: transparent !important;
  55. color: MenuText;
  56. }
  57. .private-autocomplete-treecol {
  58. -moz-appearance: none !important;
  59. margin: 0 !important;
  60. border: none !important;
  61. padding: 0 !important;
  62. }
  63. /* GTK calculates space for a sort arrow */
  64. .private-autocomplete-treecol > .treecol-sortdirection {
  65. -moz-appearance: none !important;
  66. }
  67. .private-autocomplete-treebody::-moz-tree-cell-text {
  68. padding-inline-start: 8px;
  69. }
  70. treechildren.private-autocomplete-treebody::-moz-tree-row(selected) {
  71. background-color: Highlight;
  72. }
  73. treechildren.private-autocomplete-treebody::-moz-tree-cell-text(selected) {
  74. color: HighlightText !important;
  75. }
  76. .private-autocomplete-treebody::-moz-tree-image(treecolAutoCompleteValue) {
  77. max-width: 16px;
  78. height: 16px;
  79. }
  80. /* ::::: richlistbox autocomplete ::::: */
  81. .private-autocomplete-richlistbox {
  82. -moz-appearance: none;
  83. margin: 1px;
  84. background-color: transparent;
  85. }
  86. .private-autocomplete-richlistitem[selected="true"] {
  87. background-color: Highlight;
  88. color: HighlightText;
  89. }
  90. .private-autocomplete-richlistitem {
  91. padding: 6px 2px;
  92. color: MenuText;
  93. }
  94. .ac-url-box {
  95. /* When setting a vertical margin here, half of that needs to be added
  96. .ac-title-box's translateY for when .ac-url-box is hidden (see below). */
  97. margin-top: 1px;
  98. }
  99. .private-autocomplete-richlistitem[actiontype="keyword"] .ac-url-box,
  100. .private-autocomplete-richlistitem[actiontype="searchengine"] .ac-url-box,
  101. .private-autocomplete-richlistitem[actiontype="visiturl"] .ac-url-box,
  102. .private-autocomplete-richlistitem[type~="autofill"] .ac-url-box {
  103. visibility: hidden;
  104. }
  105. .private-autocomplete-richlistitem[actiontype="keyword"] .ac-title-box,
  106. .private-autocomplete-richlistitem[actiontype="searchengine"] .ac-title-box,
  107. .private-autocomplete-richlistitem[actiontype="visiturl"] .ac-title-box,
  108. .private-autocomplete-richlistitem[type~="autofill"] .ac-title-box {
  109. /* Center the title by moving it down by half of .ac-url-box's height,
  110. including vertical margins (if any). */
  111. transform: translateY(.5em);
  112. }
  113. .ac-site-icon {
  114. width: 16px;
  115. height: 16px;
  116. margin-bottom: -2px;
  117. margin-inline-start: 3px;
  118. margin-inline-end: 6px;
  119. }
  120. .ac-type-icon {
  121. width: 16px;
  122. height: 16px;
  123. margin-inline-start: 6px;
  124. margin-inline-end: 4px;
  125. }
  126. .ac-extra > .ac-result-type-tag {
  127. margin: 0 4px;
  128. }
  129. .ac-extra > .ac-comment {
  130. padding-right: 4px;
  131. }
  132. .ac-ellipsis-after {
  133. margin: 0 !important;
  134. padding: 0;
  135. min-width: 1em;
  136. }
  137. .ac-normal-text {
  138. margin: 0 !important;
  139. padding: 0;
  140. }
  141. .ac-normal-text > html|span {
  142. margin: 0 !important;
  143. padding: 0;
  144. }
  145. html|span.ac-emphasize-text {
  146. box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1);
  147. background-color: rgba(0,0,0,0.05);
  148. border-radius: 2px;
  149. text-shadow: 0 0 currentColor; /*faux bold effect*/
  150. }
  151. .ac-url-text > html|span.ac-emphasize-text,
  152. .ac-action-text > html|span.ac-emphasize-text {
  153. box-shadow: none;
  154. }
  155. .ac-normal-text[selected="true"] > html|span.ac-emphasize-text {
  156. box-shadow: inset 0 0 1px 1px rgba(255,255,255,0.3);
  157. background-color: rgba(255,255,255,0.2);
  158. }
  159. .ac-title, .ac-url {
  160. overflow: hidden;
  161. }
  162. /* ::::: textboxes inside toolbarpaletteitems ::::: */
  163. toolbarpaletteitem > toolbaritem > textbox > hbox > hbox > html|*.textbox-input {
  164. visibility: hidden;
  165. }
  166. toolbarpaletteitem > toolbaritem > * > textbox > hbox > hbox > html|*.textbox-input {
  167. visibility: hidden;
  168. }