Updated editable styling for Text comp

kamalqureshi · kamalqureshi · commit ee2c4f26773e · 2025-07-24T23:36:23.000+05:00
diff --git a/client/packages/lowcoder/src/comps/comps/tableComp/tableSummaryComp.tsx b/client/packages/lowcoder/src/comps/comps/tableComp/tableSummaryComp.tsx
@@ -7,6 +7,24 @@ import Table from "antd/es/table";
 import { ReactNode, useMemo, memo, useCallback } from "react";
 import Tooltip from "antd/es/tooltip";
 
+const CellContainer = styled.div<{
+  $textAlign?: 'left' | 'center' | 'right';
+}>`
+  display: flex;
+  justify-content: ${(props) => {
+    switch (props.$textAlign) {
+      case 'left':
+        return 'flex-start';
+      case 'center':
+        return 'center';
+      case 'right':
+        return 'flex-end';
+      default:
+        return 'flex-start';
+    }
+  }};
+`;
+
 const TableSummaryRow = styled(Table.Summary.Row)<{
   $istoolbarPositionBelow: boolean;
   $background: string;
@@ -170,7 +188,9 @@ const TableSummaryCellView = memo(function TableSummaryCellView(props: {
       $autoHeight={autoHeight}
     >
       <CellWrapper tooltipTitle={cellTooltip}>
-        <div>{children}</div>
+        <CellContainer $textAlign={restProps.align}>
+          {children}
+        </CellContainer>
       </CellWrapper>
     </TableSummarCell>
   );
diff --git a/client/packages/lowcoder/src/comps/comps/textComp.tsx b/client/packages/lowcoder/src/comps/comps/textComp.tsx
@@ -37,6 +37,9 @@ const getStyle = (style: TextStyleType) => {
     text-transform:${style.textTransform} !important;
     text-decoration:${style.textDecoration} !important;
     background: ${style.background};
+    line-height: ${style.lineHeight};
+    margin: ${style.margin} !important;	
+    padding: ${style.padding};	
     .markdown-body a {
       color: ${style.links};
     }
@@ -68,7 +71,7 @@ const getStyle = (style: TextStyleType) => {
       h6 {
         color: ${style.text};
         font-weight: ${style.textWeight} !important;
-        line-height:${style.lineHeight};
+        line-height: ${style.lineHeight} !important;
       }
       img,
       pre {
@@ -101,9 +104,9 @@ const TextContainer = React.memo(styled.div<{
     margin: ${props.$styleConfig.margin};
     padding: ${props.$styleConfig.padding};
   `};
-  ${(props) => props.$styleConfig && getStyle(props.$styleConfig)}
   display: flex;
   ${markdownCompCss};
+  ${(props) => props.$styleConfig && getStyle(props.$styleConfig)}
   overflow-wrap: anywhere;
   .markdown-body {
     overflow-wrap: anywhere;
