hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Adding shadow corners to scrollable area

Browse Source 
Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2022-03-15 10:03:54 +03:00
parent 45644fe5ab
commit 5c4f29445c
2 changed files with 21 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/renderer/components/dock/dock-tabs.module.scss
View File

@ -29,6 +29,25 @@
background-color: rgba(106, 115, 125, 0.2);
}
}
> div {
&::before, &::after {
content: "\00A0";
position: sticky;
min-width: 8px;
z-index: 1;
}
&::before {
left: 0;
background: linear-gradient(270deg, transparent 0%, var(--dockHeadBackground) 65%);
}
&::after {
right: 0;
background: linear-gradient(90deg, transparent 0%, var(--dockHeadBackground) 65%);
}
}
}
> div {

4
src/renderer/components/dock/dock-tabs.tsx
View File

@ -47,8 +47,8 @@ export const DockTabs = ({ tabs, autoFocus, selectedTab, onChangeTab }: DockTabs
};
const updateScrollbarVisibility = () => {
const allTabs = Array.from(elem.current?.querySelectorAll(".Tabs .Tab"));
const allTabsShrinked = allTabs.every(tab => tab.clientWidth == minTabSize.current);
const allTabs: HTMLElement[] = Array.from(elem.current?.querySelectorAll(".Tabs .Tab"));
const allTabsShrinked = allTabs.every(tab => tab.offsetWidth == minTabSize.current);
setShowScrollbar(allTabsShrinked);
};