fix: tab group underline layout

Author: arunjaindev

src/Assets/IconV2/ic-info-filled.svg

@@ -35,7 +35,7 @@ const MotionLayoutUnderline = ({ layoutId }: { layoutId: string }) => (
             generatedTransform.replace(/translate3d\(([^,]+),\s*[^,]+,\s*([^)]+)\)/, 'translate3d($1, 0px, $2)')
         }
         layoutId={layoutId}
-        className="underline bcb-5"
+        className="underline bcb-5 w-100 dc__position-abs"
     />
 )
 
@@ -67,7 +67,6 @@ const Tab = ({
 
     const { tabClassName, iconClassName, badgeClassName } = getClassNameBySizeMap({
         hideTopPadding,
-        isTabActive,
     })[size]
 
     const onClickHandler = (

src/Shared/Components/TabGroup/TabGroup.component.tsx

@@ -37,6 +37,7 @@
             height: 2px !important;
             border-top-left-radius: 2px;
             border-top-right-radius: 2px;
+            bottom: -1px;
         }
 
         &--active {

src/Shared/Components/TabGroup/TabGroup.scss

@@ -21,8 +21,7 @@ import { TabGroupProps } from './TabGroup.types'
 
 export const getClassNameBySizeMap = ({
     hideTopPadding,
-    isTabActive,
-}: Pick<TabGroupProps, 'hideTopPadding'> & { isTabActive: boolean }): Record<
+}: Pick<TabGroupProps, 'hideTopPadding'>): Record<
     TabGroupProps['size'],
     {
         tabClassName: string
@@ -31,17 +30,17 @@ export const getClassNameBySizeMap = ({
     }
 > => ({
     [ComponentSizeType.medium]: {
-        tabClassName: `fs-12 ${!hideTopPadding ? 'pt-6' : ''} ${isTabActive ? 'pb-3' : 'pb-5'}`,
+        tabClassName: `fs-12 ${!hideTopPadding ? 'pt-6' : ''} pb-5`,
         iconClassName: 'icon-dim-14',
         badgeClassName: 'fs-11 lh-18 tab-group__tab__badge--medium',
     },
     [ComponentSizeType.large]: {
-        tabClassName: `fs-13 ${!hideTopPadding ? 'pt-8' : ''} ${isTabActive ? 'pb-5' : 'pb-7'}`,
+        tabClassName: `fs-13 ${!hideTopPadding ? 'pt-8' : ''} pb-7`,
         iconClassName: 'icon-dim-16',
         badgeClassName: 'fs-12 lh-20',
     },
     [ComponentSizeType.xl]: {
-        tabClassName: `min-w-200 fs-13 ${!hideTopPadding ? 'pt-10' : ''} ${isTabActive ? 'pb-7' : 'pb-9'}`,
+        tabClassName: `min-w-200 fs-13 ${!hideTopPadding ? 'pt-10' : ''} pb-9`,
         iconClassName: 'icon-dim-16',
         badgeClassName: 'fs-12 lh-20',
     },