chore(ui): clean up the tw-cad tailwind class (#11741)

openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolderES.tsx

@@ -11,7 +11,7 @@
  *  limitations under the License.
  */
 
-import { Typography } from 'antd';
+import { Card, Typography } from 'antd';
 import { ROUTES } from 'constants/constants';
 import {
   ELASTICSEARCH_ERROR_PLACEHOLDER_TYPE,
@@ -142,8 +142,8 @@ const ErrorPlaceHolderES = ({ type, errorMessage, query }: Props) => {
         </div>
         <div className="tw-grid tw-grid-cols-4 tw-gap-4 tw-mt-5">
           {stepsData.map((data) => (
-            <div
-              className="tw-card d-flex flex-col tw-justify-between tw-p-5"
+            <Card
+              className="d-flex flex-col tw-justify-between tw-p-5"
               key={uniqueId()}>
               <div>
                 <div className="d-flex tw-mb-2">
@@ -168,7 +168,7 @@ const ErrorPlaceHolderES = ({ type, errorMessage, query }: Props) => {
                   {`${t('label.click-here')} >>`}
                 </a>
               </p>
-            </div>
+            </Card>
           ))}
         </div>
       </div>

openmetadata-ui/src/main/resources/ui/src/components/common/error-with-placeholder/ErrorPlaceHolderIngestion.tsx

@@ -11,6 +11,7 @@
  *  limitations under the License.
  */
 
+import { Card } from 'antd';
 import { AIRFLOW_DOCS } from 'constants/docs.constants';
 import { t } from 'i18next';
 import React from 'react';
@@ -19,7 +20,7 @@ const ErrorPlaceHolderIngestion = () => {
   const airflowSetupGuide = () => {
     return (
       <div className="tw-mb-5" data-testid="error-steps">
-        <div className="tw-card d-flex flex-col tw-justify-between tw-p-5 tw-w-4/5 tw-mx-auto">
+        <Card className="d-flex flex-col tw-justify-between tw-p-5 tw-w-4/5 tw-mx-auto">
           <div>
             <h6 className="tw-text-base tw-text-grey-body tw-font-medium">
               {t('message.manage-airflow-api-failed')}
@@ -35,7 +36,7 @@ const ErrorPlaceHolderIngestion = () => {
               {`${t('label.install-airflow-api')} >>`}
             </a>
           </p>
-        </div>
+        </Card>
       </div>
     );
   };

openmetadata-ui/src/main/resources/ui/src/components/onboarding/Onboarding.tsx

@@ -11,6 +11,7 @@
  *  limitations under the License.
  */
 
+import { Card } from 'antd';
 import { ONBOARDING_STEPS_DATA } from 'constants/Onboarding.constants';
 import { t } from 'i18next';
 import { uniqueId } from 'lodash';
@@ -30,8 +31,8 @@ const Onboarding: FC = () => {
         </div>
         <div className="tw-grid tw-grid-cols-3 tw-gap-3 tw-mt-5">
           {ONBOARDING_STEPS_DATA.map((data) => (
-            <div
-              className="tw-card d-flex flex-col tw-justify-between tw-p-5"
+            <Card
+              className="d-flex flex-col tw-justify-between tw-p-5"
               key={uniqueId()}>
               <div>
                 <div className="d-flex tw-mb-2">
@@ -50,7 +51,7 @@ const Onboarding: FC = () => {
                   {t(data.description)}
                 </p>
               </div>
-            </div>
+            </Card>
           ))}
         </div>
       </div>

openmetadata-ui/src/main/resources/ui/src/pages/teams/UserCard.tsx

@@ -12,7 +12,7 @@
  */
 
 import { CloseOutlined } from '@ant-design/icons';
-import { Button, Tooltip, Typography } from 'antd';
+import { Button, Card, Tooltip, Typography } from 'antd';
 import classNames from 'classnames';
 import ProfilePicture from 'components/common/ProfilePicture/ProfilePicture';
 import { usePermissionProvider } from 'components/PermissionProvider/PermissionProvider';
@@ -160,9 +160,9 @@ const UserCard = ({
   };
 
   return (
-    <div
+    <Card
       className={classNames(
-        'tw-card d-flex tw-justify-between tw-py-2 tw-px-3 tw-group',
+        'd-flex tw-justify-between tw-py-2 tw-px-3 tw-group',
         { 'tw-py-5 tw-items-center': isDataset }
       )}
       data-testid="user-card-container">
@@ -253,7 +253,7 @@ const UserCard = ({
             </Tooltip>
           </div>
         ))}
-    </div>
+    </Card>
   );
 };
 

openmetadata-ui/src/main/resources/ui/src/styles/tailwind.css

@@ -87,10 +87,6 @@
     box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
   }
 
-  .tw-card {
-    @apply tw-bg-white tw-border tw-border-main tw-rounded-md;
-  }
-
   /* form */
 
   .tw-form-inputs {