ionic-super-tabs icon indicating copy to clipboard operation
ionic-super-tabs copied to clipboard

supertabs and ion-split-pane

Open rodrigoGA opened this issue 4 years ago • 2 comments

If you use supertabs inside an ion-split-pane it takes 100% of the screen and not the content Please set --super-tab-width: 100%; as default value.

rodrigoGA avatar Jun 04 '20 04:06 rodrigoGA

Just to complement the rodrigoGA answer you need to add the --super-tab-width: 100%; to the super-tabs, like so:

super-tabs {
    --super-tab-width: 100%;
}

The documentation talks about the --super-tab-width css property only in the super-tab but to fix the problem with ion-split-pane you need to add that property to the super-tabs and not to super-tab.

Pacn91 avatar Oct 07 '20 09:10 Pacn91

There is problem in below condition in case of ion-split-pane i have corrected as below node_modules@ionic-super-tabs\core\dist\esm\super-tab-button_2.entry.js

async onTouchStart(ev) {
        if (!this.scrollable) {
            return;
        }
        this.debug('onTouchStart', ev);
        const coords = pointerCoord(ev);
        const vw = this.clientWidth;
	const actualXPositionForSplit = window.innerWidth >= 758 ? window.innerWidth - this.clientWidth : 0; //note this
        if (coords.x < this.leftThreshold || coords.x - actualXPositionForSplit > vw - this.rightThreshold) {
            // ignore this gesture, it started in the side menu touch zone	
            return;
        }
        this.initialCoords = coords;
        this.lastPosX = coords.x;
    }

nileshbandekar avatar Jun 11 '21 05:06 nileshbandekar