diff --git a/src/components/layout/TopTabsSection/TopTabs.tsx b/src/components/layout/TopTabsSection/TopTabs.tsx index ba5bc55..4c4ec30 100644 --- a/src/components/layout/TopTabsSection/TopTabs.tsx +++ b/src/components/layout/TopTabsSection/TopTabs.tsx @@ -110,19 +110,20 @@ export default function TopTabs({ data, activeIndex, setActiveIndex, className } return ( -
+
+ {canScrollLeft && ( + + )}
- {canScrollLeft && ( - - )} +
))}
- {canScrollRight && ( - - )} +
+ {canScrollRight && ( + + )}
); } diff --git a/src/components/layout/TopTabsSection/index.module.css b/src/components/layout/TopTabsSection/index.module.css index ed3e0d7..5b8eaf8 100644 --- a/src/components/layout/TopTabsSection/index.module.css +++ b/src/components/layout/TopTabsSection/index.module.css @@ -15,7 +15,7 @@ line-height: 2.125rem; /* border-bottom: .0625rem solid #D5D8DC; */ width: 100%; - overflow: hidden; + /* overflow: hidden; */ } .topTabsNavBtn { @@ -42,11 +42,11 @@ } .topTabsNavBtnLeft { - left: 0rem; + left: -80px; } .topTabsNavBtnRight { - right: 0rem; + right: -80px; } .topTabsTabsScroll { @@ -54,7 +54,9 @@ display: flex; flex-direction: row; flex-wrap: nowrap; - gap: 8.125rem; + padding: 0 20px; + gap: 70px; + /* gap: 8.125rem; */ height: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; @@ -69,7 +71,7 @@ .topTabsTabsScrollCenter { justify-content: center; - /* gap: 130px; */ + gap: 8.125rem; } .topTabsBottomLine { diff --git a/src/pages/Social/Foundation.tsx b/src/pages/Social/Foundation.tsx index a49d236..0dbc021 100644 --- a/src/pages/Social/Foundation.tsx +++ b/src/pages/Social/Foundation.tsx @@ -71,8 +71,8 @@ export default function Foundation() { return (
} - subtitle={banner?.title ?? ""} + icon={banner?.icon && } + largedesc={banner?.title ?? ""} content={(banner as BannerConfig)?.content} titleSize={(banner as BannerConfig)?.titleSize ?? "medium"} backgroundImage={banner?.backgroundImage ?? "/images/bg-overview.png"}