Adding border to tabs (#6284)

* Adding border to tabs

* Fix rounded

* Fixing mb on >= lg
pull/6251/head
sean-brydon 2023-01-05 17:14:27 +00:00 committed by GitHub
parent 47fe791006
commit 0141d8f954
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 3 deletions

View File

@ -27,7 +27,7 @@ const HorizontalTabItem = function ({ name, href, linkProps, ...props }: Horizon
<a
className={classNames(
isCurrent ? "bg-gray-200 text-gray-900" : " text-gray-600 hover:bg-gray-100 hover:text-gray-900 ",
"mb-2 inline-flex items-center justify-center whitespace-nowrap rounded-md py-[10px] px-4 text-sm font-medium leading-4 md:mb-0",
"inline-flex items-center justify-center whitespace-nowrap rounded-[4px] py-[10px] px-4 text-sm font-medium leading-4 md:mb-0",
props.disabled && "pointer-events-none !opacity-30",
props.className
)}

View File

@ -10,8 +10,8 @@ export interface NavTabProps {
const HorizontalTabs = function ({ tabs, linkProps, actions, ...props }: NavTabProps) {
return (
<div className="-mx-6 mb-2 w-[calc(100%+40px)]">
<nav className="no-scrollbar flex space-x-1 overflow-scroll px-6" aria-label="Tabs" {...props}>
<div className="mb-2 max-w-[calc(100%+40px)] lg:mb-5">
<nav className="no-scrollbar flex overflow-scroll rounded-md border p-1" aria-label="Tabs" {...props}>
{tabs.map((tab, idx) => (
<HorizontalTabItem {...tab} key={idx} {...linkProps} />
))}