Merge branch 'development' of github.com:Webiny/webiny-js into develo…

…pment
webiny · Mar 17, 2019 · dc2b1e7 · dc2b1e7
2 parents fc3a565 + 0e2c33e
commit dc2b1e7
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 0 deletions.
diff --git a/packages/webiny-app-cms/src/editor/components/Element.js b/packages/webiny-app-cms/src/editor/components/Element.js
@@ -75,6 +75,8 @@ const Element = pure(
                             </Draggable>
                             {plugin.render({ element })}
                         </div>
+                        <div className="add-element add-element--above">+</div>
+                        <div className="add-element add-element--below">+</div>
                     </ElementContainer>
                 )}
             </Transition>

diff --git a/packages/webiny-app-cms/src/editor/components/Element/ElementStyled.js b/packages/webiny-app-cms/src/editor/components/Element/ElementStyled.js
@@ -111,6 +111,31 @@ export const ElementContainer = pure(
                         backgroundColor: color
                     }
                 }
+            },
+            ">.add-element": {
+                position: "absolute",
+                left: "50%",
+                backgroundColor: color,
+                color: "white",
+                width: "22px",
+                height: "22px",
+                borderRadius: "50%",
+                display: active || highlight ? "flex" : "none",
+                justifyContent: "center",
+                alignItems: "center",
+                transform: "scale(0.5)",
+                cursor: "pointer",
+                zIndex: 15,
+                transition: "transform 0.2s",
+                "&--above": {
+                    top: -12
+                },
+                "&--below": {
+                    bottom: -10
+                },
+                "&:hover": {
+                    transform: "scale(1)"
+                }
             }
         };
     })