diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx
index 45db0bf562b..c8f79e08b28 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DashboardDetails/DashboardDetails.component.tsx
@@ -670,6 +670,7 @@ const DashboardDetails = ({
                   entityName={dashboardDetails.name}
                   entityType={EntityType.DASHBOARD}
                   hasEditAccess={hasEditAccess()}
+                  manageSectionType={EntityType.DASHBOARD}
                   onSave={onSettingsUpdate}
                 />
               </div>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/DatasetDetails/DatasetDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/DatasetDetails/DatasetDetails.component.tsx
index bc69dbe273b..31dea3db052 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/DatasetDetails/DatasetDetails.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/DatasetDetails/DatasetDetails.component.tsx
@@ -741,6 +741,7 @@ const DatasetDetails: React.FC<DatasetDetailsProps> = ({
                   entityName={tableDetails.name}
                   entityType={EntityType.TABLE}
                   hasEditAccess={hasEditAccess()}
+                  manageSectionType={EntityType.TABLE}
                   onSave={onSettingsUpdate}
                 />
               </div>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.component.tsx
index d901290f7fa..2070f111fd2 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.component.tsx
@@ -26,8 +26,8 @@ import { useAuth } from '../../hooks/authHooks';
 import jsonData from '../../jsons/en';
 import { getOwnerList } from '../../utils/ManageUtils';
 import { showErrorToast } from '../../utils/ToastUtils';
-import CardListItem from '../card-list/CardListItem/CardWithListItems';
-import { CardWithListItems } from '../card-list/CardListItem/CardWithListItems.interface';
+import CardListItem from '../cardlist/CardListItem/CardWithListItem';
+import { CardWithListItems } from '../cardlist/CardListItem/CardWithListItem.interface';
 import DeleteWidget from '../common/DeleteWidget/DeleteWidget';
 import NonAdminAction from '../common/non-admin-action/NonAdminAction';
 import OwnerWidget from '../common/OwnerWidget/OwnerWidget';
@@ -167,37 +167,48 @@ const ManageTab: FunctionComponent<ManageProps> = ({
   };
 
   const getTierCards = () => {
-    if (!hideTier) {
-      return isLoadingTierData ? (
-        <Loader />
-      ) : (
-        <div className="tw-flex tw-flex-col" data-testid="cards">
-          {tierData.map((card, i) => (
-            <NonAdminAction
-              html={
-                <Fragment>
-                  <p>You need to be owner to perform this action</p>
-                  <p>Claim ownership from above </p>
-                </Fragment>
-              }
-              isOwner={hasEditAccess || Boolean(owner && !currentUser)}
-              key={i}
-              permission={Operation.UpdateTags}
-              position="left">
-              <CardListItem
-                card={card}
-                isActive={activeTier === card.id}
-                isSelected={card.id === currentTier}
-                tierStatus={statusTier}
-                onSave={handleTierSave}
-                onSelect={handleCardSelection}
-              />
-            </NonAdminAction>
-          ))}
-        </div>
-      );
-    } else {
+    return (
+      <div className="tw-flex tw-flex-col tw-mb-7" data-testid="cards">
+        {tierData.map((card, i) => (
+          <NonAdminAction
+            html={
+              <Fragment>
+                <p>You need to be owner to perform this action</p>
+                <p>Claim ownership from above </p>
+              </Fragment>
+            }
+            isOwner={hasEditAccess || Boolean(owner && !currentUser)}
+            key={i}
+            permission={Operation.UpdateTags}
+            position="left">
+            <CardListItem
+              card={card}
+              className={classNames(
+                'tw-mb-0 tw-shadow',
+                {
+                  'tw-rounded-t-md': i === 0,
+                },
+                {
+                  'tw-rounded-b-md ': i === tierData.length - 1,
+                }
+              )}
+              isActive={activeTier === card.id}
+              isSelected={card.id === currentTier}
+              tierStatus={statusTier}
+              onCardSelect={handleCardSelection}
+              onSave={handleTierSave}
+            />
+          </NonAdminAction>
+        ))}
+      </div>
+    );
+  };
+
+  const getTierWidget = () => {
+    if (hideTier) {
       return null;
+    } else {
+      return isLoadingTierData ? <Loader /> : getTierCards();
     }
   };
 
@@ -291,12 +302,12 @@ const ManageTab: FunctionComponent<ManageProps> = ({
       className="tw-max-w-3xl tw-mx-auto"
       data-testid="manage-tab"
       id="manageTabDetails">
-      <p className="tw-text-base tw-font-medium">
+      <p className="tw-text-base tw-font-medium tw-mt-2">
         Manage {manageSectionType ? manageSectionType : 'Section'}
       </p>
       <div
         className={classNames('tw-mt-2 tw-pb-4', {
-          'tw-border-b tw-border-separator tw-mb-4': !hideTier,
+          'tw-mb-3': !hideTier,
         })}>
         <OwnerWidget
           allowTeamOwner={allowTeamOwner}
@@ -316,7 +327,7 @@ const ManageTab: FunctionComponent<ManageProps> = ({
           teamJoinable={teamJoinable}
         />
       </div>
-      {getTierCards()}
+      {getTierWidget()}
       {getDeleteEntityWidget()}
     </div>
   );
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.test.tsx
index 836b8222db2..1e161ab665b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/ManageTab/ManageTab.test.tsx
@@ -68,7 +68,7 @@ const mockTierData = {
 
 const mockFunction = jest.fn().mockImplementation(() => Promise.resolve());
 
-jest.mock('../card-list/CardListItem/CardWithListItems', () => {
+jest.mock('../cardlist/CardListItem/CardWithListItem', () => {
   return jest.fn().mockReturnValue(<p data-testid="card">CardWithListItems</p>);
 });
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx
index d06f3dbfd91..d0a65dcf47c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/PipelineDetails/PipelineDetails.component.tsx
@@ -601,6 +601,7 @@ const PipelineDetails = ({
                   entityName={pipelineDetails.name}
                   entityType={EntityType.PIPELINE}
                   hasEditAccess={hasEditAccess()}
+                  manageSectionType={EntityType.PIPELINE}
                   onSave={onSettingsUpdate}
                 />
               </div>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx
index 5dece748b87..f024293c2ab 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/TopicDetails/TopicDetails.component.tsx
@@ -440,6 +440,7 @@ const TopicDetails: React.FC<TopicDetailsProps> = ({
                   entityName={topicDetails.name}
                   entityType={EntityType.TOPIC}
                   hasEditAccess={hasEditAccess()}
+                  manageSectionType={EntityType.TOPIC}
                   onSave={onSettingsUpdate}
                 />
               </div>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.interface.ts
similarity index 85%
rename from openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.interface.ts
rename to openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.interface.ts
index efd7d002186..83a16525e6d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.interface.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.interface.ts
@@ -11,6 +11,7 @@
  *  limitations under the License.
  */
 
+import { HTMLAttributes } from 'react';
 import { Status } from '../../ManageTab/ManageTab.interface';
 
 export type CardWithListItems = {
@@ -20,11 +21,11 @@ export type CardWithListItems = {
   title: string;
 };
 
-export type Props = {
+export interface Props extends HTMLAttributes<HTMLDivElement> {
   card: CardWithListItems;
   isActive: boolean;
   isSelected: boolean;
   tierStatus: Status;
   onSave: (updatedTier: string) => void;
-  onSelect: (cardId: string) => void;
-};
+  onCardSelect: (cardId: string) => void;
+}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.style.ts b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.style.ts
similarity index 80%
rename from openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.style.ts
rename to openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.style.ts
index 7f768ef5b9c..235a2cdb3dc 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.style.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.style.ts
@@ -12,15 +12,15 @@
  */
 
 export const cardStyle = {
-  base: 'tw-flex tw-flex-col tw-rounded-md tw-border tw-mb-4',
-  default: 'tw-border-main',
-  active: 'tw-border-primary-lite',
+  base: 'tw-flex tw-flex-col tw-border tw-bg-white',
+  default: 'tw-border-main tw-border-b-0',
+  active: 'tw-border-primary',
   selected: 'tw-border-primary',
   header: {
     base: 'tw-flex tw-px-5 tw-py-3 tw-cursor-pointer tw-justify-between tw-items-center',
-    default: 'tw-bg-badge',
-    active: 'tw-bg-primary-lite tw-rounded-t-md',
-    selected: 'tw-bg-primary tw-rounded-t-md tw-text-white',
+    default: '',
+    active: 'tw-bg-primary-lite tw-border-b tw-border-primary',
+    selected: 'tw-bg-primary tw-text-white',
     title: 'tw-text-base tw-mb-0',
     description: 'tw-font-medium tw-pr-2',
   },
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.test.tsx
similarity index 93%
rename from openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.test.tsx
rename to openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.test.tsx
index df77522bd54..62283267921 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.test.tsx
@@ -13,7 +13,7 @@
 
 import { fireEvent, render } from '@testing-library/react';
 import React from 'react';
-import CardListItem from './CardWithListItems';
+import CardListItem from './CardWithListItem';
 
 const mockSelectFunction = jest.fn();
 const mockSaveFuntion = jest.fn();
@@ -36,8 +36,8 @@ describe('Test CardWithListing Component', () => {
         isActive={false}
         isSelected={false}
         tierStatus="initial"
+        onCardSelect={mockSelectFunction}
         onSave={mockSaveFuntion}
-        onSelect={mockSelectFunction}
       />
     );
 
@@ -55,8 +55,8 @@ describe('Test CardWithListing Component', () => {
         isActive={false}
         isSelected={false}
         tierStatus="initial"
+        onCardSelect={mockSelectFunction}
         onSave={mockSaveFuntion}
-        onSelect={mockSelectFunction}
       />
     );
 
@@ -79,8 +79,8 @@ describe('Test CardWithListing Component', () => {
         card={mockCard}
         isSelected={false}
         tierStatus="initial"
+        onCardSelect={mockSelectFunction}
         onSave={mockSaveFuntion}
-        onSelect={mockSelectFunction}
       />
     );
 
@@ -107,8 +107,8 @@ describe('Test CardWithListing Component', () => {
         card={mockCard}
         isSelected={false}
         tierStatus="initial"
+        onCardSelect={mockSelectFunction}
         onSave={mockSaveFuntion}
-        onSelect={mockSelectFunction}
       />
     );
 
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.tsx b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.tsx
similarity index 70%
rename from openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.tsx
rename to openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.tsx
index f811d405d60..9a0ad17ad3d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/card-list/CardListItem/CardWithListItems.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/cardlist/CardListItem/CardWithListItem.tsx
@@ -17,52 +17,58 @@ import React, { FunctionComponent } from 'react';
 import { Button } from '../../buttons/Button/Button';
 import RichTextEditorPreviewer from '../../common/rich-text-editor/RichTextEditorPreviewer';
 import Loader from '../../Loader/Loader';
-import { Props } from './CardWithListItems.interface';
-import { cardStyle } from './CardWithListItems.style';
+import { Props } from './CardWithListItem.interface';
+import { cardStyle } from './CardWithListItem.style';
 
 const CardListItem: FunctionComponent<Props> = ({
   card,
   isActive,
   isSelected,
-  onSelect,
+  onCardSelect,
   onSave,
   tierStatus,
+  className,
 }: Props) => {
   const getCardBodyStyle = () => {
-    return isSelected
-      ? cardStyle.selected
-      : isActive
-      ? cardStyle.active
-      : cardStyle.default;
+    const activeStyle = isActive ? cardStyle.active : cardStyle.default;
+
+    return isSelected ? cardStyle.selected : activeStyle;
   };
 
   const getCardHeaderStyle = () => {
-    return isSelected
-      ? cardStyle.header.selected
-      : isActive
+    const activeHeaderStyle = isActive
       ? cardStyle.header.active
       : cardStyle.header.default;
+
+    return isSelected ? cardStyle.header.selected : activeHeaderStyle;
   };
 
   const getTierSelectButton = (tier: string) => {
-    return tierStatus === 'waiting' ? (
-      <Loader
-        className="tw-inline-block"
-        size="small"
-        style={{ marginBottom: '-4px' }}
-        type="default"
-      />
-    ) : tierStatus === 'success' ? (
-      <FontAwesomeIcon icon="check" />
-    ) : (
-      <Button
-        data-testid="select-tier-buuton"
-        size="small"
-        theme="primary"
-        onClick={() => onSave(tier)}>
-        Select
-      </Button>
-    );
+    switch (tierStatus) {
+      case 'waiting':
+        return (
+          <Loader
+            className="tw-inline-block"
+            size="small"
+            style={{ marginBottom: '-4px' }}
+            type="default"
+          />
+        );
+
+      case 'success':
+        return <FontAwesomeIcon icon="check" />;
+
+      default:
+        return (
+          <Button
+            data-testid="select-tier-buuton"
+            size="small"
+            theme="primary"
+            onClick={() => onSave(tier)}>
+            Select
+          </Button>
+        );
+    }
   };
 
   const getCardIcon = (cardId: string) => {
@@ -77,11 +83,15 @@ const CardListItem: FunctionComponent<Props> = ({
     }
   };
 
+  const handleCardSelect = () => {
+    onCardSelect(card.id);
+  };
+
   return (
     <div
-      className={classNames(cardStyle.base, getCardBodyStyle())}
+      className={classNames(cardStyle.base, getCardBodyStyle(), className)}
       data-testid="card-list"
-      onClick={() => onSelect(card.id)}>
+      onClick={handleCardSelect}>
       <div className={classNames(cardStyle.header.base, getCardHeaderStyle())}>
         <div className="tw-flex">
           <div className="tw-self-start tw-mr-2">
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx
index be248556b63..8ad43a116fb 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/DatabaseSchemaPage.component.tsx
@@ -693,6 +693,7 @@ const DatabaseSchemaPage: FunctionComponent = () => {
                       databaseSchema?.owner?.type || '',
                       databaseSchema?.owner?.id || ''
                     )}
+                    manageSectionType={EntityType.DATABASE_SCHEMA}
                     onSave={handleUpdateOwner}
                   />
                 )}
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/database-details/index.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/database-details/index.tsx
index e4aea3d1a5c..4179b105e45 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/database-details/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/database-details/index.tsx
@@ -802,6 +802,7 @@ const DatabaseDetails: FunctionComponent = () => {
                       database?.owner?.type || '',
                       database?.owner?.id || ''
                     )}
+                    manageSectionType={EntityType.DATABASE}
                     onSave={handleUpdateOwner}
                   />
                 )}
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/service/index.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/service/index.tsx
index b8c43ed7d67..b12ac830abd 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/service/index.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/service/index.tsx
@@ -1000,6 +1000,7 @@ const ServicePage: FunctionComponent = () => {
                         serviceDetails?.owner?.type || '',
                         serviceDetails?.owner?.id || ''
                       )}
+                      manageSectionType={serviceCategory.slice(0, -1)}
                       onSave={handleUpdateOwner}
                     />
                   </div>