feat(form): change asterisk to styled "(required)"

TACC · Jun 22, 2022 · 084987d · 084987d
1 parent 5dbaac9
commit 084987d
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.forms.css b/taccsite_cms/static/site_cms/css/src/_imports/components/django.cms.forms.css
@@ -64,6 +64,16 @@ p.help-text:last-child {
   margin-bottom: 0; /* overwrite forms.css label */
 }
 
+:root {
+  /* TUP-271: Add to & Import from @core-styles */
+  /* https://github.com/TACC/tup-ui/blob/c5454ba/libs/core-styles/src/lib/_imports/settings/color.css */
+  --global-color-danger--dark: #ab1717;
+}
+.asterisk {
+  margin-left: 0.5em;
+  color: var(--global-color-danger--dark);
+}
+
 
 
 /* Errors */

diff --git a/taccsite_cms/templates/djangocms_forms/form_template/default.html b/taccsite_cms/templates/djangocms_forms/form_template/default.html
@@ -24,7 +24,7 @@ <h3 class="title">{{ instance.title }}</h3>
 						{{ field }}
 					{% endif %}
 					<label for="{{ field.id_for_label }}">
-						{{ field.label }}{% if field|is_required %}<span class="asterisk">*</span>{% endif %}
+						{{ field.label }}{% if field|is_required %}<span class="asterisk">(required)</span>{% endif %}
 					</label>
 					{% if not field|is_checkbox %}
 						{{ field }}