on master help sign in
fix centered tabs inset
3b2ce84Liam Fitzgerald
src/components/Tabs.js+6−4
@@ -8,7 +8,7 @@ export default function Tabs({
8 currentTab,
8 currentTab,
9 onTabChange,
9 onTabChange,
10 className,
10 className,
11− tabClassName,
11+ center = false,
12 ...rest
12 ...rest
13}) {
13}) {
14 const Tab = views[currentTab];
14 const Tab = views[currentTab];
@@ -26,17 +26,19 @@ export default function Tabs({
26 key={option.value}
26 key={option.value}
27 onClick={() => onTabChange(option.value)}
27 onClick={() => onTabChange(option.value)}
28 className={cn(
28 className={cn(
29− tabClassName,
30 'f5 pv3 pointer nowrap',
29 'f5 pv3 pointer nowrap',
31 {
30 {
32 'black b-black bb1': isActive,
31 'black b-black bb1': isActive,
33 gray3: !isActive,
32 gray3: !isActive,
34 },
33 },
34+ {
35+ 't-center flex1': center,
36+ },
35 {
37 {
36 // all items have right margin/padding
38 // all items have right margin/padding
37− 'mr2 pr2': true,
39+ 'mr2 pr2': !center,
38 // the first one is flush to the left
40 // the first one is flush to the left
39− 'ml2 pl2': !isFirst,
41+ 'ml2 pl2': !isFirst && !center,
40 }
42 }
41 )}>
43 )}>
42 {option.text}
44 {option.text}
src/views/Invite/Inviter.js+1−1
@@ -25,7 +25,7 @@ const Inviter = () => {
25 <Grid.Item
25 <Grid.Item
26 full
26 full
27 as={Tabs}
27 as={Tabs}
28− tabClassName="t-center flex1"
28+ center
29 className="flex1"
29 className="flex1"
30 views={VIEWS}
30 views={VIEWS}
31 options={OPTIONS}
31 options={OPTIONS}