✨ Adds grid to the actibable features

frontend/resources/styles/main/layouts/inspect.scss

@@ -119,7 +119,7 @@ $width-settings-bar: 256px;
       }
     }
 
-    &.settings-bar-right, {
+    &.settings-bar-right {
       width: 100%;
     }
   }

frontend/resources/styles/main/partials/inspect.scss

@@ -421,7 +421,6 @@
         visibility: visible;
       }
     }
-
   }
 
   .code-row-display {

frontend/src/app/main/features.cljs

@@ -20,7 +20,7 @@
 (log/set-level! :warn)
 
 (def available-features
-  #{:auto-layout :components-v2 :new-css-system})
+  #{:components-v2 :new-css-system :grid-layout})
 
 (defn- toggle-feature
   [feature]

frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs

@@ -12,6 +12,7 @@
    [app.common.types.shape.layout :as ctl]
    [app.main.data.workspace :as udw]
    [app.main.data.workspace.shape-layout :as dwsl]
+   [app.main.features :as features]
    [app.main.refs :as refs]
    [app.main.store :as st]
    [app.main.ui.components.numeric-input :refer [numeric-input]]
@@ -602,20 +603,20 @@
            (if (= type :row)
              (st/emit! (dwsl/update-layout ids {:layout-justify-content value}))
              (st/emit! (dwsl/update-layout ids {:layout-align-content value})))))]
-
     [:div.element-set
      [:div.element-set-title
       [:*
        [:span "Layout"]
        (if (and (not multiple) (:layout values))
          [:div.title-actions
-          [:div.layout-btns
+          (when (features/active-feature? :grid-layout)
+            [:div.layout-btns
              [:button {:on-click set-flex
                        :class (dom/classnames
                                :active (= :flex layout-type))} "Flex"]
              [:button {:on-click set-grid
                        :class (dom/classnames
-                               :active (= :grid layout-type))} "Grid"]]
+                               :active (= :grid layout-type))} "Grid"]])
           [:button.remove-layout {:on-click on-remove-layout} i/minus]]
 
          [:button.add-page {:on-click #(on-add-layout :flex)} i/close])]]

frontend/src/app/main/ui/workspace/viewport/grid_layout_editor.scss

@@ -32,7 +32,7 @@
 }
 
 .grid-frame {
-  fill: #F6F6F6;
+  fill: #f6f6f6;
   stroke: var(--color-distance);
   stroke-width: calc(1 / var(--zoom));
 }

frontend/src/features.cljs

@@ -19,3 +19,6 @@
 
 (defn ^:export new-css-system []
   (features/toggle-feature! :new-css-system))
+
+(defn ^:export grid []
+  (features/toggle-feature! :grid-layout))