From 1c47a6942b88a28efa54ee6a4775fe4de4aec269 Mon Sep 17 00:00:00 2001
From: Pavel Dohnal <pavel@mailpoet.com>
Date: Mon, 20 Apr 2020 11:32:38 +0200
Subject: [PATCH] Add input padding form settings

[MAILPOET-2809]
---
 .../components/form_settings/styles_settings_panel.jsx   | 9 +++++++++
 views/form/editor.html                                   | 1 +
 2 files changed, 10 insertions(+)

diff --git a/assets/js/src/form_editor/components/form_settings/styles_settings_panel.jsx b/assets/js/src/form_editor/components/form_settings/styles_settings_panel.jsx
index b9b6a5802c..c520e7e503 100644
--- a/assets/js/src/form_editor/components/form_settings/styles_settings_panel.jsx
+++ b/assets/js/src/form_editor/components/form_settings/styles_settings_panel.jsx
@@ -2,6 +2,7 @@ import React, { useRef } from 'react';
 import {
   Panel,
   PanelBody,
+  RangeControl,
 } from '@wordpress/components';
 import MailPoet from 'mailpoet';
 import PropTypes from 'prop-types';
@@ -48,6 +49,14 @@ const BasicSettingsPanel = ({ onToggle, isOpened }) => {
             value={settings.fontSize}
             onChange={partial(updateStyles, 'fontSize')}
           />
+          <RangeControl
+            label={MailPoet.I18n.t('formSettingsInputPadding')}
+            value={settings.inputPadding !== undefined ? settings.inputPadding : 5}
+            min={0}
+            max={30}
+            allowReset
+            onChange={partial(updateStyles, 'inputPadding')}
+          />
         </div>
       </PanelBody>
     </Panel>
diff --git a/views/form/editor.html b/views/form/editor.html
index ea41687b7c..38f8103401 100644
--- a/views/form/editor.html
+++ b/views/form/editor.html
@@ -52,6 +52,7 @@
   'formSettingsBold': _x('Bold', 'A label for checkbox in form style settings'),
   'formSettingsBorderSize': _x('Border Size', 'A label for checkbox in form style settings'),
   'formSettingsBorderRadius': _x('Border Radius', 'A label for checkbox in form style settings'),
+  'formSettingsInputPadding': _x('Input Padding', 'A label for form style settings'),
   'formSettingsBorderColor': _x('Border Color', 'A label for checkbox in form style settings'),
   'formSettingsApplyToAll': __('Apply styles to all inputs'),
   'customFieldSettings': _x('Custom field settings', 'A settings section heading'),