changedcolors for light and dark modes

src/client/styles/scss/_on-edit.scss

@@ -334,43 +334,39 @@ body.on-edit {
 */
 
 .grw-grid-edit-modal {
-  .grid-edit-preview {
-    background: $gray-100;
-
-    .desktop-preview,
-    .tablet-preview,
-    .mobile-preview {
-      .row {
-        height: 140px;
-        margin: 0px;
-      }
-      background: white;
+  .desktop-preview,
+  .tablet-preview,
+  .mobile-preview {
+    .row {
+      height: 140px;
+      margin: 0px;
     }
-    .desktop-preview {
-      .row {
-        div {
-          padding: 0px;
-          background-color: $info;
-        }
+    // background: white;
+  }
+  .desktop-preview {
+    .row {
+      div {
+        padding: 0px;
+        background-color: $info;
       }
     }
+  }
 
-    .tablet-preview {
-      .row {
-        div {
-          padding: 0px;
-          background-color: $purple;
-        }
+  .tablet-preview {
+    .row {
+      div {
+        padding: 0px;
+        background-color: $purple;
       }
     }
+  }
 
-    .mobile-preview {
-      width: 75%;
-      .row {
-        div {
-          padding: 0px;
-          background-color: $pink;
-        }
+  .mobile-preview {
+    width: 75%;
+    .row {
+      div {
+        padding: 0px;
+        background-color: $pink;
       }
     }
   }
@@ -382,10 +378,3 @@ body.on-edit {
     }
   }
 }
-
-// .grw-grid-edit-prevew-bg-color {
-//   background: $gray-100;
-//   .bg-color-for-device-preview {
-//     background: white;
-//   }
-// }

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

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

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

@@ -211,6 +211,19 @@ $border-color: $border-color-global;
   }
 }
 
+/*
+ * GROWI Grid Edit Modal
+ */
+
+.grid-edit-preview {
+  background: $gray-100;
+  .desktop-preview,
+  .tablet-preview,
+  .mobile-preview {
+    background: white;
+  }
+}
+
 /*
  * Slack
  */