diff --git a/README.md b/README.md index 6cfb4f7..1f9e856 100644 --- a/README.md +++ b/README.md @@ -23,6 +23,7 @@ It works in the new Proton UI and alongside any themes. You can configure the fo | --- | --- | | `xpinstall.signatures.required` | `false` [(Why?)](#why-cant-i-install-paxmod-as-a-verified-extension-through-mozilla) | | `extensions.experiments.enabled` | `true` | + | `browser.tabs.groups.enabled` | `false` (Does not work with drag-and-drop)| - Install Paxmod. (Download the `.xpi` file from [here](https://github.com/numirias/paxmod/releases/latest) and load it in Firefox.) diff --git a/src/browser.css b/src/browser.css index fbb5ff1..fde7d6f 100644 --- a/src/browser.css +++ b/src/browser.css @@ -9,6 +9,11 @@ display: none !important; } +#pinned-drop-indicator { + /* Hide pinned indicator since it won't pin anyways */ + display: none !important; +} + #TabsToolbar #tabs-newtab-button { margin: 0 !important; display: var(--paxmod-display-newtab) !important; @@ -20,6 +25,8 @@ #tabbrowser-tabs { /* No padding, even when some tabs are pinned (see GH-88) */ padding-inline: 0 !important; + + min-height: 0 !important; } #tabbrowser-arrowscrollbox::part(scrollbox-clip) { @@ -40,7 +47,7 @@ display: none !important; } -#tabbrowser-arrowscrollbox::part(scrollbox) { +#tabbrowser-arrowscrollbox::part(items-wrapper) { width: 100% !important; display: flex !important; flex-wrap: wrap !important; @@ -60,8 +67,11 @@ width: var(--paxmod-tab-size) !important; min-width: var(--paxmod-min-tab-size) !important; max-width: var(--paxmod-max-tab-size) !important; + left: 0 !important; + /* Explicit min-height rule is only needed for non-Proton UI */ min-height: var(--tab-min-height) !important; + height: var(--tab-min-height) !important; flex-grow: 1; /* Can't completely disable transitions, otherwise tabs have small pixel * offsets after closing some tabs */ @@ -70,6 +80,10 @@ scroll-margin: var(--tab-min-height) !important; } +.tabbrowser-tab[dragtarget=""] { + opacity: 0; +} + .tabbrowser-tab .tab-label-container { /* Unset fixed label height to allow smaller tab min height */ height: initial !important; @@ -98,7 +112,7 @@ } /* Need specific selector here to overrule !important from browser style */ -#titlebar #tabbrowser-tabs > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned] { +#navigator-toolbox #tabbrowser-tabs > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned] { flex-grow: 0 !important; width: initial !important; min-width: initial !important; @@ -117,12 +131,12 @@ /********** Titlebar **********/ -:root[tabsintitlebar] #titlebar .titlebar-buttonbox-container { +#navigator-toolbox .titlebar-buttonbox-container { /* Give users an option to hide the min/max/close buttions */ display: var(--paxmod-titlebar-display); } -:root[tabsintitlebar] #titlebar .titlebar-buttonbox { +#navigator-toolbox .titlebar-buttonbox { /* Otherwise, the inline min/max/close buttons on Windows (and maybe MacOS) * will stretch to the full height of multiple tab rows */ display: inline-block; diff --git a/src/paxmod-api-experiment/api.js b/src/paxmod-api-experiment/api.js index 92c4d0c..950e91d 100644 --- a/src/paxmod-api-experiment/api.js +++ b/src/paxmod-api-experiment/api.js @@ -35,7 +35,7 @@ function patch(win) { console.warn('Paxmod: tab box not found in this win') return } - if (tabsProto._positionPinnedTabs_orig) { + if (tabsProto.on_drop_orig) { console.warn('Paxmod: tab box already patched in this win') return } @@ -58,22 +58,30 @@ function patch(win) { tabsProto[name + '_orig'] = tabsProto[name] tabsProto[name] = f } - patchMethod('_positionPinnedTabs', function() { - this._positionPinnedTabs_orig() - // Remove visual offset of pinned tabs - this.style.paddingInlineStart = '' - for (let tab of this.allTabs) { - tab.style.marginInlineStart = '' - } - }) + // patchMethod('_positionPinnedTabs', function() { + // this._positionPinnedTabs_orig() + // // Remove visual offset of pinned tabs + // this.style.paddingInlineStart = '' + // for (let tab of this.allTabs) { + // tab.style.marginInlineStart = '' + // } + // }) patchMethod('on_drop', function(event) { let dt = event.dataTransfer if (dt.dropEffect !== 'move') { return this.on_drop_orig(event) } let draggedTab = dt.mozGetDataAt('application/x-moz-tabbrowser-tab', 0) - draggedTab._dragData.animDropIndex = dropIndex(this.allTabs, event) - return this.on_drop_orig(event) + // draggedTab._dragData.animDropIndex = dropIndex(this.allTabs, event) + var val = dropIndex(this.allTabs, event); + + var movingTabs = draggedTab._dragData.movingTabs; + movingTabs?.reverse(); + for (let tab of movingTabs) { + win.gBrowser.moveTabTo(tab, {elementIndex: val}, null); + } + // return this.on_drop_orig(event) + return; }) patchMethod('on_dragover', function(event) { let dt = event.dataTransfer @@ -83,6 +91,7 @@ function patch(win) { let draggedTab = dt.mozGetDataAt('application/x-moz-tabbrowser-tab', 0) let movingTabs = draggedTab._dragData.movingTabs draggedTab._dragData.animDropIndex = dropIndex(this.allTabs, event) + // var val = dropIndex(this.allTabs, event); this.on_dragover_orig(event) // Reset rules that visualize dragging because they don't work in multi-row for (let tab of this.allTabs) { @@ -95,7 +104,7 @@ function patch(win) { this.setAttribute('overflow', 'true') this._handleTabSelect_orig(aInstant) }) - win.document.querySelector('#tabbrowser-tabs')._positionPinnedTabs() + // win.document.querySelector('#tabbrowser-tabs')._positionPinnedTabs() // Make sure the arrowscrollbox doesn't swallow mouse wheel events, so they // get propagated to the tab list, allowing the user to scroll up and down let arrowscrollbox = win.document.querySelector('#tabbrowser-arrowscrollbox') @@ -104,11 +113,23 @@ function patch(win) { } else { console.warn('Paxmod: arrowscrollbox not found') } + + // fix arrowscrollbox > scrollbox part > slot so that it has a part name + if (arrowscrollbox) { + let scrollboxFlexbox = arrowscrollbox.shadowRoot.querySelector('scrollbox > slot') + if (scrollboxFlexbox) { + scrollboxFlexbox.setAttribute('part', 'items-wrapper') + } else { + console.warn('Paxmod: scrollbox flexbox not found') + } + } else { + console.warn('Paxmod: arrowscrollbox not found') + } } function unpatch(win) { var tabsProto = win.customElements.get('tabbrowser-tabs').prototype - if (!tabsProto._positionPinnedTabs_orig) { + if (!tabsProto.on_drop_orig) { console.warn('Paxmod: tab box not patched') return } @@ -116,7 +137,7 @@ function unpatch(win) { tabsProto[name] = tabsProto[name + '_orig'] delete tabsProto[name + '_orig'] } - unpatchMethod('_positionPinnedTabs') + // unpatchMethod('_positionPinnedTabs') unpatchMethod('on_drop') unpatchMethod('on_dragover') unpatchMethod('_handleTabSelect')