Guest User

Rob edit

a guest
Apr 23rd, 2015
366
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.66 KB | None | 0 0
  1. @namespace html url(http://www.w3.org/1999/xhtml);
  2. @namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
  3. /*
  4. Author: Twily
  5. Description: Minimal flat styled tabs for Australis
  6. Compitability: Firefox Nightly v31.0a1 - v32.0a1 (Australis)
  7. CSS Variables were introduced to Firefox in v29.0a1
  8. Website: http://twily.info/
  9.  
  10.  
  11. Note: To enable the urlbar; search this css for:
  12. "make the url-bar visible" and "adjust margin-top to"
  13. */
  14.  
  15. :root {
  16. /* TAB VARIABLES */
  17. --bg-light: #ab3541; --bg-dark: #1b1b1b;
  18. --fg-light: #fbfbfb; --fg-dark: #fbfbfb;
  19. --url-light : #fbfbfb;
  20. /*--tab-triangle-correction: 0px;*/
  21. --tab-height: 22px; --tab-icon-size: 12px; --tab-strip-margin: -8px; --tab-overlap: 0px;
  22. --tab-fonts: "Segoe UI"; --tab-font-size: 9pt;
  23. --tab-triangle: none ; /* block | none */
  24.  
  25. /* URL VARIABLES */
  26. --url-background: var(--bg-dark); --url-color: var(--url-light);
  27. --url-height: 20px; --url-right-margin: 35px;
  28. --url-fonts: "Segoe UI", ; --url-font-size: 9pt;
  29. --url-text-align: center; /* left | center | right */
  30. --url-position: fixed; /* absolute == top (under tabs) || fixed == bottom of browser */
  31.  
  32. margin-bottom: 19px !important;
  33.  
  34. }
  35.  
  36. /*Robs customizations*/
  37.  
  38. #main-window:not([chromehidden*="toolbar"])[sizemode="normal"]
  39. {
  40. margin-top:-3.5px!important;
  41. margin-left:-1px!important;
  42. margin-right:-1px!important;
  43.  
  44. }
  45.  
  46. #main-window[sizemode="fullscreen"],
  47. #main-window[sizemode="maximized"]
  48. {
  49. margin-top:-1px!important;
  50. }
  51.  
  52. #main-window #tabbrowser-tabs
  53. {
  54. margin-left: -14px!important;
  55. margin-right:-14px!important;
  56. }
  57.  
  58. #titlebar {display: none !important;}
  59.  
  60.  
  61.  
  62.  
  63. @-moz-document url(chrome://browser/content/browser.xul) {
  64. /* URL-BAR */
  65. #PanelUI-button, #bookmarks-menu-button, #downloads-button, #home-button, #stylish-toolbar-button, #abp-toolbarbutton,
  66. #back-button, #forward-button, #identity-box, #urlbar-reload-button, #urlbar-stop-button, #urlbar-go-button,
  67. #notification-popup-box, #new-tab-button, #private-browsing-indicator, #search-container, #nav-bar-overflow-button,
  68. .tabs-newtab-button, .tab-close-button, .tab-close, .tab-throbber, .tab-background-start, .tab-background-end,
  69. #window-controls /*, #alltabs-button, #tabview-button, .tab-icon-image, .tab-icon-image:not([pinned])*/ { display: none !important; }
  70.  
  71. .tab-drop-indicator { margin-bottom: 0 !important; }
  72.  
  73. #nav-bar {
  74. position: var(--url-position) !important; bottom: 0 !important;
  75. width: 100% !important; height: var(--url-height) !important;
  76. min-height: var(--url-height) !important; max-height: var(--url-height) !important;
  77. margin: 0 0 0 0 !important;
  78. margin-left: 0px !important;
  79. margin-right: 0px !important;
  80.  
  81. /* --- Uncomment the section below to attach the url-bar to the tab-bar [EXPERIMENTAL] (Require a line in "#TabsToolbar" below) --- */
  82. /*
  83. position: fixed !important; top: 0 !important; left: 0 !important;
  84. width: 315px !important; max-width: 315px !important;
  85. z-index: 100 !important;
  86. /**/
  87. }
  88. #nav-bar-customization-target { width: 100% !important; }
  89. #urlbar-wrapper {
  90. width: 100% !important; margin-top: 0px !important; /* adjust margin-top to ~ -5px if you experience gap */
  91. position: absolute !important; top: 0 !important; left: 0 !important;
  92. border-bottom: 0px solid var(--bg-light) !important;
  93. }
  94. #urlbar {
  95. border: none !important; border-radius: 0 !important;
  96. margin: 0 0 0 0 !important; padding: 0 2px 5px 9px !important;
  97. width: calc(100% + var(--url-right-margin)) !important;
  98. height: var(--url-height) !important; min-height: var(--url-height) !important;
  99. background: var(--url-background) !important; color: var(--url-color) !important;
  100. font-family: var(--url-fonts) !important; font-size: var(--url-font-size) !important;
  101. text-align: var(--url-text-align) !important;
  102. }
  103. /*#urlbar * { -moz-appearance: none !important; }*/
  104.  
  105. /* --- Comment out the section below to make the url-bar visible --- */
  106. /**/
  107. /* #nav-bar {
  108. width: 0 !important; height: 0 !important;
  109. position: fixed !important; left: -1px !important; top: -1px !important;
  110. overflow: hidden !important; visibility: hidden !important;
  111. }
  112. /**/
  113.  
  114.  
  115. /* TABS */
  116. .tabbrowser-tab[fadein]:not([pinned]) { min-width: 100px !important; max-width: /*180px*/ 100% !important; }
  117. tab {
  118. font-family: var(--tab-fonts) !important;
  119. height: var(--tab-height) !important; min-height: var(--tab-height) !important;
  120. background: var(--bg-dark) !important; color: var(--fg-dark) !important;
  121. font-size: var(--tab-font-size); text-shadow: none !important; text-align: center /* center | left */ !important;
  122. }
  123.  
  124. .tabbrowser-tab label { padding: 0 22px 0 22px !important; }
  125.  
  126. #tabbrowser-tabs .tabbrowser-tab[pinned] { width: 20px !important; }
  127. #tabbrowser-tabs .tabbrowser-tab[pinned] label { display: none !important; }
  128.  
  129. #tabbrowser-tabs .tabbrowser-tab:not([pinned]) .tab-icon-image {
  130. margin: 0 -10px 0 18px !important;
  131. width: 0 !important;
  132. height: var(--tab-icon-size) !important;
  133. }
  134.  
  135. #tabbrowser-tabs .tabbrowser-tab[pinned] .tab-icon-image {
  136. margin: 0 -10px -5px 10px !important;
  137. width: var(--tab-icon-size) !important;
  138. height: var(--tab-icon-size) !important;
  139. }
  140.  
  141. .tabbrowser-tab *, .tabs-newtab-button * {
  142. background: none !important; list-style-image: none !important;
  143. margin: 0 0 0 0 !important; padding: 0 0 0 0 !important;
  144. -moz-appearance: none !important;
  145. }
  146.  
  147. #tabbrowser-tabs .tabbrowser-tab[pinned] .tab-stack { height: var(--tab-height) !important; width: 100% !important; }
  148. #tabbrowser-tabs .tabbrowser-arrowscrollbox .box-inherit.scrollbox-innerbox { max-height: var(--tab-height) !important; }
  149. .scrollbutton-up, .scrollbutton-down { border: none !important; }
  150.  
  151. #tabbrowser-tabs[overflow]:not([positionpinnedtabs]) { -moz-padding-start: 20px !important; }
  152.  
  153. .tabbrowser-tab[selected="true"] .tab-stack {
  154. background: var(--bg-light) !important; color: var(--fg-light) !important;
  155. border-radius: 0px !important; position: relative !important;
  156. /*border-top: 1px solid #dc52a5 !important;/**/
  157. }
  158.  
  159.  
  160. .tabbrowser-tab[selected="true"]:before { /* Left Triangle (of selected tab) */
  161. content: '' !important; display: var(--tab-triangle);
  162. position: absolute !important; top: 0 !important; left: var(--tab-overlap) !important;
  163. width: 0 !important; height: 0 !important;
  164. border: none !important; z-index: 2 !important;
  165.  
  166. /*border-left: calc(var(--tab-height)/2) solid var(--bg-dark) !important;
  167. border-top: calc((var(--tab-height)/2) - var(--tab-triangle-correction)) solid var(--bg-light) !important;
  168. border-bottom: calc((var(--tab-height)/2) + var(--tab-triangle-correction)) solid var(--bg-light) !important;/**/
  169. /**/ border-top: var(--tab-height) solid var(--bg-dark) !important;
  170. border-right: calc(var(--tab-height)/1) solid var(--bg-light) !important;/**/
  171. }
  172. .tabbrowser-tab[selected="true"]:after { /* Right Triangle (of selected tab) */
  173. content: '' !important; display: var(--tab-triangle);
  174. position: absolute !important; top: 0 !important; right: var(--tab-overlap) !important;
  175. width: 0 !important; height: 0 !important;
  176. border: none !important; z-index: 2 !important;
  177.  
  178. /*border-right: calc(var(--tab-height)/2) solid var(--bg-dark) !important;
  179. border-top: calc((var(--tab-height)/2) - var(--tab-triangle-correction)) solid var(--bg-light) !important;
  180. border-bottom: calc((var(--tab-height)/2) + var(--tab-triangle-correction)) solid var(--bg-light) !important;/**/
  181. /**/ border-top: var(--tab-height) solid var(--bg-dark) !important;
  182. border-left: calc(var(--tab-height)/1) solid var(--bg-light) !important;/**/
  183. }
  184.  
  185.  
  186.  
  187.  
  188. #TabsToolbar, #tabbrowser-tabs {
  189. -moz-appearance: none !important;
  190. height: var(--tab-height) !important; min-height: var(--tab-height)!important;
  191. margin: 0 var(--tab-strip-margin) !important;
  192. background: var(--bg-dark) !important;
  193. margin-top: -1px !important;
  194. margin-bottom: -1px !important;
  195.  
  196. /* --- Uncomment the line below to attach the url-bar to the tab-bar [EXPERIMENTAL] (Require a line in "#nav-bar" above) --- */
  197. /*margin-left: 150px !important;/**/
  198. }
  199. #TabsToolbar::after { display: none !important; }
  200. .tabbrowser-tab::before, .tabbrowser-tab::after { background: none !important; }
  201.  
  202. /*browser, #navigator-toolbox { -moz-appearance: none !important; background: transparent !important; }*/
  203.  
  204. /*#navigator-toolbox::after { height: 0 !important;/**/
  205. #navigator-toolbox::after { height: 0px !important; background: var(--bg-light) !important; }
  206. #liberator-separator { height: 0px !important; background: var(--bg-light) !important; border-top: 0 !important; }
  207.  
  208. /* MENUS */
  209. menuitem + menuseparator, menu + menuseparator, .menu-iconic-left { display: none !important; }
  210. menuitem > label { margin-left: var(--tab-height) !important; }
  211. menubar, menubutton, menulist, menu, menuitem {
  212. font-family: var(--tab-fonts) !important; font-size: var(--tab-font-size);
  213. height: var(--tab-height) !important;
  214. }
  215.  
  216. /* HIDE ORANGE MENU BUTTON */
  217. #appmenu-toolbar-button, #appmenu-button-container { display: none !important; }
  218.  
  219. /* HIDE STATUS BAR */
  220. #status-bar, #statusbar-display, statuspanel { display: none !important; }
  221.  
  222. /* PRIVATE BROWSING ICON HIDE */
  223. #main-window[privatebrowsingmode=temporary] #private-browsing-indicator,
  224. #main-window[privatebrowsingmode=temporary] #private-browsing-indicator-titlebar { display: none !important; }
  225.  
  226. /* Vimperator icon style */
  227. #liberator-statusline:not([customizing="true"]) { margin: -2px -2px !important; padding: 0 0 !important; height: 24px !important; }
  228. #liberator-statusline:not([customizing="true"]) :-moz-any(toolbarbutton) { height: 100% !important; }
  229. #tabview-button {
  230. list-style-image: url(http://twily.info/img/tabview-button.png?v=2) /* 16x16 px image */ !important;
  231. -moz-image-region: rect(0, 0, 0, 0) !important;
  232. }
  233.  
  234. #liberator-completions { background: var(--bg-dark) !important; }
  235.  
  236. /* Tabgroup margin top fix */
  237. #tab-view-deck #tab-view { margin-top: 11px !important; }
  238. #tab-view-deck { background: var(--bg-light) !important; }
  239.  
  240. window[sizemode="fullscreen"] #liberator-statusline { display: none !important; }
  241. window[sizemode="fullscreen"] #liberator-bottombar { margin-top: -24px !important; transition: 1s ease !important; }
  242. /*window[sizemode="fullscreen"] #browser-panel { margin-top: -1px !important; }*/
  243. }
  244.  
  245.  
  246. /* Tab Group Page Style (Ctrl+Shift+E) */
  247. @-moz-document url(chrome://browser/content/tabview.html) {
  248. #content #bg, #actions, body { background: var(--bg-light) !important; }
  249. body * { color: var(--fg-light) !important; }
  250.  
  251. body .groupItem, #content #actions, body .undo {
  252. background: var(--bg-dark) !important;
  253. border: 0 !important; border-radius: 0 !important; box-shadow: 0 0 0 0 !important;
  254. }
  255. #content #actions {
  256. opacity: 0 !important; display: none !important; /* block | none */
  257. transition: .3s ease-out !important;
  258. }
  259. #content #actions:hover { opacity: 1 !important; }
  260.  
  261. body .appTabTrayContainer { border: 0 !important; }
  262. body .tab, body .tab .thumb {
  263. box-shadow: 0 0 0 0 !important; border: 0 !important; border-radius: 0 !important;
  264. background: transparent !important; padding : 0 !important;
  265. }
  266. body .tab .favicon { display: none !important; }
  267. body .groupItem .name { border: 0 !important; }
  268. body .tab .tab-title { padding-top: 2px !important; }
  269. }
  270.  
  271.  
  272. /* AGENT_SHEET */
  273. @-moz-document url-prefix(http://), url-prefix(https://), url-prefix(chrome://liberator/) {
  274. /* SCROLLBAR */
  275. scrollbar[orient="vertical"], scrollbar thumb[orient="vertical"],
  276. scrollbar[orient="horizontal"], scrollbar thumb[orient="horizontal"] {
  277. display: none !important; /* none = hide || block = show */
  278. }
  279.  
  280. /*
  281. scrollbar > slider { -moz-appearance: none !important; }
  282.  
  283. scrollbar[orient="vertical"] { margin: -3px -7px -3px -3px !important; }
  284. scrollbar[orient='vertical'] > slider { background: #27282B !important; max-width: 5px !important; }
  285. scrollbar[orient='vertical'] > slider > thumb {
  286. -moz-appearance: none !important;
  287. background: #9b79f7 !important; border: 0 !important;
  288. width: 5px !important; max-width: 5px !important;
  289. }
  290.  
  291. scrollbar[orient="horizontal"] { margin: -3px -3px -7px -3px !important; }
  292. scrollbar[orient='horizontal'] > slider { background: #27282B !important; max-height: 5px !important; }
  293. scrollbar[orient='horizontal'] > slider > thumb {
  294. -moz-appearance: none !important;
  295. background: #9b79f7 !important; border: 0 !important;
  296. height: 5px !important; max-height: 5px !important;
  297. }
  298.  
  299. scrollbar > scrollbarbutton { -moz-appearance: none !important; border: none !important; background: none !important; }
  300. scrollbar[orient='vertical'] > scrollbarbutton { min-height: 0 !important; }
  301. scrollbar[orient='horizontal'] > scrollbarbutton { min-width: 0 !important; }
  302. /**/
  303. }
  304.  
  305.  
  306. /* background color around/behind pictures opened in firefox (require html namespace on top) */
  307. @-moz-document regexp("(https?://|file:///)(.*)\\.(jpeg|jpg|gif|png|apng|svg|bmp|webm|webp)") {
  308. body { background: var(--bg-light) !important; }
  309. img.decoded { background: url(none) !important; }
  310. }
  311.  
  312.  
  313. /* About:Blank background */
  314. @-moz-document url(about:blank) {
  315. html,body { background: var(--bg-light) !important; }
  316. }
  317.  
  318.  
  319.  
  320. /*----- Fix for white flash on new tab -----*/
  321. tabbrowser tabpanels, #appcontent > #content { background: var(--bg-light) !important; }
  322.  
  323.  
  324. /* Set dark text in light textareas
  325. @-moz-document regexp("https?://(?!(localhost|twily.info|.*.4chan.org|.*.youtube.com)).*") {
  326. input, textarea { color: #222628 !important; -moz-appearance: none !important; }
  327. }*/
Advertisement
Add Comment
Please, Sign In to add comment