[issues-5528] UI improvements (#5629)

openmetadata-ui/src/main/resources/ui/src/components/AddService/AddService.component.tsx

@@ -265,6 +265,8 @@ const AddService = ({
   };
 
   return (
+    <div className="tw-self-center">
+      {' '}
       <PageLayout
         classes="tw-max-w-full-hd tw-h-full tw-pt-4"
         header={<TitleBreadcrumb titleLinks={slashedBreadcrumb} />}
@@ -297,6 +299,7 @@ const AddService = ({
           )}
         </div>
       </PageLayout>
+    </div>
   );
 };
 

openmetadata-ui/src/main/resources/ui/src/components/Explore/Explore.component.tsx

@@ -657,8 +657,8 @@ const Explore: React.FC<ExploreProps> = ({
 
   const fetchLeftPanel = () => {
     return (
-      <div className="tw-h-full">
       <Card
+        className="tw-h-full"
         data-testid="data-summary-container"
         style={{ ...leftPanelAntCardStyle, marginTop: '16px' }}>
         <Fragment>
@@ -688,7 +688,6 @@ const Explore: React.FC<ExploreProps> = ({
           )}
         </Fragment>
       </Card>
-      </div>
     );
   };
 

openmetadata-ui/src/main/resources/ui/src/components/ServiceConfig/ServiceConfig.tsx

@@ -87,7 +87,7 @@ const ServiceConfig = ({
   return (
     <div className="tw-bg-white tw-h-full">
       <div
-        className="tw-max-w-xl tw-mx-auto tw-pb-6"
+        className="tw-max-w-xl tw-pb-6"
         data-testid="service-config"
         id="serviceConfig">
         <div className="tw-mx-auto">{getDynamicFields()}</div>

openmetadata-ui/src/main/resources/ui/src/components/ServiceConnectionDetails/ServiceConnectionDetails.component.tsx

@@ -95,7 +95,7 @@ const ServiceConnectionDetails = ({
         return (
           <div className="tw-w-1/2 tw-flex tw-nowrap tw-mb-3" key={key}>
             <div className="tw-w-1/3 tw-flex">
-              <p className="tw-text-gray-400 tw-m-0">{title || key}:</p>
+              <p className="tw-text-gray-500 tw-m-0">{title || key}:</p>
               <PopOver
                 delay={0}
                 position="bottom"

openmetadata-ui/src/main/resources/ui/src/components/TeamsAndUsers/TeamsAndUsers.component.tsx

@@ -132,7 +132,7 @@ const TeamsAndUsers = ({
                     currentTeam?.name
                   )}`}>
                   <p
-                    className="tag-category label-category tw-self-center tw-truncate tw-w-52"
+                    className="tag-category label-category tw-self-center tw-truncate"
                     data-testid="team-name"
                     title={team.displayName ?? team.name}>
                     {team.displayName ?? team.name}
@@ -185,7 +185,7 @@ const TeamsAndUsers = ({
                     activeUserTab
                   )}`}>
                   <p
-                    className="tag-category label-category tw-self-center tw-truncate tw-w-52"
+                    className="tag-category label-category tw-self-center tw-truncate"
                     data-testid="user-type"
                     title={capitalize(user.name)}>
                     {capitalize(user.name)}

openmetadata-ui/src/main/resources/ui/src/pages/AddIngestionPage/AddIngestionPage.component.tsx

@@ -241,6 +241,7 @@ const AddIngestionPage = () => {
       );
     } else {
       return (
+        <div className="tw-self-center">
           <PageLayout
             classes="tw-max-w-full-hd tw-h-full tw-pt-4"
             header={<TitleBreadcrumb titleLinks={slashedBreadcrumb} />}
@@ -278,6 +279,7 @@ const AddIngestionPage = () => {
               />
             </div>
           </PageLayout>
+        </div>
       );
     }
   };

openmetadata-ui/src/main/resources/ui/src/pages/EditIngestionPage/EditIngestionPage.component.tsx

@@ -274,6 +274,7 @@ const EditIngestionPage = () => {
       return <ErrorPlaceHolder>{errorMsg}</ErrorPlaceHolder>;
     } else {
       return (
+        <div className="tw-self-center">
           <PageLayout
             classes="tw-max-w-full-hd tw-h-full tw-pt-4"
             header={<TitleBreadcrumb titleLinks={slashedBreadcrumb} />}
@@ -313,6 +314,7 @@ const EditIngestionPage = () => {
               />
             </div>
           </PageLayout>
+        </div>
       );
     }
   };