fix: bug fixes

Author: raheeliftikhar5

client/packages/lowcoder/src/comps/comps/responsiveLayout/responsiveLayout.tsx

@@ -16,7 +16,7 @@ import { sameTypeMap, UICompBuilder, withDefault } from "comps/generators";
 import { addMapChildAction } from "comps/generators/sameTypeMap";
 import { NameConfigHidden, withExposingConfigs } from "comps/generators/withExposing";
 import { NameGenerator } from "comps/utils";
-import { Section, sectionNames } from "lowcoder-design";
+import { Section, controlItem, sectionNames } from "lowcoder-design";
 import { HintPlaceHolder } from "lowcoder-design";
 import _ from "lodash";
 import React from "react";
@@ -85,6 +85,7 @@ const ColumnContainer = (props: ColumnContainerProps) => {
       {...props}
       emptyRows={15}
       hintPlaceholder={HintPlaceHolder}
+      radius={props.style.radius}
       style={props.style}
     />
   );
@@ -125,7 +126,7 @@ const ResponsiveLayout = (props: ResponsiveLayoutProps) => {
               margin: !_.isEmpty(column.margin) ? column.margin : columnStyle.margin,
               padding: !_.isEmpty(column.padding) ? column.padding : columnStyle.padding,
               radius: !_.isEmpty(column.radius) ? column.radius : columnStyle.radius,
-              border: !_.isEmpty(column.border) ? column.border : columnStyle.border,
+              border: `1px solid ${!_.isEmpty(column.border) ? column.border : columnStyle.border}`,
               background: !_.isEmpty(column.background) ? column.background : columnStyle.background,
             }
             const noOfColumns = columns.length;
@@ -181,15 +182,15 @@ export const ResponsiveLayoutBaseComp = (function () {
             })}
             {children.autoHeight.getPropertyView()}
           </Section>
-          <Section name={sectionNames.layout}>
+          <Section name={trans("responsiveLayout.rowLayout")}>
             {children.rowBreak.propertyView({
               label: trans("responsiveLayout.rowBreak")
             })}
-            {children.matchColumnsHeight.propertyView({
-              label: trans("responsiveLayout.matchColumnsHeight")
-            })}
-          </Section>
-          <Section name={trans("responsiveLayout.columnsPerRow")}>
+            {controlItem({}, (
+              <div style={{marginTop: '8px'}}>
+                {trans("responsiveLayout.columnsPerRow")}
+              </div>
+            ))}
             {children.columnPerRowLG.propertyView({
               label: trans("responsiveLayout.desktop")
             })}
@@ -200,7 +201,15 @@ export const ResponsiveLayoutBaseComp = (function () {
               label: trans("responsiveLayout.mobile")
             })}
           </Section>
-          <Section name={trans("responsiveLayout.columnsSpacing")}>
+          <Section name={trans("responsiveLayout.columnsLayout")}>
+            {children.matchColumnsHeight.propertyView({
+              label: trans("responsiveLayout.matchColumnsHeight")
+            })}
+            {controlItem({}, (
+              <div style={{marginTop: '8px'}}>
+                {trans("responsiveLayout.columnsSpacing")}
+              </div>
+            ))}
             {children.horizontalSpacing.propertyView({
               label: trans("responsiveLayout.horizontal")
             })}

client/packages/lowcoder/src/comps/controls/optionsControl.tsx

@@ -573,8 +573,8 @@ const ColumnOption = new MultiCompBuilder(
     backgroundImage: withDefault(StringControl, ""),
     border: withDefault(ColorControl, ""),
     radius: withDefault(RadiusControl, ""),
-    margin: withDefault(StringControl, "0px"),
-    padding: withDefault(StringControl, "0px"),
+    margin: withDefault(StringControl, ""),
+    padding: withDefault(StringControl, ""),
   },
   (props) => props
 )

client/packages/lowcoder/src/i18n/locales/en.ts

@@ -2517,7 +2517,7 @@ export const en = {
     column: "Columns",
     atLeastOneColumnError: "Responsive layout keeps at least one Column",
     columnsPerRow: "Columns per Row",
-    columnsSpacing: "Columns Spacing(px)",
+    columnsSpacing: "Columns Spacing (px)",
     horizontal: "Horizontal",
     vertical: "Vertical",
     mobile: "Mobile",
@@ -2528,5 +2528,7 @@ export const en = {
     minWidth: "Min. Width",
     rowBreak: "Row Break",
     matchColumnsHeight: "Match Columns Height",
+    rowLayout: "Row Layout",
+    columnsLayout: "Columns Layout",
   },
 };

client/packages/lowcoder/src/i18n/locales/zh.ts

@@ -2507,7 +2507,7 @@ timeLine: {
         column: "列",
         atLeastOneColumnError: "响应式布局至少保留一列",
         columnsPerRow: "每行列数",
-        columnsSpacing: "列间距(px)",
+        columnsSpacing: "列间距 (px)",
         horizontal: "水平的",
         vertical: "垂直的",
         mobile: "移动的",
@@ -2518,6 +2518,8 @@ timeLine: {
         minWidth: "分钟。宽度",
         rowBreak: "断行",
         matchColumnsHeight: "匹配列高度",
+        rowLayout: "行布局",
+        columnsLayout: "栏目布局",
     }
 };