From c38f6febd61f751f172a77897f8284c1fb8f383a Mon Sep 17 00:00:00 2001
From: Pavel Dohnal <pavel@mailpoet.com>
Date: Tue, 24 Mar 2020 12:25:10 +0100
Subject: [PATCH] Display placement options side by side

[MAILPOET-2741]
---
 assets/css/src/components-form-editor/_sidebar.scss         | 5 +++++
 .../components/form_settings/form_placement_panel.jsx       | 6 ++++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/assets/css/src/components-form-editor/_sidebar.scss b/assets/css/src/components-form-editor/_sidebar.scss
index fecef8685c..7499227445 100644
--- a/assets/css/src/components-form-editor/_sidebar.scss
+++ b/assets/css/src/components-form-editor/_sidebar.scss
@@ -114,6 +114,11 @@
   border: 1px solid #eee;
 }
 
+.form-placement-option-list {
+  display: flex;
+  flex-direction: row;
+}
+
 .form-placement-option {
   background-color: #fff;
   border: solid $form-placement-option-border $form-placement-option-base-color;
diff --git a/assets/js/src/form_editor/components/form_settings/form_placement_panel.jsx b/assets/js/src/form_editor/components/form_settings/form_placement_panel.jsx
index 8d3ba591d0..ca68a15f84 100644
--- a/assets/js/src/form_editor/components/form_settings/form_placement_panel.jsx
+++ b/assets/js/src/form_editor/components/form_settings/form_placement_panel.jsx
@@ -97,8 +97,10 @@ const FormPlacementPanel = ({ onToggle, isOpened }) => {
         onToggle={onToggle}
         className="form-sidebar-form-placement-panel"
       >
-        <FormPlacementOptionBelowPages />
-        <FormPlacementOptionPopup />
+        <div className="form-placement-option-list">
+          <FormPlacementOptionBelowPages />
+          <FormPlacementOptionPopup />
+        </div>
         <p>{addFormShortcodeHint}</p>
         <p>{addFormWidgetHint}</p>
         <p>{addFormPhpIframeHint}</p>