browser.css 58 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220
  1. %if 0
  2. /* This Source Code Form is subject to the terms of the Mozilla Public
  3. * License, v. 2.0. If a copy of the MPL was not distributed with this
  4. * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
  5. %endif
  6. @import url("chrome://global/skin/");
  7. @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
  8. @namespace html url("http://www.w3.org/1999/xhtml");
  9. %include ../shared/browser.inc
  10. %filter substitution
  11. %define toolbarHighlight rgba(255,255,255,.3)
  12. %define selectedTabHighlight rgba(255,255,255,.8) 1px, rgba(255,255,255,.5) 3px
  13. %define forwardTransitionLength 150ms
  14. %define conditionalForwardWithUrlbar window:not([chromehidden~=toolbar]) :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"][mode=icons], #nav-bar:not([currentset])[mode=icons]) > #unified-back-forward-button
  15. %define conditionalForwardWithUrlbar_small window:not([chromehidden~=toolbar]) :-moz-any(#nav-bar[currentset*="unified-back-forward-button,urlbar-container"][mode=icons][iconsize=small],#nav-bar:not([currentset])[mode=icons][iconsize=small]) > #unified-back-forward-button
  16. #menubar-items {
  17. -moz-box-orient: vertical; /* for flex hack */
  18. }
  19. #main-menubar {
  20. -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
  21. }
  22. #navigator-toolbox {
  23. -moz-appearance: none;
  24. background-color: transparent;
  25. border-top: none;
  26. }
  27. #main-window:not([disablechrome]) #navigator-toolbox[tabsontop=true] {
  28. border-bottom: 1px solid ThreeDShadow;
  29. }
  30. #navigator-toolbox[tabsontop=true] > toolbar:not(:-moz-lwtheme):not(#toolbar-menubar):not(#TabsToolbar),
  31. #navigator-toolbox[tabsontop=false] > toolbar:not(:-moz-lwtheme):not(#toolbar-menubar) {
  32. -moz-appearance: none;
  33. border-style: none;
  34. background-color: -moz-Dialog;
  35. }
  36. #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar) {
  37. padding-top: 1px;
  38. padding-bottom: 1px;
  39. }
  40. #nav-bar:not(:-moz-lwtheme),
  41. #nav-bar[collapsed=true] + toolbar:not(:-moz-lwtheme),
  42. #nav-bar[collapsed=true] + #customToolbars + #PersonalToolbar:not(:-moz-lwtheme),
  43. #nav-bar[tabsontop=true],
  44. #nav-bar[tabsontop=true][collapsed=true]:not([customizing]) + toolbar,
  45. #nav-bar[tabsontop=true][collapsed=true]:not([customizing]) + #customToolbars + #PersonalToolbar {
  46. background-image: linear-gradient(@toolbarHighlight@, rgba(255,255,255,0));
  47. }
  48. #nav-bar[tabsontop=true]:-moz-lwtheme,
  49. #nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme + toolbar,
  50. #nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme + #customToolbars + #PersonalToolbar {
  51. background-image: linear-gradient(rgba(255,255,255,.8), rgba(255,255,255,0));
  52. }
  53. #nav-bar[tabsontop=true]:-moz-lwtheme-brighttext,
  54. #nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme-brighttext + toolbar,
  55. #nav-bar[tabsontop=true][collapsed=true]:not([customizing]):-moz-lwtheme-brighttext + #customToolbars + #PersonalToolbar {
  56. background-image: linear-gradient(rgba(32,32,32,.8), rgba(32,32,32,0));
  57. }
  58. #personal-bookmarks {
  59. min-height: 29px;
  60. }
  61. #browser-bottombox {
  62. /* opaque for layers optimization */
  63. background-color: -moz-Dialog;
  64. }
  65. #urlbar:-moz-lwtheme:not([focused="true"]),
  66. .searchbar-textbox:-moz-lwtheme:not([focused="true"]) {
  67. opacity: .85;
  68. }
  69. /* Places toolbar */
  70. toolbarbutton.bookmark-item {
  71. margin: 0;
  72. padding: 2px 3px;
  73. }
  74. toolbarbutton.bookmark-item:hover:active,
  75. toolbarbutton.bookmark-item[open="true"] {
  76. padding-top: 3px;
  77. padding-bottom: 1px;
  78. padding-inline-start: 4px;
  79. padding-inline-end: 2px;
  80. }
  81. .bookmark-item > .toolbarbutton-icon {
  82. width: 16px;
  83. height: 16px;
  84. }
  85. /* Prevent [mode="icons"] from hiding the label */
  86. .bookmark-item > .toolbarbutton-text {
  87. display: -moz-box !important;
  88. }
  89. .bookmark-item > .toolbarbutton-menu-dropmarker {
  90. display: none;
  91. }
  92. /* Dropmarker for folder bookmarks */
  93. .bookmark-item[container] > .toolbarbutton-menu-dropmarker {
  94. display: -moz-box !important;
  95. }
  96. #wrapper-personal-bookmarks[place="palette"] > .toolbarpaletteitem-box {
  97. background: url("chrome://browser/skin/places/bookmarksToolbar.png") no-repeat center;
  98. }
  99. .bookmarks-toolbar-customize {
  100. max-width: 15em !important;
  101. list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;
  102. }
  103. /* Bookmark menus */
  104. menu.bookmark-item,
  105. menuitem.bookmark-item {
  106. min-width: 0;
  107. max-width: 32em;
  108. }
  109. .bookmark-item > .menu-iconic-left {
  110. margin-top: 0;
  111. margin-bottom: 0;
  112. }
  113. .bookmark-item > .menu-iconic-left > .menu-iconic-icon {
  114. padding-inline-start: 0px;
  115. }
  116. /* Bookmark drag and drop styles */
  117. .bookmark-item[dragover-into="true"] {
  118. background: Highlight !important;
  119. color: HighlightText !important;
  120. }
  121. /* rules for menupopup drop indicators */
  122. .menupopup-drop-indicator-bar {
  123. position: relative;
  124. /* these two margins must together compensate the indicator's height */
  125. margin-top: -1px;
  126. margin-bottom: -1px;
  127. }
  128. .menupopup-drop-indicator {
  129. list-style-image: none;
  130. height: 2px;
  131. margin-inline-end: -4em;
  132. background-color: Highlight;
  133. }
  134. /* Bookmarks toolbar */
  135. #PlacesToolbarDropIndicator {
  136. list-style-image: url(chrome://browser/skin/places/toolbarDropMarker.png);
  137. }
  138. /* Bookmark items */
  139. .bookmark-item {
  140. list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
  141. }
  142. .bookmark-item[container] {
  143. list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
  144. }
  145. .bookmark-item[container][livemark] {
  146. list-style-image: url("chrome://browser/skin/feeds/feedIcon16.png");
  147. }
  148. .bookmark-item[container][livemark] .bookmark-item {
  149. list-style-image: url("chrome://browser/skin/places/livemark-item.png");
  150. -moz-image-region: rect(0px, 16px, 16px, 0px);
  151. }
  152. .bookmark-item[container][livemark] .bookmark-item[visited] {
  153. -moz-image-region: rect(0px, 32px, 16px, 16px);
  154. }
  155. .bookmark-item[container][query] {
  156. list-style-image: url("chrome://browser/skin/places/query.png");
  157. }
  158. .bookmark-item[query][tagContainer] {
  159. list-style-image: url("chrome://browser/skin/places/tag.png");
  160. }
  161. .bookmark-item[query][dayContainer] {
  162. list-style-image: url("chrome://browser/skin/places/calendar.png");
  163. }
  164. .bookmark-item[query][hostContainer] {
  165. list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
  166. }
  167. .bookmark-item[query][hostContainer][open] {
  168. list-style-image: url("moz-icon://stock/gtk-directory?size=menu");
  169. }
  170. .bookmark-item[cutting] > .toolbarbutton-icon,
  171. .bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-icon {
  172. opacity: 0.5;
  173. }
  174. .bookmark-item[cutting] > .toolbarbutton-text,
  175. .bookmark-item[cutting] > .menu-iconic-left > .menu-iconic-text {
  176. opacity: 0.7;
  177. }
  178. /* Stock icons for the menu bar items */
  179. menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) {
  180. -moz-binding: url("chrome://global/content/bindings/menu.xml#menuitem-iconic");
  181. }
  182. #appmenu_newNavigator,
  183. #placesContext_open\:newwindow,
  184. #menu_newNavigator,
  185. #context-openlink,
  186. #context-openframe {
  187. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  188. -moz-image-region: rect(0px 80px 16px 64px);
  189. }
  190. #appmenu_newTab,
  191. #appmenu_newTab_popup,
  192. #placesContext_open\:newtab,
  193. #placesContext_openContainer\:tabs,
  194. #menu_newNavigatorTab,
  195. #context-openlinkintab,
  196. #context-openframeintab {
  197. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  198. -moz-image-region: rect(0px 64px 16px 48px);
  199. }
  200. #appmenu_openFile,
  201. #menu_openFile {
  202. list-style-image: url("moz-icon://stock/gtk-open?size=menu");
  203. }
  204. #menu_close {
  205. list-style-image: url("moz-icon://stock/gtk-close?size=menu");
  206. }
  207. #context-media-play {
  208. list-style-image: url("moz-icon://stock/gtk-media-play?size=menu");
  209. }
  210. #context-media-pause {
  211. list-style-image: url("moz-icon://stock/gtk-media-pause?size=menu");
  212. }
  213. #appmenu_savePage,
  214. #menu_savePage,
  215. #context-savelink,
  216. #context-saveimage,
  217. #context-savevideo,
  218. #context-saveaudio,
  219. #context-savepage,
  220. #context-saveframe {
  221. list-style-image: url("moz-icon://stock/gtk-save-as?size=menu");
  222. }
  223. #appmenu_printPreview,
  224. #menu_printPreview {
  225. list-style-image: url("moz-icon://stock/gtk-print-preview?size=menu");
  226. }
  227. #appmenu_print,
  228. #appmenu_print_popup,
  229. #menu_print,
  230. #context-printframe {
  231. list-style-image: url("moz-icon://stock/gtk-print?size=menu");
  232. }
  233. #appmenu-quit,
  234. #menu_FileQuitItem {
  235. list-style-image: url("moz-icon://stock/gtk-quit?size=menu");
  236. }
  237. #menu_undo,
  238. #context-undo {
  239. list-style-image: url("moz-icon://stock/gtk-undo?size=menu");
  240. }
  241. #menu_undo[disabled],
  242. #context-undo[disabled] {
  243. list-style-image: url("moz-icon://stock/gtk-undo?size=menu&state=disabled");
  244. }
  245. #menu_redo {
  246. list-style-image: url("moz-icon://stock/gtk-redo?size=menu");
  247. }
  248. #menu_redo[disabled] {
  249. list-style-image: url("moz-icon://stock/gtk-redo?size=menu&state=disabled");
  250. }
  251. #menu_cut,
  252. #placesContext_cut,
  253. #context-cut {
  254. list-style-image: url("moz-icon://stock/gtk-cut?size=menu");
  255. }
  256. #menu_cut[disabled],
  257. #placesContext_cut[disabled],
  258. #context-cut[disabled] {
  259. list-style-image: url("moz-icon://stock/gtk-cut?size=menu&state=disabled");
  260. }
  261. #menu_copy,
  262. #placesContext_copy,
  263. #context-copy,
  264. #context-copyimage,
  265. #context-copyvideourl,
  266. #context-copyaudiourl,
  267. #context-copylink,
  268. #context-copyemail {
  269. list-style-image: url("moz-icon://stock/gtk-copy?size=menu");
  270. }
  271. #menu_copy[disabled],
  272. #placesContext_copy[disabled],
  273. #context-copy[disabled] {
  274. list-style-image: url("moz-icon://stock/gtk-copy?size=menu&state=disabled");
  275. }
  276. #menu_paste,
  277. #placesContext_paste,
  278. #context-paste {
  279. list-style-image: url("moz-icon://stock/gtk-paste?size=menu");
  280. }
  281. #menu_paste[disabled],
  282. #placesContext_paste[disabled],
  283. #context-paste[disabled] {
  284. list-style-image: url("moz-icon://stock/gtk-paste?size=menu&state=disabled");
  285. }
  286. #menu_delete,
  287. #placesContext_delete,
  288. #placesContext_delete_history,
  289. #context-delete {
  290. list-style-image: url("moz-icon://stock/gtk-delete?size=menu");
  291. }
  292. #menu_delete[disabled],
  293. #placesContext_delete[disabled],
  294. #placesContext_delete_history[disabled],
  295. #context-delete[disabled] {
  296. list-style-image: url("moz-icon://stock/gtk-delete?size=menu&state=disabled");
  297. }
  298. #menu_selectAll,
  299. #context-selectall {
  300. list-style-image: url("moz-icon://stock/gtk-select-all?size=menu");
  301. }
  302. #appmenu_find,
  303. #menu_find {
  304. list-style-image: url("moz-icon://stock/gtk-find?size=menu");
  305. }
  306. #menu_find[disabled] {
  307. list-style-image: url("moz-icon://stock/gtk-find?size=menu&state=disabled");
  308. }
  309. #appmenu_customize,
  310. #appmenu_preferences,
  311. #menu_preferences {
  312. list-style-image: url("moz-icon://stock/gtk-preferences?size=menu");
  313. }
  314. #menu_stop,
  315. #context-stop {
  316. list-style-image: url("moz-icon://stock/gtk-stop?size=menu");
  317. }
  318. #menu_stop[disabled],
  319. #context-stop[disabled] {
  320. list-style-image: url("moz-icon://stock/gtk-stop?size=menu&state=disabled");
  321. }
  322. #menu_reload,
  323. #placesContext_reload,
  324. #context-reload,
  325. #context-reloadframe {
  326. list-style-image: url("moz-icon://stock/gtk-refresh?size=menu");
  327. }
  328. #menu_reload[disabled],
  329. #context-reload[disabled] {
  330. list-style-image: url("moz-icon://stock/gtk-refresh?size=menu&state=disabled");
  331. }
  332. #menu_zoomEnlarge {
  333. list-style-image: url("moz-icon://stock/gtk-zoom-in?size=menu");
  334. }
  335. #menu_zoomReduce {
  336. list-style-image: url("moz-icon://stock/gtk-zoom-out?size=menu");
  337. }
  338. #menu_zoomReset {
  339. list-style-image: url("moz-icon://stock/gtk-zoom-100?size=menu");
  340. }
  341. #historyMenuBack,
  342. #context-back {
  343. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=menu");
  344. }
  345. #historyMenuBack[disabled],
  346. #context-back[disabled] {
  347. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=menu&state=disabled");
  348. }
  349. #historyMenuBack:-moz-locale-dir(rtl),
  350. #context-back:-moz-locale-dir(rtl) {
  351. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=menu");
  352. }
  353. #historyMenuBack[disabled]:-moz-locale-dir(rtl),
  354. #context-back[disabled]:-moz-locale-dir(rtl) {
  355. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=menu&state=disabled");
  356. }
  357. #historyMenuForward,
  358. #context-forward {
  359. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=menu");
  360. }
  361. #historyMenuForward[disabled],
  362. #context-forward[disabled] {
  363. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=menu&state=disabled");
  364. }
  365. #historyMenuForward:-moz-locale-dir(rtl),
  366. #context-forward:-moz-locale-dir(rtl) {
  367. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=menu");
  368. }
  369. #historyMenuForward[disabled]:-moz-locale-dir(rtl),
  370. #context-forward[disabled]:-moz-locale-dir(rtl) {
  371. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=menu&state=disabled");
  372. }
  373. #historyMenuHome {
  374. list-style-image: url("moz-icon://stock/gtk-home?size=menu");
  375. }
  376. #appmenu_history,
  377. #appmenu_showAllHistory,
  378. #menu_showAllHistory,
  379. #HMB_showAllHistory {
  380. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  381. -moz-image-region: rect(0px 32px 16px 16px);
  382. }
  383. #appmenu_bookmarks,
  384. #appmenu_showAllBookmarks,
  385. #bookmarksShowAll,
  386. #BMB_bookmarksShowAll {
  387. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  388. -moz-image-region: rect(0px 48px 16px 32px);
  389. }
  390. #appmenu_subscribeToPage:not([disabled]),
  391. #appmenu_subscribeToPageMenu,
  392. #subscribeToPageMenuitem:not([disabled]),
  393. #subscribeToPageMenupopup,
  394. #BMB_subscribeToPageMenuitem:not([disabled]),
  395. #BMB_subscribeToPageMenupopup {
  396. list-style-image: url("chrome://browser/skin/page-livemarks.png");
  397. }
  398. #appmenu_bookmarksToolbar,
  399. #bookmarksToolbarFolderMenu,
  400. #BMB_bookmarksToolbar {
  401. list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png");
  402. }
  403. #appmenu_bookmarkThisPage,
  404. #menu_bookmarkThisPage,
  405. #BMB_bookmarkThisPage {
  406. list-style-image: url("chrome://browser/skin/places/starPage.png");
  407. }
  408. #appmenu_unsortedBookmarks,
  409. #menu_unsortedBookmarks,
  410. #BMB_unsortedBookmarks {
  411. list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png");
  412. }
  413. #appmenu_downloads,
  414. #menu_openDownloads {
  415. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  416. -moz-image-region: rect(0px 16px 16px 0px);
  417. }
  418. #appmenu_addons,
  419. #menu_openAddons {
  420. list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric-16.png");
  421. }
  422. #menu_pageInfo,
  423. #context-viewinfo,
  424. #context-viewframeinfo {
  425. list-style-image: url("moz-icon://stock/gtk-info?size=menu");
  426. }
  427. #appmenu_privateBrowsing,
  428. #appmenu_newPrivateWindow,
  429. #placesContext_open\:newprivatewindow,
  430. #privateBrowsingItem {
  431. list-style-image: url("chrome://browser/skin/Privacy-16.png");
  432. }
  433. #placesContext_show\:info {
  434. list-style-image: url("moz-icon://stock/gtk-properties?size=menu");
  435. }
  436. #appmenu_sanitizeHistory,
  437. #sanitizeItem,
  438. #HMB_sanitizeItem {
  439. list-style-image: url("moz-icon://stock/gtk-clear?size=menu");
  440. }
  441. #appmenu_help,
  442. #appmenu_openHelp,
  443. #menu_openHelp {
  444. list-style-image: url("moz-icon://stock/gtk-help?size=menu");
  445. }
  446. #appmenu_about,
  447. #aboutName {
  448. list-style-image: url("moz-icon://stock/gtk-about?size=menu");
  449. }
  450. #javascriptConsole {
  451. list-style-image: url("chrome://global/skin/console/console.png");
  452. }
  453. /* Primary toolbar buttons */
  454. .toolbarbutton-1:not([type="menu-button"]) {
  455. -moz-box-orient: vertical;
  456. min-width: 0;
  457. list-style-image: url("chrome://browser/skin/Toolbar.png");
  458. }
  459. .toolbarbutton-1 > .toolbarbutton-icon {
  460. margin-inline-end: 0;
  461. }
  462. toolbar[mode="full"] .toolbarbutton-1:not([type="menu-button"]),
  463. toolbar[mode="full"] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  464. min-width: 57px;
  465. }
  466. .toolbarbutton-1:not([type="menu-button"]),
  467. .toolbarbutton-1 > .toolbarbutton-menubutton-button {
  468. padding: 5px;
  469. }
  470. .toolbarbutton-1[checked="true"] {
  471. padding: 5px !important;
  472. }
  473. /* 24px primary toolbar buttons */
  474. #back-button {
  475. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=toolbar");
  476. }
  477. #back-button[disabled="true"] {
  478. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=toolbar&state=disabled");
  479. }
  480. #back-button:-moz-locale-dir(rtl) {
  481. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=toolbar");
  482. }
  483. #back-button[disabled="true"]:-moz-locale-dir(rtl) {
  484. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=toolbar&state=disabled");
  485. }
  486. #forward-button/*,
  487. @conditionalForwardWithUrlbar@ > #forward-button */{
  488. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=toolbar");
  489. }
  490. #forward-button:-moz-locale-dir(rtl)/*,
  491. @conditionalForwardWithUrlbar@ > #forward-button:-moz-locale-dir(rtl) */{
  492. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=toolbar");
  493. }
  494. #forward-button[disabled] {
  495. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=toolbar&state=disabled");
  496. }
  497. #forward-button[disabled]:-moz-locale-dir(rtl) {
  498. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=toolbar&state=disabled");
  499. }
  500. /*@conditionalForwardWithUrlbar@:not([switchingtabs]) > #forward-button {
  501. transition: @forwardTransitionLength@ ease-out;
  502. }
  503. @conditionalForwardWithUrlbar@ > #forward-button[disabled] {
  504. transform: scale(0);
  505. opacity: 0;
  506. pointer-events: none;
  507. }*/
  508. #reload-button {
  509. list-style-image: url("moz-icon://stock/gtk-refresh?size=toolbar");
  510. }
  511. #reload-button[disabled="true"] {
  512. list-style-image: url("moz-icon://stock/gtk-refresh?size=toolbar&state=disabled");
  513. }
  514. #stop-button {
  515. list-style-image: url("moz-icon://stock/gtk-stop?size=toolbar");
  516. }
  517. #stop-button[disabled="true"] {
  518. list-style-image: url("moz-icon://stock/gtk-stop?size=toolbar&state=disabled");
  519. }
  520. #home-button {
  521. list-style-image: url("moz-icon://stock/gtk-home?size=toolbar");
  522. }
  523. #home-button[disabled="true"] {
  524. list-style-image: url("moz-icon://stock/gtk-home?size=toolbar&state=disabled");
  525. }
  526. #downloads-button {
  527. -moz-image-region: rect(0px 24px 24px 0px);
  528. }
  529. #history-button,
  530. #history-menu-button {
  531. -moz-image-region: rect(0px 48px 24px 24px);
  532. }
  533. #history-menu-button.toolbarbutton-1 {
  534. -moz-box-orient: horizontal;
  535. }
  536. #bookmarks-button,
  537. #bookmarks-menu-button {
  538. -moz-image-region: rect(0px 72px 24px 48px);
  539. }
  540. #bookmarks-menu-button.bookmark-item {
  541. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  542. }
  543. #bookmarks-menu-button.toolbarbutton-1 {
  544. -moz-box-orient: horizontal;
  545. }
  546. #print-button {
  547. list-style-image: url("moz-icon://stock/gtk-print?size=toolbar");
  548. }
  549. #print-button[disabled="true"] {
  550. list-style-image: url("moz-icon://stock/gtk-print?size=toolbar&state=disabled");
  551. }
  552. #new-tab-button {
  553. -moz-image-region: rect(0px 96px 24px 72px);
  554. }
  555. #new-window-button {
  556. -moz-image-region: rect(0px 120px 24px 96px);
  557. }
  558. #cut-button {
  559. list-style-image: url("moz-icon://stock/gtk-cut?size=toolbar");
  560. }
  561. #cut-button[disabled="true"] {
  562. list-style-image: url("moz-icon://stock/gtk-cut?size=toolbar&state=disabled");
  563. }
  564. #copy-button {
  565. list-style-image: url("moz-icon://stock/gtk-copy?size=toolbar");
  566. }
  567. #copy-button[disabled="true"] {
  568. list-style-image: url("moz-icon://stock/gtk-copy?size=toolbar&state=disabled");
  569. }
  570. #paste-button {
  571. list-style-image: url("moz-icon://stock/gtk-paste?size=toolbar");
  572. }
  573. #paste-button[disabled="true"] {
  574. list-style-image: url("moz-icon://stock/gtk-paste?size=toolbar&state=disabled");
  575. }
  576. #fullscreen-button {
  577. list-style-image: url("moz-icon://stock/gtk-fullscreen?size=toolbar");
  578. }
  579. #zoom-out-button {
  580. list-style-image: url("moz-icon://stock/gtk-zoom-out?size=toolbar");
  581. }
  582. #zoom-in-button {
  583. list-style-image: url("moz-icon://stock/gtk-zoom-in?size=toolbar");
  584. }
  585. #sync-button {
  586. -moz-image-region: rect(0px 144px 24px 120px);
  587. }
  588. #sync-button[status="active"] {
  589. list-style-image: url("chrome://browser/skin/sync-24-throbber.png");
  590. -moz-image-region: rect(0px 24px 24px 0px);
  591. }
  592. #feed-button {
  593. -moz-image-region: rect(0px 168px 24px 144px);
  594. }
  595. #feed-button[disabled] > .toolbarbutton-icon {
  596. opacity: .4;
  597. }
  598. %ifdef MOZ_WEBRTC
  599. #webrtc-status-button {
  600. -moz-image-region: rect(0px 192px 24px 168px);
  601. }
  602. %endif
  603. /* 16px primary toolbar buttons */
  604. toolbar[iconsize="small"] .toolbarbutton-1:not([type="menu-button"]) {
  605. -moz-box-orient: vertical;
  606. min-width: 0;
  607. list-style-image: url("chrome://browser/skin/Toolbar-small.png");
  608. }
  609. toolbar[iconsize="small"] .toolbarbutton-1[type="menu-button"] {
  610. border: 0 !important;
  611. }
  612. toolbar[iconsize="small"] #back-button {
  613. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=menu");
  614. }
  615. .unified-nav-back[_moz-menuactive] {
  616. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=menu") !important;
  617. }
  618. toolbar[iconsize="small"] #back-button[disabled="true"] {
  619. list-style-image: url("moz-icon://stock/gtk-go-back-ltr?size=menu&state=disabled");
  620. }
  621. toolbar[iconsize="small"] #back-button:-moz-locale-dir(rtl) {
  622. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=menu");
  623. }
  624. .unified-nav-back[_moz-menuactive]:-moz-locale-dir(rtl) {
  625. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=menu") !important;
  626. }
  627. toolbar[iconsize="small"] #back-button[disabled="true"]:-moz-locale-dir(rtl) {
  628. list-style-image: url("moz-icon://stock/gtk-go-back-rtl?size=menu&state=disabled");
  629. }
  630. toolbar[iconsize=small] #forward-button,
  631. @conditionalForwardWithUrlbar_small@ > #forward-button {
  632. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=menu");
  633. }
  634. .unified-nav-forward[_moz-menuactive] {
  635. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=menu") !important;
  636. }
  637. toolbar[iconsize=small] #forward-button[disabled] {
  638. list-style-image: url("moz-icon://stock/gtk-go-forward-ltr?size=menu&state=disabled");
  639. }
  640. toolbar[iconsize=small] #forward-button:-moz-locale-dir(rtl),
  641. @conditionalForwardWithUrlbar_small@ > #forward-button:-moz-locale-dir(rtl) {
  642. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=menu");
  643. }
  644. .unified-nav-forward[_moz-menuactive]:-moz-locale-dir(rtl) {
  645. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=menu") !important;
  646. }
  647. toolbar[iconsize=small] #forward-button[disabled]:-moz-locale-dir(rtl) {
  648. list-style-image: url("moz-icon://stock/gtk-go-forward-rtl?size=menu&state=disabled");
  649. }
  650. toolbar[iconsize="small"] #stop-button {
  651. list-style-image: url("moz-icon://stock/gtk-stop?size=menu");
  652. }
  653. toolbar[iconsize="small"] #stop-button[disabled="true"] {
  654. list-style-image: url("moz-icon://stock/gtk-stop?size=menu&state=disabled");
  655. }
  656. toolbar[iconsize="small"] #reload-button {
  657. list-style-image: url("moz-icon://stock/gtk-refresh?size=menu");
  658. }
  659. toolbar[iconsize="small"] #reload-button[disabled="true"] {
  660. list-style-image: url("moz-icon://stock/gtk-refresh?size=menu&state=disabled");
  661. }
  662. toolbar[iconsize="small"] #home-button,
  663. #home-button.bookmark-item {
  664. list-style-image: url("moz-icon://stock/gtk-home?size=menu");
  665. }
  666. toolbar[iconsize="small"] #home-button[disabled="true"],
  667. #home-button.bookmark-item[disabled="true"] {
  668. list-style-image: url("moz-icon://stock/gtk-home?size=menu&state=disabled");
  669. }
  670. toolbar[iconsize="small"] #downloads-button {
  671. -moz-image-region: rect(0px 16px 16px 0px);
  672. }
  673. %ifdef MOZ_WEBRTC
  674. toolbar[iconsize="small"] #webrtc-status-button /* temporary placeholder (bug 824825) */,
  675. %endif
  676. toolbar[iconsize="small"] #history-button,
  677. toolbar[iconsize="small"] #history-menu-button {
  678. -moz-image-region: rect(0px 32px 16px 16px);
  679. }
  680. toolbar[iconsize="small"] #bookmarks-button,
  681. toolbar[iconsize="small"] #bookmarks-menu-button,
  682. #bookmarks-menu-button.bookmark-item {
  683. -moz-image-region: rect(0px 48px 16px 32px);
  684. }
  685. toolbar[iconsize="small"] #print-button {
  686. list-style-image: url("moz-icon://stock/gtk-print?size=menu");
  687. }
  688. toolbar[iconsize="small"] #print-button[disabled="true"] {
  689. list-style-image: url("moz-icon://stock/gtk-print?size=menu&state=disabled");
  690. }
  691. toolbar[iconsize="small"] #new-tab-button {
  692. -moz-image-region: rect(0px 64px 16px 48px);
  693. }
  694. toolbar[iconsize="small"] #new-window-button {
  695. -moz-image-region: rect(0px 80px 16px 64px);
  696. }
  697. toolbar[iconsize="small"] #cut-button {
  698. list-style-image: url("moz-icon://stock/gtk-cut?size=menu");
  699. }
  700. toolbar[iconsize="small"] #cut-button[disabled="true"] {
  701. list-style-image: url("moz-icon://stock/gtk-cut?size=menu&state=disabled");
  702. }
  703. toolbar[iconsize="small"] #copy-button {
  704. list-style-image: url("moz-icon://stock/gtk-copy?size=menu");
  705. }
  706. toolbar[iconsize="small"] #copy-button[disabled="true"] {
  707. list-style-image: url("moz-icon://stock/gtk-copy?size=menu&state=disabled");
  708. }
  709. toolbar[iconsize="small"] #paste-button {
  710. list-style-image: url("moz-icon://stock/gtk-paste?size=menu");
  711. }
  712. toolbar[iconsize="small"] #paste-button[disabled="true"] {
  713. list-style-image: url("moz-icon://stock/gtk-paste?size=menu&state=disabled");
  714. }
  715. toolbar[iconsize="small"] #fullscreen-button {
  716. list-style-image: url("moz-icon://stock/gtk-fullscreen?size=menu");
  717. }
  718. toolbar[iconsize="small"] #zoom-out-button {
  719. list-style-image: url("moz-icon://stock/gtk-zoom-out?size=menu");
  720. }
  721. toolbar[iconsize="small"] #zoom-in-button {
  722. list-style-image: url("moz-icon://stock/gtk-zoom-in?size=menu");
  723. }
  724. toolbar[iconsize="small"] #sync-button {
  725. -moz-image-region: rect(0px 96px 16px 80px);
  726. }
  727. toolbar[iconsize="small"] #sync-button[status="active"] {
  728. list-style-image: url("chrome://browser/skin/sync-16-throbber.png");
  729. -moz-image-region: rect(0px 16px 16px 0px);
  730. }
  731. toolbar[iconsize="small"] #feed-button {
  732. -moz-image-region: rect(0px 112px 16px 96px);
  733. }
  734. %ifdef MOZ_WEBRTC
  735. toolbar[iconsize="small"] #webrtc-status-button {
  736. -moz-image-region: rect(0px 128px 16px 112px);
  737. }
  738. %endif
  739. /* Fullscreen window controls */
  740. #window-controls {
  741. -moz-box-align: start;
  742. margin-inline-start: 10px;
  743. }
  744. #minimize-button {
  745. list-style-image: url("chrome://global/skin/icons/Minimize.gif");
  746. }
  747. #restore-button {
  748. list-style-image: url("chrome://global/skin/icons/Restore.gif");
  749. }
  750. #close-button {
  751. list-style-image: url("chrome://global/skin/icons/Close.gif");
  752. }
  753. /* Location bar */
  754. #urlbar {
  755. width: 7em;
  756. -moz-appearance: textfield;
  757. padding: 0;
  758. }
  759. .urlbar-textbox-container {
  760. -moz-appearance: none;
  761. -moz-box-align: stretch;
  762. }
  763. .urlbar-input-box {
  764. margin-inline-start: 0;
  765. min-width: 4em;
  766. }
  767. .urlbar-history-dropmarker {
  768. -moz-appearance: toolbarbutton-dropdown;
  769. }
  770. #urlbar-container {
  771. -moz-box-orient: horizontal;
  772. -moz-box-align: stretch;
  773. }
  774. #urlbar-icons {
  775. -moz-box-align: center;
  776. }
  777. .urlbar-icon {
  778. cursor: pointer;
  779. padding: 0 3px;
  780. }
  781. #urlbar-search-splitter {
  782. -moz-appearance: none;
  783. width: 8px;
  784. margin-inline-start: -4px;
  785. }
  786. #urlbar-search-splitter + #urlbar-container > #urlbar ,
  787. #urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox {
  788. margin-inline-start: 0;
  789. }
  790. #urlbar-display-box {
  791. margin-top: -1px;
  792. margin-bottom: -1px;
  793. border-inline-end: 1px solid #AAA;
  794. margin-inline-end: 3px;
  795. }
  796. #urlbar-display {
  797. margin-top: 0;
  798. margin-bottom: 0;
  799. margin-inline-start: 0;
  800. color: GrayText;
  801. }
  802. /* Favicon */
  803. #page-proxy-favicon {
  804. width: 16px;
  805. height: 16px;
  806. margin-top: 2px;
  807. margin-bottom: 2px;
  808. margin-inline-start: 4px;
  809. margin-inline-end: 3px;
  810. list-style-image: url(chrome://browser/skin/identity-icons-generic.png);
  811. -moz-image-region: rect(0, 16px, 16px, 0);
  812. }
  813. /* Since we already have a padlock, always use the generic icon until the favicon loads
  814. .verifiedDomain > #page-proxy-favicon[pageproxystate="valid"] {
  815. list-style-image: url(chrome://browser/skin/identity-icons-https.png);
  816. }
  817. .verifiedIdentity > #page-proxy-favicon[pageproxystate="valid"] {
  818. list-style-image: url(chrome://browser/skin/identity-icons-https-ev.png);
  819. }
  820. .mixedActiveContent > #page-proxy-favicon[pageproxystate="valid"] {
  821. list-style-image: url(chrome://browser/skin/identity-icons-https-mixed-active.png);
  822. }
  823. */
  824. #identity-box:hover > #page-proxy-favicon {
  825. -moz-image-region: rect(0, 32px, 16px, 16px);
  826. }
  827. #identity-box:hover:active > #page-proxy-favicon,
  828. #identity-box[open=true] > #page-proxy-favicon {
  829. -moz-image-region: rect(0, 48px, 16px, 32px);
  830. }
  831. #page-proxy-favicon[pageproxystate="invalid"] {
  832. opacity: 0.3;
  833. }
  834. /* Identity indicator */
  835. #identity-box {
  836. padding: 1px;
  837. margin: -1px;
  838. margin-inline-end: 0;
  839. font-size: .9em;
  840. }
  841. #identity-box:-moz-locale-dir(ltr) {
  842. border-top-left-radius: 2.5px;
  843. border-bottom-left-radius: 2.5px;
  844. }
  845. #identity-box:-moz-locale-dir(rtl) {
  846. border-top-right-radius: 2.5px;
  847. border-bottom-right-radius: 2.5px;
  848. }
  849. #identity-box:-moz-focusring {
  850. outline: 1px dotted #000;
  851. outline-offset: -3px;
  852. }
  853. #identity-icon-labels {
  854. padding-inline-start: 2px;
  855. padding-inline-end: 5px;
  856. }
  857. #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity {
  858. color: rgb(95,127,67);
  859. margin-inline-end: 4px;
  860. background-image: linear-gradient(rgba(226,246,208,1),
  861. rgba(203,235,177,1));
  862. background-position: right;
  863. background-repeat: no-repeat;
  864. }
  865. #urlbar[pageproxystate="valid"] > #identity-box.verifiedDomain {
  866. color: rgb(51,87,137);
  867. margin-inline-end: 4px;
  868. background-image: linear-gradient(rgba(220,231,245,1),
  869. rgba(207,221,242,1));
  870. background-position: right;
  871. background-repeat: no-repeat;
  872. }
  873. #urlbar[pageproxystate="valid"] > #identity-box.mixedContent {
  874. color: rgb(79,79,0);
  875. margin-inline-end: 4px;
  876. background-image: linear-gradient(rgba(245,245,220,1),
  877. rgba(242,242,207,1));
  878. background-position: right;
  879. background-repeat: no-repeat;
  880. }
  881. #identity-box.verifiedIdentity:-moz-locale-dir(rtl) {
  882. background-position: left;
  883. }
  884. /* Address bar shading for SSL */
  885. #urlbar[https_color="all"][security_level="broken"],
  886. #urlbar[https_color="all"][security_level="low"] {
  887. box-shadow: inset 0 0 4px rgb(168,0,0);
  888. }
  889. #urlbar[https_color="all"][security_level="mixed"],
  890. #urlbar[https_color="secure-mixed"][security_level="mixed"] {
  891. box-shadow: inset 0 0 4px rgb(168,79,0);
  892. }
  893. #urlbar[https_color="all"][security_level="high"],
  894. #urlbar[https_color="secure-mixed"][security_level="high"],
  895. #urlbar[https_color="secure-only"][security_level="high"] {
  896. box-shadow: inset 0 0 4px rgb(0,79,168);
  897. }
  898. #urlbar[https_color="all"][security_level="ev"],
  899. #urlbar[https_color="secure-mixed"][security_level="ev"],
  900. #urlbar[https_color="secure-only"][security_level="ev"] {
  901. box-shadow: inset 0 0 4px rgb(0,168,0);
  902. }
  903. #urlbar[https_color="all"]:-moz-lwtheme-darktext,
  904. #urlbar[https_color="secure-mixed"]:-moz-lwtheme-darktext,
  905. #urlbar[https_color="secure-only"]:-moz-lwtheme-darktext {
  906. box-shadow: inset 0 0 2px;
  907. }
  908. /* Identity popup icons */
  909. #identity-popup-icon {
  910. height: 64px;
  911. width: 64px;
  912. padding: 0;
  913. list-style-image: url("chrome://browser/skin/identity.png");
  914. -moz-image-region: rect(0px, 64px, 64px, 0px);
  915. }
  916. #identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon {
  917. -moz-image-region: rect(64px, 64px, 128px, 0px);
  918. }
  919. #identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon {
  920. -moz-image-region: rect(128px, 64px, 192px, 0px);
  921. }
  922. /* Identity popup body text */
  923. .identity-popup-description {
  924. white-space: pre-wrap;
  925. padding-inline-start: 15px;
  926. margin: 2px 0 4px;
  927. }
  928. .identity-popup-label {
  929. white-space: pre-wrap;
  930. padding-inline-start: 15px;
  931. margin: 0;
  932. }
  933. #identity-popup-content-host ,
  934. #identity-popup-content-owner {
  935. font-weight: bold;
  936. max-width: 300px;
  937. }
  938. #identity-popup-content-host ,
  939. #identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner {
  940. font-size: 140%;
  941. }
  942. #identity-popup-content-owner {
  943. margin-bottom: 0 !important;
  944. }
  945. #identity-popup-content-verifier {
  946. margin: 4px 0 2px;
  947. }
  948. #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption ,
  949. #identity-popup-content-box.verifiedDomain > #identity-popup-encryption {
  950. margin-top: 10px;
  951. margin-inline-start: -18px;
  952. }
  953. #identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon ,
  954. #identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon {
  955. list-style-image: url("chrome://browser/skin/Secure.png");
  956. }
  957. /* Identity popup bounding box */
  958. #identity-popup-container {
  959. min-width: 280px;
  960. }
  961. /* Notification popup */
  962. #notification-popup {
  963. min-width: 280px;
  964. }
  965. .popup-notification-icon {
  966. width: 64px;
  967. height: 64px;
  968. margin-inline-end: 10px;
  969. }
  970. .popup-notification-icon[popupid="geolocation"] {
  971. list-style-image: url(chrome://browser/skin/Geolocation-64.png);
  972. }
  973. .popup-notification-icon[popupid="push"] {
  974. list-style-image: url(chrome://browser/skin/Push-64.png);
  975. }
  976. .popup-notification-icon[popupid="xpinstall-disabled"],
  977. .popup-notification-icon[popupid="addon-progress"],
  978. .popup-notification-icon[popupid="addon-install-cancelled"],
  979. .popup-notification-icon[popupid="addon-install-blocked"],
  980. .popup-notification-icon[popupid="addon-install-origin-blocked"],
  981. .popup-notification-icon[popupid="addon-install-failed"],
  982. .popup-notification-icon[popupid="addon-install-complete"] {
  983. list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png);
  984. width: 32px;
  985. height: 32px;
  986. }
  987. .popup-notification-icon[popupid="click-to-play-plugins"] {
  988. list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png);
  989. }
  990. .popup-notification-icon[popupid="web-notifications"] {
  991. list-style-image: url(chrome://browser/skin/notification-64.png);
  992. }
  993. .addon-progress-description {
  994. width: 350px;
  995. max-width: 350px;
  996. }
  997. .popup-progress-label,
  998. .popup-progress-meter {
  999. margin-inline-start: 0;
  1000. margin-inline-end: 0;
  1001. }
  1002. .popup-progress-cancel {
  1003. -moz-appearance: none;
  1004. background: transparent;
  1005. border: none;
  1006. padding: 0;
  1007. margin: 0;
  1008. margin-inline-start: 5px;
  1009. min-height: 0;
  1010. min-width: 0;
  1011. list-style-image: url("moz-icon://stock/gtk-cancel?size=menu");
  1012. }
  1013. .popup-notification-icon[popupid="indexedDB-permissions-prompt"],
  1014. .popup-notification-icon[popupid="indexedDB-quota-prompt"],
  1015. .popup-notification-icon[popupid*="offline-app-requested"],
  1016. .popup-notification-icon[popupid="offline-app-usage"] {
  1017. list-style-image: url(chrome://global/skin/icons/question-64.png);
  1018. }
  1019. .popup-notification-icon[popupid="password"] {
  1020. list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png);
  1021. }
  1022. .popup-notification-icon[popupid="mixed-content-blocked"] {
  1023. list-style-image: url(chrome://browser/skin/mixed-content-blocked-64.png);
  1024. }
  1025. %ifdef MOZ_WEBRTC
  1026. .popup-notification-icon[popupid="webRTC-sharingDevices"],
  1027. .popup-notification-icon[popupid="webRTC-shareDevices"] {
  1028. list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png);
  1029. }
  1030. %endif
  1031. .popup-notification-icon[popupid="pointerLock"] {
  1032. list-style-image: url(chrome://browser/skin/pointerLock-64.png);
  1033. }
  1034. /* Notification icon box */
  1035. #notification-popup-box {
  1036. position: relative;
  1037. background-color: #fff;
  1038. background-clip: padding-box;
  1039. padding-left: 4px;
  1040. border-radius: 2.5px 0 0 2.5px;
  1041. border-width: 0 8px 0 0;
  1042. border-style: solid;
  1043. border-image: url("chrome://browser/skin/urlbar-arrow.png") 0 8 0 0 fill;
  1044. margin-inline-end: -8px;
  1045. margin-top: -1px;
  1046. margin-bottom: -1px;
  1047. }
  1048. #notification-popup-box:not([hidden]) + #identity-box {
  1049. padding-inline-start: 10px;
  1050. border-radius: 0;
  1051. }
  1052. #notification-popup-box:-moz-locale-dir(rtl),
  1053. .notification-anchor-icon:-moz-locale-dir(rtl) {
  1054. transform: scaleX(-1);
  1055. }
  1056. .notification-anchor-icon {
  1057. width: 16px;
  1058. height: 16px;
  1059. margin: 0 2px;
  1060. }
  1061. .notification-anchor-icon:-moz-focusring {
  1062. outline: 1px dotted -moz-DialogText;
  1063. }
  1064. .default-notification-icon,
  1065. #default-notification-icon {
  1066. list-style-image: url(chrome://global/skin/icons/information-16.png);
  1067. }
  1068. .geo-notification-icon,
  1069. #geo-notification-icon {
  1070. list-style-image: url(chrome://browser/skin/Geolocation-16.png);
  1071. }
  1072. #addons-notification-icon {
  1073. list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png);
  1074. }
  1075. .indexedDB-notification-icon,
  1076. #indexedDB-notification-icon {
  1077. list-style-image: url(chrome://global/skin/icons/question-16.png);
  1078. }
  1079. #password-notification-icon {
  1080. list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
  1081. }
  1082. #plugins-notification-icon {
  1083. list-style-image: url(chrome://browser/skin/notification-pluginNormal.png);
  1084. }
  1085. #alert-plugins-notification-icon {
  1086. list-style-image: url(chrome://browser/skin/notification-pluginAlert.png);
  1087. }
  1088. #blocked-plugins-notification-icon {
  1089. list-style-image: url(chrome://browser/skin/notification-pluginBlocked.png);
  1090. }
  1091. #plugins-notification-icon,
  1092. #alert-plugins-notification-icon,
  1093. #blocked-plugins-notification-icon {
  1094. -moz-image-region: rect(0, 16px, 16px, 0);
  1095. }
  1096. #plugins-notification-icon:hover,
  1097. #alert-plugins-notification-icon:hover,
  1098. #blocked-plugins-notification-icon:hover {
  1099. -moz-image-region: rect(0, 32px, 16px, 16px);
  1100. }
  1101. #plugins-notification-icon:active,
  1102. #alert-plugins-notification-icon:active,
  1103. #blocked-plugins-notification-icon:active {
  1104. -moz-image-region: rect(0, 48px, 16px, 32px);
  1105. }
  1106. #notification-popup-box[hidden] {
  1107. /* Override display:none to make the pluginBlockedNotification animation work
  1108. when showing the notification repeatedly. */
  1109. display: -moz-box;
  1110. visibility: collapse;
  1111. }
  1112. #blocked-plugins-notification-icon[showing] {
  1113. animation: pluginBlockedNotification 500ms ease 0s 5 alternate both;
  1114. }
  1115. @keyframes pluginBlockedNotification {
  1116. from {
  1117. opacity: 0;
  1118. }
  1119. to {
  1120. opacity: 1;
  1121. }
  1122. }
  1123. .mixed-content-blocked-notification-icon,
  1124. #mixed-content-blocked-notification-icon {
  1125. list-style-image: url(chrome://browser/skin/mixed-content-blocked-16.png);
  1126. }
  1127. %ifdef MOZ_WEBRTC
  1128. .webRTC-shareDevices-notification-icon,
  1129. #webRTC-shareDevices-notification-icon {
  1130. list-style-image: url(chrome://browser/skin/webRTC-shareDevice-16.png);
  1131. }
  1132. .webRTC-sharingDevices-notification-icon,
  1133. #webRTC-sharingDevices-notification-icon {
  1134. list-style-image: url(chrome://browser/skin/webRTC-sharingDevice-16.png);
  1135. }
  1136. %endif
  1137. .web-notifications-notification-icon,
  1138. #web-notifications-notification-icon {
  1139. list-style-image: url(chrome://browser/skin/web-notifications-tray.svg);
  1140. -moz-image-region: rect(0, 16px, 16px, 0);
  1141. }
  1142. .web-notifications-notification-icon:hover,
  1143. #web-notifications-notification-icon:hover {
  1144. -moz-image-region: rect(0, 32px, 16px, 16px);
  1145. }
  1146. .web-notifications-notification-icon:hover:active,
  1147. #web-notifications-notification-icon:hover:active {
  1148. -moz-image-region: rect(0, 48px, 16px, 32px);
  1149. }
  1150. #pointerLock-notification-icon {
  1151. list-style-image: url(chrome://browser/skin/pointerLock-16.png);
  1152. }
  1153. #pointerLock-cancel {
  1154. margin: 0px;
  1155. }
  1156. /* Pale Moon: Feed icon */
  1157. #ub-feed-button,
  1158. #ub-feed-button > .button-box,
  1159. #ub-feed-button:hover:active > .button-box {
  1160. padding: 0px;
  1161. margin: 0px;
  1162. border: 0px;
  1163. background-color: transparent !important;
  1164. }
  1165. #ub-feed-button {
  1166. -moz-appearance: none;
  1167. min-width: 0px;
  1168. margin-right: 1px !important;
  1169. list-style-image: url("chrome://browser/skin/page-livemarks.png");
  1170. }
  1171. #treecolAutoCompleteImage {
  1172. max-width : 36px;
  1173. }
  1174. .ac-result-type-bookmark,
  1175. .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) {
  1176. list-style-image: url("chrome://browser/skin/places/star-icons.png");
  1177. -moz-image-region: rect(0px 32px 16px 16px);
  1178. width: 16px;
  1179. height: 16px;
  1180. }
  1181. .ac-result-type-keyword,
  1182. .autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) {
  1183. list-style-image: url(moz-icon://stock/gtk-find?size=menu);
  1184. width: 16px;
  1185. height: 16px;
  1186. }
  1187. .ac-result-type-tag,
  1188. .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) {
  1189. list-style-image: url("chrome://browser/skin/places/tag.png");
  1190. width: 16px;
  1191. height: 16px;
  1192. }
  1193. .ac-comment {
  1194. font-size: 1.05em;
  1195. }
  1196. .ac-extra > .ac-comment {
  1197. font-size: inherit;
  1198. }
  1199. .ac-url-text,
  1200. .ac-action-text {
  1201. color: -moz-nativehyperlinktext;
  1202. font-size: 0.9em;
  1203. }
  1204. richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-icon {
  1205. list-style-image: url("chrome://browser/skin/actionicon-tab.png");
  1206. padding: 0 3px;
  1207. }
  1208. .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) {
  1209. color: GrayText;
  1210. }
  1211. .ac-comment[selected="true"],
  1212. .ac-url-text[selected="true"],
  1213. .ac-action-text[selected="true"] {
  1214. color: inherit !important;
  1215. }
  1216. .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment),
  1217. .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) {
  1218. color: GrayText;
  1219. font-size: smaller;
  1220. }
  1221. .autocomplete-treebody::-moz-tree-cell(suggesthint) {
  1222. border-top: 1px solid GrayText;
  1223. }
  1224. /* Combined go/reload/stop button in location bar */
  1225. #go-button {
  1226. padding-top: 2px;
  1227. padding-bottom: 2px;
  1228. }
  1229. #urlbar > toolbarbutton {
  1230. -moz-appearance: none;
  1231. padding: 0;
  1232. border: none;
  1233. cursor: pointer;
  1234. width: 22px;
  1235. }
  1236. #go-button,
  1237. #urlbar-go-button {
  1238. list-style-image: url("chrome://browser/skin/Go-arrow.png");
  1239. }
  1240. #go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon,
  1241. #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon {
  1242. transform: scaleX(-1);
  1243. }
  1244. #urlbar-reload-button {
  1245. list-style-image: url("moz-icon://stock/gtk-refresh?size=menu");
  1246. }
  1247. #urlbar-stop-button {
  1248. list-style-image: url("moz-icon://stock/gtk-stop?size=menu");
  1249. }
  1250. /* Popup blocker button */
  1251. #page-report-button {
  1252. list-style-image: url("chrome://browser/skin/Info.png");
  1253. }
  1254. /* Star button */
  1255. #star-button {
  1256. list-style-image: url("chrome://browser/skin/places/starPage.png");
  1257. }
  1258. #star-button[starred="true"] {
  1259. list-style-image: url("chrome://browser/skin/places/pageStarred.png");
  1260. }
  1261. /* bookmarks menu-button */
  1262. #bookmarks-menu-button[disabled] > .toolbarbutton-icon,
  1263. #bookmarks-menu-button[disabled] > .toolbarbutton-menu-dropmarker,
  1264. #bookmarks-menu-button[disabled] > .toolbarbutton-menubutton-dropmarker,
  1265. #bookmarks-menu-button[disabled] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
  1266. #bookmarks-menu-button > .toolbarbutton-menubutton-button[disabled] > .toolbarbutton-icon {
  1267. opacity: .4;
  1268. }
  1269. /* history menu-button */
  1270. #history-menu-button[disabled] > .toolbarbutton-icon,
  1271. #history-menu-button[disabled] > .toolbarbutton-menu-dropmarker,
  1272. #history-menu-button[disabled] > .toolbarbutton-menubutton-dropmarker,
  1273. #history-menu-button[disabled] > .toolbarbutton-menubutton-button > .toolbarbutton-icon,
  1274. #history-menu-button > .toolbarbutton-menubutton-button[disabled] > .toolbarbutton-icon {
  1275. opacity: .4;
  1276. }
  1277. /* Bookmarking panel */
  1278. #editBookmarkPanelStarIcon {
  1279. list-style-image: url("chrome://browser/skin/places/starred48.png");
  1280. width: 48px;
  1281. height: 48px;
  1282. }
  1283. #editBookmarkPanelStarIcon[unstarred] {
  1284. list-style-image: url("chrome://browser/skin/places/unstarred48.png");
  1285. }
  1286. #editBookmarkPanelTitle {
  1287. font-size: 130%;
  1288. }
  1289. #editBookmarkPanelHeader,
  1290. #editBookmarkPanelContent {
  1291. margin-bottom: .5em;
  1292. }
  1293. /* Implements editBookmarkPanel resizing on folderTree un-collapse. */
  1294. #editBMPanel_folderTree {
  1295. min-width: 27em;
  1296. }
  1297. /* Content area */
  1298. #sidebar {
  1299. background-color: Window;
  1300. }
  1301. /* Throbber */
  1302. #navigator-throbber {
  1303. width: 16px;
  1304. min-height: 16px;
  1305. margin: 0 3px;
  1306. }
  1307. #navigator-throbber[busy="true"] {
  1308. list-style-image: url("chrome://global/skin/icons/loading_16.png");
  1309. }
  1310. #navigator-throbber,
  1311. #wrapper-navigator-throbber > #navigator-throbber {
  1312. list-style-image: url("chrome://global/skin/icons/notloading_16.png");
  1313. }
  1314. /* Tabstrip */
  1315. #TabsToolbar {
  1316. min-height: 0;
  1317. padding: 0;
  1318. }
  1319. #TabsToolbar[tabsontop=true]:not(:-moz-lwtheme) {
  1320. -moz-appearance: menubar;
  1321. color: -moz-menubartext;
  1322. box-shadow: 0 -1px 0 rgba(0,0,0,.1) inset;
  1323. }
  1324. #TabsToolbar[tabsontop=true]:not(:-moz-lwtheme):-moz-system-metric(menubar-drag) {
  1325. -moz-binding: url("chrome://global/content/bindings/toolbar.xml#toolbar-drag");
  1326. }
  1327. #TabsToolbar[tabsontop=false] {
  1328. background-image: linear-gradient(to top, rgba(0,0,0,.3) 1px, rgba(0,0,0,.05) 1px, transparent 50%);
  1329. }
  1330. /* When the tab bar is collapsed, show a 1px border in its place. */
  1331. #TabsToolbar[tabsontop="false"][collapsed="true"]:not([customizing="true"]) {
  1332. visibility: visible;
  1333. height: 1px;
  1334. border-bottom-width: 1px;
  1335. /* !important here to override border-style: none on the toolbar */
  1336. border-bottom-style: solid !important;
  1337. border-bottom-color: ThreeDShadow;
  1338. overflow: hidden;
  1339. }
  1340. .tabbrowser-tab,
  1341. .tabs-newtab-button {
  1342. position: static;
  1343. -moz-appearance: none;
  1344. background: linear-gradient(hsla(0,0%,100%,.2), hsla(0,0%,45%,.2) 2px, hsla(0,0%,32%,.2) 80%);
  1345. background-origin: border-box;
  1346. background-position: 1px 2px;
  1347. background-size: 100% calc(100% - 2px);
  1348. background-repeat: no-repeat;
  1349. color: inherit;
  1350. margin: 0;
  1351. padding: 0;
  1352. border-width: 4px 5px 3px 6px;
  1353. border-style: solid;
  1354. border-image: url(tabbrowser/tab.png) 4 5 3 6 fill repeat stretch;
  1355. border-radius: 10px 8px 0 0;
  1356. min-height: 25px; /* reserve space for the sometimes hidden close button */
  1357. }
  1358. .tabbrowser-tab:hover,
  1359. .tabs-newtab-button:hover {
  1360. background-image: linear-gradient(hsla(0,0%,100%,.6), hsla(0,0%,100%,.2) 4px, hsla(0,0%,75%,.2) 80%);
  1361. }
  1362. .tabbrowser-tab[selected="true"] {
  1363. background-image: linear-gradient(@selectedTabHighlight@, @toolbarHighlight@ 32%),
  1364. linear-gradient(-moz-dialog, -moz-dialog);
  1365. }
  1366. .tabbrowser-tab[selected="true"]:not(:-moz-lwtheme) {
  1367. color: -moz-dialogtext;
  1368. }
  1369. #main-window[tabsontop=false]:not([disablechrome]) .tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
  1370. background-image: linear-gradient(to top, rgba(0,0,0,.3) 1px, transparent 1px),
  1371. linear-gradient(@selectedTabHighlight@, @toolbarHighlight@ 32%),
  1372. linear-gradient(-moz-dialog, -moz-dialog);
  1373. }
  1374. .tabbrowser-tab:-moz-lwtheme:not([selected="true"]) {
  1375. opacity: 0.9;
  1376. }
  1377. .tabbrowser-tab[selected="true"]:-moz-lwtheme {
  1378. background-image: linear-gradient(rgba(255,255,255,.6), rgba(255,255,255,.8) 50%);
  1379. }
  1380. .tabbrowser-tab[selected="true"]:-moz-lwtheme-brighttext {
  1381. background-image: linear-gradient(rgba(128,128,128,.9), rgba(32,32,32,.9) 50%, rgba(32,32,32,.9) 80%, rgba(32,32,32,.8) 100%);
  1382. }
  1383. .tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]),
  1384. .tabs-newtab-button:-moz-lwtheme-brighttext {
  1385. background-image: linear-gradient(hsla(0,0%,25%,.4), hsla(0,0%,15%,.6) 80%);
  1386. }
  1387. .tabbrowser-tab:-moz-lwtheme-brighttext:not([selected="true"]):hover,
  1388. .tabs-newtab-button:-moz-lwtheme-brighttext:hover {
  1389. background-image: linear-gradient(hsla(0,0%,60%,.4), hsla(0,0%,10%,.8) 80%);
  1390. }
  1391. .tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]),
  1392. .tabs-newtab-button:-moz-lwtheme-darktext {
  1393. background-image: linear-gradient(hsla(0,0%,75%,.4), hsla(0,0%,85%,.6) 80%);
  1394. }
  1395. .tabbrowser-tab:-moz-lwtheme-darktext:not([selected="true"]):hover,
  1396. .tabs-newtab-button:-moz-lwtheme-darktext:hover {
  1397. background-image: linear-gradient(hsla(0,0%,60%,.4), hsla(0,0%,90%,.8) 80%);
  1398. }
  1399. .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) {
  1400. background-image: radial-gradient(circle farthest-corner at 50% 3px, rgba(233,242,252,1) 3%, rgba(172,206,255,.75) 40%, rgba(87,151,201,.5) 80%, rgba(87,151,201,0));
  1401. }
  1402. .tabbrowser-tab[pinned][titlechanged]:not([selected="true"]):hover {
  1403. background-image: linear-gradient(hsla(0,0%,100%,.8), hsla(0,0%,100%,.6) 2px, hsla(0,0%,75%,.2) 80%),
  1404. radial-gradient(circle farthest-corner at 50% 3px, rgba(233,242,252,1) 3%, rgba(172,206,255,.75) 40%, rgba(87,151,201,.5) 80%, rgba(87,151,201,0));
  1405. }
  1406. #tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab > .tab-stack > .tab-content[pinned] {
  1407. min-height: 18px; /* corresponds to the max. height of non-textual tab contents, i.e. the tab close button */
  1408. }
  1409. .tabbrowser-tab:focus > .tab-stack {
  1410. outline: 1px dotted;
  1411. }
  1412. .tab-throbber,
  1413. .tab-icon-image {
  1414. width: 16px;
  1415. height: 16px;
  1416. margin-inline-end: 3px;
  1417. list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
  1418. }
  1419. .tab-throbber {
  1420. list-style-image: url("chrome://browser/skin/tabbrowser/connecting.png");
  1421. }
  1422. .tab-throbber[progress] {
  1423. list-style-image: url("chrome://browser/skin/tabbrowser/loading.png");
  1424. }
  1425. .tab-throbber[pinned],
  1426. .tab-icon-image[pinned],
  1427. .tabs-newtab-button > .toolbarbutton-icon {
  1428. margin-inline-start: 2px;
  1429. margin-inline-end: 2px;
  1430. }
  1431. #context_reloadTab {
  1432. list-style-image: url("moz-icon://stock/gtk-refresh?size=menu");
  1433. }
  1434. #context_closeOtherTabs {
  1435. list-style-image: url("moz-icon://stock/gtk-clear?size=menu");
  1436. }
  1437. #context_closeOtherTabs[disabled] {
  1438. list-style-image: url("moz-icon://stock/gtk-clear?size=menu&state=disabled");
  1439. }
  1440. #context_undoCloseTab {
  1441. list-style-image: url("moz-icon://stock/gtk-undelete?size=menu");
  1442. }
  1443. #context_closeTab {
  1444. list-style-image: url("moz-icon://stock/gtk-close?size=menu");
  1445. }
  1446. /* Tab drag and drop */
  1447. .tab-drop-indicator {
  1448. list-style-image: url(chrome://browser/skin/tabbrowser/tabDragIndicator.png);
  1449. margin-bottom: -11px;
  1450. }
  1451. /* In-tab close button */
  1452. .tab-close-button > .toolbarbutton-icon {
  1453. /* XXX Buttons have padding in widget/ that we don't want here but can't override with good CSS, so we must
  1454. use evil CSS to give the impression of smaller content */
  1455. margin: -4px;
  1456. }
  1457. .tab-close-button {
  1458. padding: 0;
  1459. margin-top: -1px;
  1460. margin-bottom: -1px;
  1461. margin-inline-end: -1px;
  1462. }
  1463. /* Tab sound indicator */
  1464. .tab-icon-sound {
  1465. margin-inline-start: 4px;
  1466. width: 16px;
  1467. height: 16px;
  1468. padding: 0;
  1469. }
  1470. .allTabs-endimage[soundplaying],
  1471. .tab-icon-sound[soundplaying] {
  1472. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio");
  1473. }
  1474. .allTabs-endimage[muted],
  1475. .tab-icon-sound[muted] {
  1476. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-muted");
  1477. }
  1478. .allTabs-endimage[blocked],
  1479. .tab-icon-sound[blocked] {
  1480. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio-blocked");
  1481. }
  1482. #TabsToolbar:-moz-lwtheme-brighttext .tab-icon-sound[soundplaying],
  1483. #TabsToolbar:-moz-lwtheme-brighttext .tab-icon-sound[blocked],
  1484. #TabsToolbar:-moz-lwtheme-brighttext .tab-icon-sound[muted] {
  1485. filter: invert(1);
  1486. }
  1487. .tab-icon-sound[soundplaying-scheduledremoval]:not([muted]):not(:hover),
  1488. .tab-icon-overlay[soundplaying-scheduledremoval]:not([muted]):not(:hover) {
  1489. transition: opacity .3s linear var(--soundplaying-removal-delay);
  1490. opacity: 0;
  1491. }
  1492. /* Tab icon overlay */
  1493. .tab-icon-overlay {
  1494. width: 16px;
  1495. height: 16px;
  1496. margin-top: -8px;
  1497. margin-inline-start: -15px;
  1498. margin-inline-end: -1px;
  1499. position: relative;
  1500. }
  1501. .tab-icon-overlay[soundplaying],
  1502. .tab-icon-overlay[muted]:not([crashed]),
  1503. .tab-icon-overlay[blocked]:not([crashed]) {
  1504. border-radius: 10px;
  1505. }
  1506. .tab-icon-overlay[soundplaying]:hover,
  1507. .tab-icon-overlay[muted]:not([crashed]):hover,
  1508. .tab-icon-overlay[blocked]:not([crashed]):hover {
  1509. background-color: white;
  1510. }
  1511. .tab-icon-overlay[soundplaying] {
  1512. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio");
  1513. }
  1514. .tab-icon-overlay[muted] {
  1515. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-muted");
  1516. }
  1517. .tab-icon-overlay[blocked] {
  1518. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-blocked");
  1519. }
  1520. #TabsToolbar:-moz-lwtheme-brighttext .tab-icon-overlay[soundplaying]:not([selected]):not(:hover),
  1521. .tab-icon-overlay[soundplaying][selected]:-moz-lwtheme-brighttext:not(:hover) {
  1522. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white");
  1523. }
  1524. #TabsToolbar:-moz-lwtheme-brighttext .tab-icon-overlay[muted]:not([crashed]):not([selected]):not(:hover),
  1525. .tab-icon-overlay[muted][selected]:-moz-lwtheme-brighttext:not(:hover) {
  1526. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-muted");
  1527. }
  1528. #TabsToolbar:-moz-lwtheme-brighttext .tab-icon-overlay[blocked]:not([crashed]):not([selected]):not(:hover),
  1529. .tab-icon-overlay[blocked][selected]:-moz-lwtheme-brighttext:not(:hover) {
  1530. list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-small.svg#tab-audio-white-blocked");
  1531. }
  1532. /* Tabstrip new tab button */
  1533. .tabs-newtab-button,
  1534. #TabsToolbar > #new-tab-button ,
  1535. #TabsToolbar > #wrapper-new-tab-button > #new-tab-button {
  1536. list-style-image: url("moz-icon://stock/gtk-add?size=menu");
  1537. -moz-image-region: auto;
  1538. }
  1539. /* Tabstrip close button */
  1540. .tabs-closebutton > .toolbarbutton-icon {
  1541. /* XXX Buttons have padding in widget/ that we don't want here but can't override with good CSS, so we must
  1542. use evil CSS to give the impression of smaller content */
  1543. margin: -2px;
  1544. }
  1545. /* Tabbrowser arrowscrollbox arrows */
  1546. .tabbrowser-arrowscrollbox > .scrollbutton-up,
  1547. .tabbrowser-arrowscrollbox > .scrollbutton-down {
  1548. -moz-appearance: none;
  1549. margin: 0;
  1550. }
  1551. .tabbrowser-arrowscrollbox > .scrollbutton-up {
  1552. border-inline-start: 0;
  1553. border-inline-end: 2px solid transparent;
  1554. }
  1555. .tabbrowser-arrowscrollbox > .scrollbutton-down {
  1556. border-inline-start: 2px solid transparent;
  1557. border-inline-end: 0;
  1558. transition: 1s box-shadow ease-out;
  1559. border-radius: 4px;
  1560. }
  1561. .tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] {
  1562. box-shadow: 0 0 5px 5px Highlight inset;
  1563. transition: none;
  1564. }
  1565. .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):-moz-locale-dir(ltr),
  1566. .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):-moz-locale-dir(rtl) {
  1567. border-width: 0 2px 0 0;
  1568. border-style: solid;
  1569. border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;
  1570. }
  1571. .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled]):-moz-locale-dir(ltr),
  1572. .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled]):-moz-locale-dir(rtl) {
  1573. border-width: 0 0 0 2px;
  1574. border-style: solid;
  1575. border-image: url("chrome://browser/skin/tabbrowser/tab-overflow-border.png") 0 2 0 2 fill;
  1576. }
  1577. #TabsToolbar .toolbarbutton-1 > .toolbarbutton-icon,
  1578. #TabsToolbar .toolbarbutton-1 > .toolbarbutton-menu-dropmarker,
  1579. #TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button > .toolbarbutton-icon {
  1580. margin-top: -2px;
  1581. margin-bottom: -2px;
  1582. }
  1583. #alltabs-button > .toolbarbutton-icon {
  1584. list-style-image: url("chrome://browser/skin/tabbrowser/alltabs.png");
  1585. margin: 2px 0 1px;
  1586. }
  1587. #alltabs-button[type="menu"] > .toolbarbutton-menu-dropmarker {
  1588. margin-bottom: -2px;
  1589. }
  1590. #alltabs-button[type="menu"] > .toolbarbutton-icon {
  1591. display: none;
  1592. }
  1593. /* All tabs menupopup */
  1594. .alltabs-item > .menu-iconic-left > .menu-iconic-icon {
  1595. list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
  1596. }
  1597. .alltabs-item[selected="true"] {
  1598. font-weight: bold;
  1599. }
  1600. .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon {
  1601. list-style-image: url("chrome://global/skin/icons/loading_16.png");
  1602. }
  1603. .alltabs-item[tabIsVisible] {
  1604. /* box-shadow instead of background-color to work around native styling */
  1605. box-shadow: inset -5px 0 ThreeDShadow;
  1606. }
  1607. /* Sidebar */
  1608. #sidebar-header > .tabs-closebutton {
  1609. margin-bottom: 0px !important;
  1610. padding: 0px 2px 0px 2px !important;
  1611. }
  1612. #sidebar-throbber[loading="true"] {
  1613. list-style-image: url("chrome://global/skin/icons/loading_16.png");
  1614. margin-inline-end: 4px;
  1615. }
  1616. toolbarbutton.chevron {
  1617. list-style-image: url("chrome://global/skin/toolbar/chevron.gif") !important;
  1618. }
  1619. toolbarbutton.chevron:-moz-locale-dir(rtl) > .toolbarbutton-icon {
  1620. transform: scaleX(-1);
  1621. }
  1622. toolbarbutton.chevron > .toolbarbutton-text,
  1623. toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
  1624. display: none;
  1625. }
  1626. toolbarbutton.chevron > .toolbarbutton-icon {
  1627. margin: 0;
  1628. }
  1629. toolbar[mode="text"] toolbarbutton.chevron > .toolbarbutton-icon {
  1630. display: -moz-box; /* display chevron icon in text mode */
  1631. }
  1632. /* ::::: Keyboard UI Panel ::::: */
  1633. .KUI-panel-closebutton {
  1634. list-style-image: url(KUI-close.png);
  1635. }
  1636. .KUI-panel-closebutton > .toolbarbutton-icon {
  1637. margin: 0;
  1638. }
  1639. /* ::::: Ctrl-Tab and All Tabs Panels ::::: */
  1640. .ctrlTab-preview,
  1641. .allTabs-preview {
  1642. -moz-appearance: toolbarbutton;
  1643. }
  1644. .tabPreview-canvas {
  1645. box-shadow: 0 0 5px ThreeDShadow;
  1646. }
  1647. .ctrlTab-preview:focus .tabPreview-canvas,
  1648. .ctrlTab-preview:hover .tabPreview-canvas,
  1649. .allTabs-preview:focus .tabPreview-canvas,
  1650. .allTabs-preview:hover .tabPreview-canvas {
  1651. box-shadow: none;
  1652. }
  1653. .ctrlTab-favicon[src],
  1654. .allTabs-favicon[src] {
  1655. background-color: white;
  1656. width: 20px;
  1657. height: 20px;
  1658. padding: 2px;
  1659. }
  1660. /* Ctrl-Tab */
  1661. #ctrlTab-panel {
  1662. padding: 10px;
  1663. }
  1664. .ctrlTab-preview:not(#ctrlTab-showAll) .tabPreview-canvas {
  1665. margin-bottom: 2px;
  1666. }
  1667. #ctrlTab-showAll {
  1668. -moz-appearance: button;
  1669. color: ButtonText;
  1670. padding: 0 3px;
  1671. margin-top: 10px;
  1672. }
  1673. /* All Tabs */
  1674. #allTabs-panel {
  1675. padding-bottom: 10px;
  1676. }
  1677. #allTabs-meta {
  1678. padding: 5px;
  1679. }
  1680. #allTabs-filter {
  1681. margin-inline-start: 36px;
  1682. margin-inline-end: 0;
  1683. }
  1684. .allTabs-preview-label {
  1685. transform: translate(0, 2px);
  1686. }
  1687. /* Application button menu */
  1688. .splitmenu-menuitem {
  1689. margin-inline-end: 1px;
  1690. }
  1691. #appmenu-toolbar-button:not(:hover):not([open]):not(:-moz-lwtheme) {
  1692. color: inherit;
  1693. }
  1694. #appmenu-toolbar-button > .toolbarbutton-text,
  1695. #appmenu-toolbar-button > .toolbarbutton-menu-dropmarker {
  1696. margin-top: -2px !important;
  1697. margin-bottom: -2px !important;
  1698. }
  1699. #appmenuSecondaryPane {
  1700. border-inline-start: 1px solid ThreeDShadow;
  1701. }
  1702. #appmenuSecondaryPane-spacer {
  1703. min-height: 1em;
  1704. }
  1705. #appmenu-cut,
  1706. #appmenu-editmenu-cut {
  1707. list-style-image: url("moz-icon://stock/gtk-cut?size=menu");
  1708. }
  1709. #appmenu-copy,
  1710. #appmenu-editmenu-copy {
  1711. list-style-image: url("moz-icon://stock/gtk-copy?size=menu");
  1712. }
  1713. #appmenu-paste,
  1714. #appmenu-editmenu-paste {
  1715. list-style-image: url("moz-icon://stock/gtk-paste?size=menu");
  1716. }
  1717. #wrapper-appmenu-toolbar-button,
  1718. .appmenu-edit-button[disabled="true"] {
  1719. opacity: .3;
  1720. }
  1721. /* Add-on bar */
  1722. #addon-bar {
  1723. box-shadow: 0 1px 0 rgba(0,0,0,.15) inset;
  1724. padding: 0;
  1725. min-height: 20px;
  1726. }
  1727. #status-bar {
  1728. min-height: 0;
  1729. -moz-appearance: none;
  1730. background-color: transparent;
  1731. border: none;
  1732. }
  1733. #addon-bar[customizing] > #status-bar {
  1734. opacity: .5;
  1735. background-image: repeating-linear-gradient(135deg,
  1736. rgba(255,255,255,.3), rgba(255,255,255,.3) 5px,
  1737. rgba(0,0,0,.3) 5px, rgba(0,0,0,.3) 10px);
  1738. }
  1739. #status-bar > statusbarpanel {
  1740. border-width: 0;
  1741. -moz-appearance: none;
  1742. }
  1743. #addonbar-closebutton > .toolbarbutton-icon {
  1744. margin-top: -2px;
  1745. margin-bottom: -2px;
  1746. }
  1747. /* Status panel */
  1748. .statuspanel-label {
  1749. margin: 0;
  1750. padding: 2px 4px;
  1751. background: linear-gradient(#fff, #ddd);
  1752. border: 1px none #ccc;
  1753. border-top-style: solid;
  1754. color: #333;
  1755. text-shadow: none;
  1756. }
  1757. .statuspanel-label:-moz-locale-dir(ltr):not([mirror]),
  1758. .statuspanel-label:-moz-locale-dir(rtl)[mirror] {
  1759. border-right-style: solid;
  1760. border-top-right-radius: .3em;
  1761. margin-right: 1em;
  1762. }
  1763. .statuspanel-label:-moz-locale-dir(rtl):not([mirror]),
  1764. .statuspanel-label:-moz-locale-dir(ltr)[mirror] {
  1765. border-left-style: solid;
  1766. border-top-left-radius: .3em;
  1767. margin-left: 1em;
  1768. }
  1769. #full-screen-warning-message {
  1770. background-color: hsl(0,0%,15%);
  1771. color: white;
  1772. border-radius: 8px;
  1773. margin-top: 30px;
  1774. padding: 30px 50px;
  1775. box-shadow: 0 0 2px white;
  1776. }
  1777. .full-screen-description {
  1778. font-size: 150%;
  1779. }
  1780. #full-screen-domain-text {
  1781. font-size: 300%;
  1782. }
  1783. %ifdef MOZ_DEVTOOLS
  1784. %include ../../../platform/devtools/client/themes/responsivedesign.inc.css
  1785. %include ../../../platform/devtools/client/themes/commandline.inc.css
  1786. %endif
  1787. %include ../shared/plugin-doorhanger.inc.css
  1788. %ifdef MOZ_DEVTOOLS
  1789. .gcli-panel {
  1790. padding: 0;
  1791. }
  1792. .gclitoolbar-input-node > .textbox-input-box > html|*.textbox-input::-moz-selection {
  1793. color: hsl(210,11%,16%);
  1794. }
  1795. /* Error counter */
  1796. #developer-toolbar-toolbox-button[error-count]:before {
  1797. color: #FDF3DE;
  1798. min-width: 16px;
  1799. text-shadow: none;
  1800. background-image: linear-gradient(#B4211B, #8A1915);
  1801. border-radius: 1px;
  1802. margin-inline-end: 2px;
  1803. }
  1804. %endif
  1805. .toolbarbutton-badge-stack {
  1806. margin: 5px 3px;
  1807. position: relative;
  1808. }
  1809. toolbar[iconsize="small"] .toolbarbutton-badge-stack {
  1810. margin: 0;
  1811. }
  1812. .toolbarbutton-badge[badge]:not([badge=""]):-moz-locale-dir(rtl)::after {
  1813. left: 2px;
  1814. right: auto;
  1815. }
  1816. #main-window[privatebrowsingmode=temporary] #TabsToolbar::before {
  1817. display: -moz-box;
  1818. content: "";
  1819. background: url("chrome://browser/skin/privatebrowsing-mask.png") center no-repeat;
  1820. width: 40px;
  1821. }