Updated app preview to show required asterisks

dimagi · Jun 11, 2024 · 15e030b · 15e030b
1 parent 1c635c8
commit 15e030b
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 14 deletions.
diff --git a/corehq/apps/cloudcare/templates/cloudcare/partials/query/group.html b/corehq/apps/cloudcare/templates/cloudcare/partials/query/group.html
@@ -1,8 +1,8 @@
 <script type="text/template" id="query-view-group-template">
   <td class="search-query-group">
     <% if (named) { %>
-    <div class="search-query-group-header <% if (required) { %> required<% } %>" data-bs-toggle="collapse" data-bs-target="#group-<%- groupKey %>" aria-expanded="true" aria-controls="group-<%- groupKey %>">
-      <label class="search-query-group-header-label fw-bold"><%= groupName %></label>
+    <div class="search-query-group-header d-flex<% if (required) { %> required<% } %>" data-bs-toggle="collapse" data-bs-target="#group-<%- groupKey %>" aria-expanded="true" aria-controls="group-<%- groupKey %>">
+      <label class="search-query-group-header-label fw-bold flex-fill"><%= groupName %></label>
       <i class="fa fa-angle-double-down float-end fs-5"></i>
     </div>
     <% } %>

diff --git a/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-common-main.scss b/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-common-main.scss
@@ -22,6 +22,7 @@ version of FORMPLAYER
 @import "formplayer-common/formnav";
 @import "formplayer-common/markdown-table";
 @import "formplayer-common/address";
+@import "formplayer-common/query";
 @import "formplayer-common/webforms";
 
 @import "debugger/debugger";
diff --git a/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-common/query.scss b/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-common/query.scss
@@ -0,0 +1,7 @@
+.query-caption.required label::before, .search-query-group-header.required .search-query-group-header-label::before {
+  content: '*';
+  font-weight: bold;
+  color: $danger;
+  margin: 0 3px;
+  float: left;
+}
diff --git a/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-common/webforms.scss b/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-common/webforms.scss
@@ -66,7 +66,7 @@ input:invalid {
 .required-group .gr-header .caption::before {
   content: '*';
   font-weight: bold;
-  color: #c0392b;
+  color: $danger;
   margin: 0 3px;
   float: left;
 }

diff --git a/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-webapp/query.scss b/corehq/apps/hqwebapp/static/cloudcare/scss/formplayer-webapp/query.scss
@@ -76,14 +76,6 @@
   }
 }
 
-.query-caption.required label::before, .search-query-group-header.required .search-query-group-header-label::before {
-  content: '*';
-  font-weight: bold;
-  color: #c0392b;
-  margin: 0 3px;
-  float: left;
-}
-
 .search-query-group-header-label {
   font-size: larger;
 }

diff --git a/corehq/apps/hqwebapp/static/preview_app/scss/preview_app/form.scss b/corehq/apps/hqwebapp/static/preview_app/scss/preview_app/form.scss
@@ -84,9 +84,6 @@
 .q.required {
   transition: all .5s;
   margin-bottom: 0;
-  label:before {
-    display: none;
-  }
 }
 
 .q.required.on {