1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Fix right button

Signed-off-by: DmitriyNoa <dmytro.zharkov@gmail.com>
This commit is contained in:
DmitriyNoa 2022-01-25 16:25:44 +01:00
parent d2b9cb27d7
commit f622348b6c
2 changed files with 8 additions and 5 deletions

View File

@ -27,7 +27,7 @@ export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: Props) =
const scrollStep = 200; const scrollStep = 200;
const scrollToRight = (): void => { const scrollToRight = (): void => {
if(!elem) return; if(!elem || scrollPosition + scrollStep > contentWidth) return;
const scroll = scrollPosition + scrollStep; const scroll = scrollPosition + scrollStep;
setScrollPosition(scroll); setScrollPosition(scroll);
@ -35,7 +35,6 @@ export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: Props) =
elem.current.scrollLeft = scroll; elem.current.scrollLeft = scroll;
}; };
const scrollToLeft = (): void => { const scrollToLeft = (): void => {
if(!elem) return; if(!elem) return;
const scroll = scrollPosition - scrollStep; const scroll = scrollPosition - scrollStep;
@ -57,7 +56,7 @@ export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: Props) =
return scrollPosition > scrollStep; return scrollPosition > scrollStep;
}; };
const updateScrollPosition = ( evt: UIEvent<HTMLDivElement>) => { const updateScrollPosition = ( evt: UIEvent<HTMLDivElement>): void => {
const position = evt.currentTarget.scrollLeft; const position = evt.currentTarget.scrollLeft;
if (position!== undefined) { if (position!== undefined) {
@ -65,7 +64,7 @@ export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: Props) =
} }
}; };
const onWindowResize = () => { const onWindowResize = (): void => {
if(!elem || !contentElem) return; if(!elem || !contentElem) return;
setContentWidth(contentElem.current.clientWidth); setContentWidth(contentElem.current.clientWidth);
@ -108,7 +107,7 @@ export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: Props) =
}, []); }, []);
return ( return (
<div style={{ overflow: "hidden" }} className={"flex gaps align-center"}> <div className={"tabs-wrapper flex gaps align-center"}>
{isScrollableLeft() && ( {isScrollableLeft() && (
<Icon <Icon
material="keyboard_arrow_left" material="keyboard_arrow_left"

View File

@ -58,6 +58,10 @@
} }
} }
.tabs-wrapper {
overflow: hidden;
}
.tab-content { .tab-content {
position: relative; position: relative;
flex: 1; flex: 1;