add common styles of border in each cols on apply-colors.scss

src/client/js/components/PageEditor/GridEditModal.jsx

@@ -172,7 +172,7 @@ class GridEditModal extends React.Component {
     const convertedHTML = colsRatios.map((colsRatio, i) => {
       const ratio = isBreakEnabled ? 12 : colsRatio;
       const key = `grid-preview-col-${i}`;
-      const className = `col-${ratio} border mb-1`;
+      const className = `col-${ratio} grid-edit-border-for-each-cols`;
       return (
         <div key={key} className={className}></div>
       );

src/client/styles/scss/theme/_apply-colors-dark.scss

@@ -307,14 +307,8 @@ ul.pagination {
 /*
  * GROWI Grid Edit Modal
  */
-
 .grid-edit-preview {
   background: $gray-900;
-  .desktop-preview,
-  .tablet-preview,
-  .mobile-preview {
-    background: $bgcolor-global;
-  }
 }
 
 /*

src/client/styles/scss/theme/_apply-colors-light.scss

@@ -217,11 +217,6 @@ $border-color: $border-color-global;
 
 .grid-edit-preview {
   background: $gray-100;
-  .desktop-preview,
-  .tablet-preview,
-  .mobile-preview {
-    background: white;
-  }
 }
 
 /*

src/client/styles/scss/theme/_apply-colors.scss

@@ -435,6 +435,21 @@ body.on-edit {
   }
 }
 
+/*
+ * GROWI Grid Edit Modal
+ */
+.grid-edit-preview {
+  .desktop-preview,
+  .tablet-preview,
+  .mobile-preview {
+    background: $bgcolor-global;
+  }
+}
+
+.grid-edit-border-for-each-cols {
+  border: 2px solid $bgcolor-global;
+}
+
 /*
  * GROWI comment
  */