From 176cd7489a42db8d2c3c95b5f6b80919bfca3911 Mon Sep 17 00:00:00 2001
From: Faizaan Gagan <fzngagan@gmail.com>
Date: Thu, 11 Feb 2021 19:22:09 +0530
Subject: [PATCH] improved admin side settings UI

---
 .../components/wizard-custom-field.hbs        |  7 ++--
 .../wizard-realtime-validation-settings.hbs   | 36 ++++++++++---------
 assets/stylesheets/common/wizard-admin.scss   | 13 ++++++-
 config/locales/client.en.yml                  |  1 +
 4 files changed, 36 insertions(+), 21 deletions(-)

diff --git a/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs b/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs
index 26d2cfa7..0502d3bc 100644
--- a/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs
+++ b/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs
@@ -219,10 +219,9 @@
         </div>
       </div>
       
+      {{#if validations}}
+        {{wizard-realtime-validation-settings field=field validations=validations}}
+      {{/if}}
     </div>
   {{/if}}
-
-  {{#if validations}}
-    {{wizard-realtime-validation-settings field=field validations=validations}}
-  {{/if}}
 {{/if}}
diff --git a/assets/javascripts/discourse/templates/components/wizard-realtime-validation-settings.hbs b/assets/javascripts/discourse/templates/components/wizard-realtime-validation-settings.hbs
index c8d35aa4..a012cdee 100644
--- a/assets/javascripts/discourse/templates/components/wizard-realtime-validation-settings.hbs
+++ b/assets/javascripts/discourse/templates/components/wizard-realtime-validation-settings.hbs
@@ -6,27 +6,31 @@
     {{input type="checkbox" checked=props.status }}
     {{i18n (concat 'admin.wizard.field.validations.' name) }}
   </span>
-  <div class="setting full">
+  <div class="validation-container">
+    <div class="validation-section">
     <span class="setting-label">{{i18n 'admin.wizard.field.validations.categories'}}</span>
     <div class="setting-value">
         {{category-selector
             categories=(get this (concat 'validationBuffer.' name '.categories'))
-            onChange=(action 'updateValidationCategories' name props) }}
+            onChange=(action 'updateValidationCategories' name props)
+            class="wizard" }}
     </div>
-  </div>
-    <div class="setting full">
-        <span class="setting-label">{{i18n 'admin.wizard.field.validations.date_after'}}</span>
-        <div class="setting-value">
-          {{date-picker-past
-                value=(readonly props.date_after)
-                containerId="date-container"
-                onSelect=(action (mut props.date_after))}}
-        </div>
     </div>
-  <div>
-    {{radio-button name=(concat name field.id) value="above" selection=props.position}} {{i18n 'admin.wizard.field.validations.above'}}
-  </div>
-  <div>
-    {{radio-button name=(concat name field.id) value="below" selection=props.position}} {{i18n 'admin.wizard.field.validations.below'}}
+  <div class="validation-section">
+      <span class="setting-label">{{i18n 'admin.wizard.field.validations.date_after'}}</span>
+      <div class="setting-value">
+        {{date-picker-past
+              value=(readonly props.date_after)
+              containerId="date-container"
+              onSelect=(action (mut props.date_after))}}
+      </div>
+    </div>
+    <div class="validation-section">
+      <span class="setting-label">{{i18n 'admin.wizard.field.validations.position'}}</span>
+      <div class="setting-value">
+        {{radio-button name=(concat name field.id) value="above" selection=props.position}} {{i18n 'admin.wizard.field.validations.above'}}
+        {{radio-button name=(concat name field.id) value="below" selection=props.position}} {{i18n 'admin.wizard.field.validations.below'}}
+      </div>
+    </div>
   </div>
 {{/each-in}}
diff --git a/assets/stylesheets/common/wizard-admin.scss b/assets/stylesheets/common/wizard-admin.scss
index 8816039b..8daf904d 100644
--- a/assets/stylesheets/common/wizard-admin.scss
+++ b/assets/stylesheets/common/wizard-admin.scss
@@ -642,4 +642,15 @@
       }
     }
   }
-}
\ No newline at end of file
+}
+
+.validation-container {
+  display: flex;
+  .validation-section {
+    width: 250px;
+  }
+}
+
+.wizard.category-selector {
+  width: 200px !important;
+}
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 555f8a94..899d0481 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -179,6 +179,7 @@ en:
           validations:
             header: "Realtime Validation Settings"
             similar_topics: "Similar Topics"
+            position: "Position"
             above: "Above"
             below: "Below"
             categories: "Categories"