Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-14 08:42:08 +10:00
Code Issues Packages Projects Releases Wiki Activity

add mouse wheel scroll into tabBar

Browse Source
This commit is contained in:
Dong Qian
2020-04-01 10:31:54 -04:00
parent 400dd68b8e
commit 5cd66b593f
1 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/shared/TabBar.js
View File

@ -16,6 +16,8 @@ const TabBar = ({ tabs, currentTab, setCurrentTab }) => {
} }
}; };
const wheelScrollBy = e => scrollBy(e.deltaY);
return ( return (
<div className="mx-4 mb-6 flex items-center"> <div className="mx-4 mb-6 flex items-center">
<div <div
@ -25,7 +27,7 @@ const TabBar = ({ tabs, currentTab, setCurrentTab }) => {
<i className="material-icons">chevron_left</i> <i className="material-icons">chevron_left</i>
</div> </div>
<ul id="tabs" ref={tabsRef} className="flex overflow-x-scroll"> <ul id="tabs" ref={tabsRef} className="flex overflow-x-scroll" onWheel={wheelScrollBy}>
{tabs.map(tab => {tabs.map(tab =>
currentTab === tab.key ? ( currentTab === tab.key ? (
<li key={tab.key} className="mx-1 list-none"> <li key={tab.key} className="mx-1 list-none">