add CSS class to row that adds flex box and fixes padding

dimagi · Dec 15, 2023 · 6c6c6f6 · 6c6c6f6
1 parent 4fae62e
commit 6c6c6f6
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/corehq/apps/cloudcare/templates/form_entry/templates.html b/corehq/apps/cloudcare/templates/form_entry/templates.html
@@ -198,7 +198,7 @@ <h1 class="title" data-bind="text: title, visible: !showInFormNavigation()"></h1
 
 <script type="text/html" id="grouped-question-tile-row-fullform-ko-template">
   <div class="row">
-    <div data-bind="template: { name: childTemplate, foreach: $data.children }"/>
+    <div data-bind="template: { name: childTemplate, foreach: $data.children }" class="question-tile-row"/>
   </div>
 </script>
 

diff --git a/corehq/apps/hqwebapp/static/cloudcare/less/formplayer-webapp/form.less b/corehq/apps/hqwebapp/static/cloudcare/less/formplayer-webapp/form.less
@@ -193,3 +193,15 @@
     font-size: 14px;
   }
 }
+
+.question-tile-row {
+  display: flex;
+  align-items: center;
+  margin-bottom: 20px;
+  * .form-group, * p, * .control-label {
+    padding-top: 0px !important;
+    padding-bottom: 0px !important;
+    margin-top: 0px !important;
+    margin-bottom: 0px !important;
+  }
+}