Advertisement
wojtekadams

CSS FF 113 Multi rows + tab on bootom

Jun 16th, 2023
800
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 4.97 KB | None | 0 0
  1. /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/multi-row_bookmarks.css made available under Mozilla Public License v. 2.0
  2. See the above repository for updates as well as full license text. */
  3.  
  4. /* Makes bookmarks toolbar span multiple rows */
  5.  
  6. #PersonalToolbar{
  7.   --multirow-bmb-n-rows: 3; /* Control how many rows are shown before scrolling */
  8.   --multirow-bmb-row-margin: 2px; /* Control how much spacing is between rows */
  9.   max-height: none !important;
  10. }
  11.  
  12. #PlacesToolbar > hbox:not(#PlacesToolbarDropIndicatorHolder){
  13.   display: block;
  14.   width: 100vw;
  15. }
  16.  
  17. #PlacesToolbarItems{
  18.   display: flex;
  19.   flex-wrap: wrap;
  20.   /* --uc-bm-padding is defined in autohide_bookmarks_toolbar.css */
  21.   max-height: calc(var(--multirow-bmb-n-rows) * (4px + 1em + (2 * (var(--multirow-bmb-row-margin) + var(--uc-bm-padding,var(--bookmark-block-padding)))))) !important;
  22.   overflow-y:auto;
  23.   scrollbar-color: var(--lwt-accent-color) var(--toolbar-bgcolor);
  24.   scrollbar-gutter: stable;
  25.   scrollbar-width: thin;
  26. }
  27.  
  28. /* Hide the all-bookmarks button */
  29. #PlacesChevron{ display: none }
  30.  
  31. /* Add some spacing between rows */
  32. #PlacesToolbarItems > .bookmark-item{
  33.   margin: var(--multirow-bmb-row-margin) 3px !important;
  34.   visibility: visible !important; /* Just in case they would be hidden for some reason */
  35. }
  36.  
  37.  
  38.  
  39. /* Source file https://github.com/COOLak/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
  40. See the above repository for updates as well as full license text. */
  41.  
  42. /* Modify to change window drag space width */
  43.  
  44. /* IMPORTANT */
  45. /*
  46. Get window_control_placeholder_support.css
  47. Window controls will be all wrong without it.
  48. Additionally on Linux, you may need to get:
  49. linux_gtk_window_control_patch.css
  50. */
  51.  
  52. :root{ --uc-titlebar-padding: 0px; }
  53. @media (-moz-os-version: windows-win10){
  54. :root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
  55. }
  56. #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
  57. #TabsToolbar > .titlebar-buttonbox-container{
  58. position: fixed;
  59. display: block;
  60. top: var(--uc-titlebar-padding,0px);
  61. right:0;
  62. height: 40px;
  63. }
  64. /* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
  65. @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
  66. :root{ --uc-titlebar-padding: 0px !important }
  67. .titlebar-buttonbox-container{ left:0; right: unset !important; }
  68. }
  69.  
  70. :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }
  71.  
  72. #toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }
  73.  
  74. #navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }
  75.  
  76. .titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }
  77.  
  78. #titlebar{
  79. order: 2;
  80. appearance: none !important;
  81. --tabs-navbar-shadow-size: 0px;
  82. }
  83.  
  84. .titlebar-placeholder,
  85. #TabsToolbar .titlebar-spacer{ display: none; }
  86. /* Also hide the toolbox bottom border which isn't at bottom with this setup */
  87. #navigator-toolbox::after{ display: none !important; }
  88.  
  89. @media (-moz-gtk-csd-close-button){ .titlebar-button{ -flex-direction: column } }
  90.  
  91. /* These exist only for compatibility with autohide-tabstoolbar.css */
  92. toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
  93. #navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }
  94.  
  95. /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
  96. See the above repository for updates as well as full license text. */
  97.  
  98. /* Menubar on top patch - use with tabs_on_bottom.css */
  99. /* Only really useful if menubar is ALWAYS visible */
  100.  
  101. :root{ --uc-window-control-width: 0px !important }
  102.  
  103. #navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }
  104.  
  105. #toolbar-menubar{
  106. position: fixed;
  107. display: flex;
  108. top: var(--uc-titlebar-padding,0px);
  109. height: 29px;
  110. width: 100%;
  111. overflow: hidden;
  112. }
  113.  
  114. #toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }
  115.  
  116. #toolbar-menubar > [flex]{ flex-grow: 100; }
  117. #toolbar-menubar > spacer[flex]{
  118. order: 99;
  119. flex-grow: 1;
  120. min-width: var(--uc-window-drag-space-width,20px);
  121. }
  122.  
  123. #toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }
  124.  
  125. #toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }
  126.  
  127. /* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/
  128. --tab-min-width: 80px !important; /*adjust to set width or omit to use default*/
  129.  
  130. #tabbrowser-tabs {
  131. width: 100vw !important;
  132. }
  133. #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}
  134.  
  135. .tab-background {
  136. border-radius: 8px 8px 0px 0px !important; border-image: none !important;
  137. }
  138. .tab-line {
  139. display: none;
  140. }
  141.  
  142. .tab-close-button {
  143. color: red!important;
  144. }
  145.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement