Apply correct colors to the tabs, as per design

This commit is contained in:
Boro Sitnikovski 2024-09-11 17:28:43 +02:00
parent 44c29dd2f3
commit 1ae4d2fbbf
2 changed files with 17 additions and 3 deletions

View File

@ -46,8 +46,16 @@
z-index: 26;
}
&__update-count {
background-color: #000;
&__update-count-extensions,
&__update-count-themes,
&__update-count-business-services {
background-color: $gutenberg-gray-300;
color: $gutenberg-gray-700;
&.is-active {
background-color: #000;
color: #fff;
}
}
}

View File

@ -108,7 +108,13 @@ const renderTabs = (
{ tabs[ tabKey ]?.title }
{ tabs[ tabKey ]?.showUpdateCount && (
<span
className={ `woocommerce-marketplace__update-count woocommerce-marketplace__update-count-${ tabKey }` }
className={ clsx(
'woocommerce-marketplace__update-count',
`woocommerce-marketplace__update-count-${ tabKey }`,
{
'is-active': tabKey === selectedTab,
}
) }
>
<span> { tabs[ tabKey ]?.updateCount } </span>
</span>