API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Apr 20th, 2025
15
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.84 KB | None | 0 0
raw download clone embed print report
  1. :root {
  2. /* delay before expanding tabs, set to '0' for no delay */
  3. --delay: 0.25s;
  4. --transition-time: 0.2s;
  5. --positionX1: 48px; /* '48px' for left, '0px' for right sidebar */
  6. --positionX2: absolute; /* 'absolute' for left, 'none' for right sidebar */
  7. /* width of the collapsed sidebar in fullscreen mode ('1px' or '48px') */
  8. --fullscreen-sidebar-width: 1px;
  9. }
  10.  
  11. /* macOS specific styles */
  12. @media (-moz-platform: macos) {
  13. #TabsToolbar:not([customizing="true"]) {
  14. visibility: collapse !important;
  15. }
  16.  
  17. :root:not([customizing="true"]) #nav-bar:not([inFullscreen]) {
  18. padding-left: 80px;
  19. }
  20.  
  21. :root:not([customizing="true"]) #TabsToolbar .titlebar-buttonbox-container {
  22. visibility: visible !important;
  23. position: absolute;
  24. top: 12px;
  25. left: 0px;
  26. display: block;
  27. }
  28. }
  29.  
  30. /* Linux/GTK specific styles */
  31. @media (-moz-gtk-csd-available) {
  32. .browser-toolbar:not(.titlebar-color){ /* Fixes wrong coloring applied with --toolbar-bgcolor by Firefox (#101) */
  33. background-color: transparent !important;
  34. box-shadow: none !important;
  35. }
  36.  
  37. #TabsToolbar:not([customizing="true"]) {
  38. visibility: collapse !important;
  39. }
  40.  
  41. #toolbar-menubar {
  42. padding-top: 0px !important;
  43. }
  44.  
  45. :root:not([customizing="true"]) #toolbar-menubar[inactive]+#TabsToolbar .titlebar-buttonbox-container {
  46. visibility: visible !important;
  47. position: absolute;
  48. top: var(--uc-win-ctrl-vertical-offset);
  49. display: block;
  50. z-index: 101;
  51. }
  52.  
  53. /* enable rounded top corners */
  54. :root[tabsintitlebar][sizemode="normal"]:not([gtktiledwindow="true"]):not([customizing="true"]) #nav-bar {
  55. border-top-left-radius: env(-moz-gtk-csd-titlebar-radius);
  56. border-top-right-radius: env(-moz-gtk-csd-titlebar-radius);
  57. }
  58.  
  59. /* window control padding values (these don't change the size of the actual buttons, only the padding for the navbar) */
  60. :root[tabsintitlebar]:not([customizing="true"]) {
  61. /* default button/padding size based on adw-gtk3 theme */
  62. --uc-win-ctrl-btn-width: 38px;
  63. --uc-win-ctrl-padding: 12px;
  64. /* vertical offset from the top of the window, calculation: (1/2 * (NAVBAR_HEIGHT - BUTTON_HEIGHT)) */
  65. --uc-win-ctrl-vertical-offset: 8px;
  66. /* extra window drag space */
  67. --uc-win-ctrl-drag-space: 20px;
  68. }
  69.  
  70. :root[tabsintitlebar][lwtheme]:not([customizing="true"]) {
  71. /* seperate values for when using a theme, based on the Firefox defaults */
  72. --uc-win-ctrl-btn-width: 30px;
  73. --uc-win-ctrl-padding: 12px;
  74. /* vertical offset from the top of the window, calculation: (1/2 * (NAVBAR_HEIGHT - BUTTON_HEIGHT)) */
  75. --uc-win-ctrl-vertical-offset: 5px;
  76. /* extra window drag space */
  77. --uc-win-ctrl-drag-space: 20px;
  78. }
  79.  
  80. /* setting the padding value for all button combinations */
  81. @media (-moz-gtk-csd-minimize-button),
  82. (-moz-gtk-csd-maximize-button),
  83. (-moz-gtk-csd-close-button) {
  84. #nav-bar {
  85. --uc-navbar-padding: calc(var(--uc-win-ctrl-btn-width) * 1);
  86. }
  87. }
  88.  
  89. @media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button),
  90. (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button),
  91. (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
  92. #nav-bar {
  93. --uc-navbar-padding: calc(var(--uc-win-ctrl-btn-width) * 2);
  94. }
  95. }
  96.  
  97. @media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) {
  98. #nav-bar {
  99. --uc-navbar-padding: calc(var(--uc-win-ctrl-btn-width) * 3);
  100. }
  101. }
  102.  
  103. /* only applies padding/positioning if there is 1 or more buttons */
  104. @media (-moz-gtk-csd-minimize-button),
  105. (-moz-gtk-csd-maximize-button),
  106. (-moz-gtk-csd-close-button) {
  107. /* window controls on the right */
  108. @media not (-moz-gtk-csd-reversed-placement) {
  109. #nav-bar {
  110. padding-inline: 0 calc(var(--uc-navbar-padding, 0) + var(--uc-win-ctrl-padding) + var(--uc-win-ctrl-drag-space)) !important;
  111. }
  112.  
  113. .titlebar-buttonbox-container {
  114. right: 0;
  115. }
  116. }
  117.  
  118. /* window controls on the left */
  119. @media (-moz-gtk-csd-reversed-placement) {
  120. #nav-bar {
  121. padding-inline: calc(var(--uc-navbar-padding, 0) + var(--uc-win-ctrl-padding) + var(--uc-win-ctrl-drag-space)) 0 !important;
  122. }
  123.  
  124. .titlebar-buttonbox-container {
  125. left: 0;
  126. }
  127. }
  128. }
  129.  
  130. /* Hide window buttons in fullscreen */
  131. #navigator-toolbox[style*="margin-top: -"] .titlebar-buttonbox-container,
  132. [inDOMFullscreen="true"] .titlebar-buttonbox-container {
  133. transform: translateY(-100px)
  134. }
  135.  
  136.  
  137. }
  138.  
  139. /* Windows specific styles */
  140. @media (-moz-platform: windows),
  141. (-moz-platform: windows-win10) {
  142. /* Hide main tabs toolbar */
  143. :root[tabsintitlebar]{
  144. --uc-window-control-width: 137px; /* Space at the right of nav-bar for window controls */
  145. /* --uc-window-drag-space-width: 24px; */ /* To add extra window drag space in nav-bar */
  146. }
  147.  
  148. #nav-bar{
  149. border-inline: var(--uc-window-drag-space-width,80px) solid var(--toolbar-bgcolor) ;
  150. border-inline-style: solid !important;
  151. border-right-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-width,0px));
  152.  
  153. padding-top: .5px !important; /* This makes it possible to drag the maximized window. */
  154. margin-left: -80px; /* Removes the space left when hiding .titlebar-buttonbox-container */
  155. }
  156.  
  157. #back-button {
  158. margin-top: -.5px !important;
  159. }
  160.  
  161. #forward-button {
  162. margin-top: -.5px !important;
  163. }
  164.  
  165. #reload-button {
  166. margin-top: -.5px !important;
  167. }
  168.  
  169. #PanelUI-button {
  170. margin-top: -.5px !important;
  171. }
  172.  
  173. #nav-bar-overflow-button{
  174. margin-top: -.5px !important;
  175. }
  176.  
  177. :root {
  178. --uc-toolbar-height: 32px;
  179. --chrome-content-separator-color: none !important;
  180. }
  181.  
  182. :root:not([uidensity="compact"]) {
  183. --uc-toolbar-height: 38px;
  184. }
  185.  
  186. #TabsToolbar {
  187. visibility: collapse !important;
  188. }
  189.  
  190. /* Hide the Windows controls on the left side. */
  191. #TabsToolbar .titlebar-buttonbox-container {
  192. visibility: hidden !important;
  193. }
  194. /* Line up the Windows controls with the rest of the icons in the toolbar. */
  195. :root:not([sizemode="maximized"]) .titlebar-buttonbox-container {
  196. margin-top: 3px;
  197. }
  198.  
  199.  
  200. :root:not([inFullscreen]) #nav-bar {
  201. margin-top: calc(0px - var(--uc-toolbar-height));
  202. z-index: 2;
  203. }
  204.  
  205. #toolbar-menubar {
  206. min-height: unset !important;
  207. height: var(--uc-toolbar-height) !important;
  208. position: relative;
  209. }
  210.  
  211. /* For a rounded button design, uncomment both lines in .titlebar-buttonbox. */
  212. .titlebar-buttonbox {
  213. z-index:3 !important;
  214. /* padding-right:3px; */
  215. }
  216.  
  217. .titlebar-buttonbox * {
  218. /* border-radius: 5px; */
  219. width:35px;
  220. height:38px;
  221. }
  222.  
  223. #main-menubar {
  224. -moz-box-flex: 1;
  225. background-color: var(--toolbar-bgcolor,--toolbar-non-lwt-bgcolor);
  226. background-clip: padding-box;
  227. border-right: 30px solid transparent;
  228. border-image: linear-gradient(to left, transparent, var(--toolbar-bgcolor,--toolbar-non-lwt-bgcolor) 30px) 20 / 30px;
  229. }
  230.  
  231. #toolbar-menubar:not([inactive]) {
  232. z-index: 2;
  233. }
  234.  
  235. #toolbar-menubar[inactive] > #menubar-items {
  236. opacity: 0;
  237. pointer-events: none;
  238. margin-left: var(--uc-window-drag-space-width,0px);
  239. }
  240.  
  241. :root[inFullscreen] #nav-bar {
  242. border-right: none !important;
  243. }
  244. }
  245.  
  246.  
  247. /* General styles */
  248. #browser {
  249. position: relative;
  250. }
  251.  
  252. #nav-bar, #urlbar {
  253. z-index: 100;
  254. }
  255.  
  256. #sidebar-box:not([lwt-sidebar]){
  257. appearance: unset !important;
  258. }
  259.  
  260. #sidebar-box[sidebarcommand*="tabcenter"] {
  261. z-index: 3;
  262. }
  263.  
  264. #sidebar-box[sidebarcommand*="tabcenter"] #sidebar-header {
  265. visibility: collapse;
  266. display: none;
  267. }
  268.  
  269. [sidebarcommand*="tabcenter"] #sidebar,
  270. #sidebar-box[sidebarcommand*="tabcenter"] {
  271. display: block !important;
  272. min-width: 48px !important;
  273. max-width: 48px !important;
  274. width: 48px;
  275. }
  276.  
  277. #sidebar-box[sidebarcommand*="tabcenter"]:not([hidden]) {
  278. display: block;
  279. position: var(--positionX2);
  280. min-width: 48px;
  281. max-width: 48px;
  282. overflow: hidden;
  283. border-right: 1px solid var(--sidebar-border-color);
  284. z-index: 3;
  285. top: 0;
  286. bottom: 0;
  287. }
  288.  
  289. /* use :where() selector to lower specificity */
  290. :where(#main-window[inFullscreen]) #sidebar-box[sidebarcommand*="tabcenter"]:not([hidden]) {
  291. min-width: var(--fullscreen-sidebar-width) !important;
  292. max-width: var(--fullscreen-sidebar-width) !important;
  293. }
  294.  
  295. #sidebar-box[sidebarcommand*="tabcenter"]:hover #sidebar,
  296. #sidebar-box[sidebarcommand*="tabcenter"]:hover {
  297. min-width: 10vw !important;
  298. width: 30vw !important;
  299. max-width: 200px !important;
  300. z-index: 3 !important;
  301. transition: all var(--transition-time) ease var(--delay);
  302. }
  303.  
  304. /* used for delay function */
  305. #sidebar-box[sidebarcommand*="tabcenter"]:not(:hover) #sidebar,
  306. #sidebar-box[sidebarcommand*="tabcenter"]:not(:hover) {
  307. transition: all var(--transition-time) ease 0s;
  308. }
  309.  
  310. @media (width >= 1200px) {
  311. #sidebar-box[sidebarcommand*="tabcenter"]:hover #sidebar,
  312. #sidebar-box[sidebarcommand*="tabcenter"]:hover {
  313. max-width: 250px !important;
  314. }
  315. }
  316.  
  317. [sidebarcommand*="tabcenter"] ~ #sidebar-splitter {
  318. display: none;
  319. }
  320.  
  321. [sidebarcommand*="tabcenter"] #sidebar {
  322. max-height: 100%;
  323. height: 100%;
  324. }
  325.  
  326. #main-window:not([inFullscreen]) #sidebar-box[sidebarcommand*="tabcenter"]:not([hidden]) ~ #tabbrowser-tabbox {
  327. margin-left: var(--positionX1) !important;
  328. }
  329.  
  330. #main-window[inFullscreen]:not([inDOMFullscreen]) #sidebar-box[sidebarcommand*="tabcenter"]:not([hidden]) ~ #tabbrowser-tabbox {
  331. margin-left: var(--fullscreen-sidebar-width) !important;
  332. }
  333.  
  334. #main-window[inFullscreen] #sidebar {
  335. height: 100vh;
  336. }
  337.  
  338. [sidebarcommand*="tabcenter"] #sidebar-header {
  339. background: #0C0C0D;
  340. border-bottom: none !important;
  341. }
  342.  
  343. [sidebarcommand*="tabcenter"] ~ #sidebar-splitter {
  344. border-right-color: #0C0C0D !important;
  345. border-left-color: #0C0C0D !important;
  346. }
  347.  
  348. [sidebarcommand*="tabcenter"] #sidebar-switcher-target,
  349. [sidebarcommand*="tabcenter"] #sidebar-close {
  350. filter: invert(100%);
  351. }
  352.  
  353. @media (max-width: 630px) {
  354. #urlbar-container {
  355. min-width: 100% !important;
  356. }
  357.  
  358. #menubar-items {
  359. display: none !important;
  360. }
  361. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!