added style change

Author: ShaileshParmar11

openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityLineage/CustomNode.utils.tsx

@@ -10,7 +10,7 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Button, Typography } from 'antd';
+import { Button, Col, Row, Typography } from 'antd';
 import classNames from 'classnames';
 import React, { Fragment } from 'react';
 import { Handle, HandleProps, HandleType, Position } from 'reactflow';
@@ -152,8 +152,10 @@ export const getColumnContent = (
         'lineage-column-node-handle',
         encodeLineageHandles(fullyQualifiedName ?? '')
       )}
-      <div className={classNames('d-flex justify-between w-full')}>
-        <span className="custom-node-name-container">
+      <Row gutter={24}>
+        <Col
+          className="custom-node-name-container"
+          span={showDataObservabilitySummary ? 8 : 12}>
           <div className="custom-node-name-icon">
             {getColumnDataTypeIcon({
               dataType: column.dataType,
@@ -165,16 +167,26 @@ export const getColumnContent = (
             ellipsis={{ tooltip: true }}>
             {getEntityName(column)}
           </Typography.Text>
-        </span>
-        <span className="custom-node-constraint">{column.constraint}</span>
-      </div>
-      {showDataObservabilitySummary && (
-        <TestSuiteSummaryWidget
-          isLoading={isLoading}
-          size="small"
-          summary={summary}
-        />
-      )}
+        </Col>
+
+        <Col
+          className={classNames(
+            'custom-node-constraint',
+            showDataObservabilitySummary ? 'text-left' : 'text-right'
+          )}
+          span={showDataObservabilitySummary ? 8 : 12}>
+          {column.constraint}
+        </Col>
+        {showDataObservabilitySummary && (
+          <Col span={8}>
+            <TestSuiteSummaryWidget
+              isLoading={isLoading}
+              size="small"
+              summary={summary}
+            />
+          </Col>
+        )}
+      </Row>
     </div>
   );
 };

openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityLineage/custom-node.less

@@ -268,11 +268,11 @@
 }
 
 .react-flow .lineage-column-node-handle {
-  width: 20px;
+  width: 30px;
   border-radius: 0;
   border-color: @lineage-border;
   background: transparent;
-  top: 1px;
+  top: 5px;
   height: 25px;
   transform: none;
   border: none;
@@ -287,9 +287,6 @@
 }
 
 .custom-node-column-container {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
   padding: 6px;
   background: @white;
   position: relative;