From c86f7fffd5a4d8b37e635ed9bf79e4fec406653d Mon Sep 17 00:00:00 2001
From: Luka Stocker <67695434+lukastocker@users.noreply.github.com>
Date: Tue, 18 Nov 2025 15:36:34 +0100
Subject: [PATCH] [FIX] #45648 UI: Spacing the 'Required' Asterisk

https://mantis.ilias.de/view.php?id=45648

Cherry-picked from:
https://github.com/ILIAS-eLearning/ILIAS/pull/10144/commits/6659f8c99d46d94b4d4a7423ff46cb463e5fab27
---
 .../ILIAS/Form/templates/default/tpl.property_form.html     | 2 +-
 .../UI-framework/Input/_ui-component_input.scss             | 4 ++++
 .../070-components/legacy/Services/_component_form.scss     | 4 ++++
 templates/default/delos.css                                 | 6 ++++++
 4 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/components/ILIAS/Form/templates/default/tpl.property_form.html b/components/ILIAS/Form/templates/default/tpl.property_form.html
index bfb99fc6e3b6..c8da1f2701b6 100755
--- a/components/ILIAS/Form/templates/default/tpl.property_form.html
+++ b/components/ILIAS/Form/templates/default/tpl.property_form.html
@@ -30,7 +30,7 @@ <h2 class="ilHeader">{TXT_TITLE}</h2>
 <!-- BEGIN prop -->
 <!-- BEGIN std_prop_start -->
 <div class="form-group row" id="il_prop_cont_{LAB_ID}">
-	<label {FOR_ID} class="col-lg-2 col-md-3 col-sm-4 control-label">{PROPERTY_TITLE}<!-- BEGIN std_hid_title --> <span class="ilAccHeadingHidden">{PHID_TITLE}</span><!-- END std_hid_title --><!-- BEGIN required --> <span class="asterisk">*</span><!-- END required --></label>
+	<label {FOR_ID} class="col-lg-2 col-md-3 col-sm-4 control-label">{PROPERTY_TITLE}<!-- BEGIN std_hid_title --> <span class="ilAccHeadingHidden">{PHID_TITLE}</span> <!-- END std_hid_title --><!-- BEGIN required --><span class="asterisk">*</span><!-- END required --></label>
 	<div class="col-lg-10 col-md-9 col-sm-8">
 <!-- END std_prop_start -->
 <!-- BEGIN sub_prop_start -->
diff --git a/templates/default/070-components/UI-framework/Input/_ui-component_input.scss b/templates/default/070-components/UI-framework/Input/_ui-component_input.scss
index 540c006dd3b6..3cfe33a42477 100755
--- a/templates/default/070-components/UI-framework/Input/_ui-component_input.scss
+++ b/templates/default/070-components/UI-framework/Input/_ui-component_input.scss
@@ -82,6 +82,10 @@
     display: block;
     grid-area: label;
     padding-right: l.$il-margin-large-horizontal;
+
+    > .asterisk:first-child {
+      padding-left: $il-padding-base-vertical;
+    }
   }
 
   > .c-input__field {
diff --git a/templates/default/070-components/legacy/Services/_component_form.scss b/templates/default/070-components/legacy/Services/_component_form.scss
index d420fb23d934..a0837265c070 100755
--- a/templates/default/070-components/legacy/Services/_component_form.scss
+++ b/templates/default/070-components/legacy/Services/_component_form.scss
@@ -519,6 +519,10 @@ input[type="checkbox"] {
 		&.col-sm-3.il_textarea {
 		  width: 100%;
 		}
+
+        > .asterisk {
+          padding-left: $il-padding-base-vertical;
+        }
 	  }
 	/*
 	// Reset spacing and right align labels, but scope to media queries so that
diff --git a/templates/default/delos.css b/templates/default/delos.css
index e6bde764a022..edb063460f27 100644
--- a/templates/default/delos.css
+++ b/templates/default/delos.css
@@ -9244,6 +9244,9 @@ ul.c-input--has-mustache-variables__definitions > li {
   grid-area: label;
   padding-right: 12px;
 }
+.c-input[data-il-ui-component] > label > .asterisk:first-child {
+  padding-left: 3px;
+}
 .c-input[data-il-ui-component] > .c-input__field {
   grid-area: field;
 }
@@ -19244,6 +19247,9 @@ fieldset[disabled] .checkbox label {
 .form-horizontal .control-label.col-sm-3.il_textarea {
   width: 100%;
 }
+.form-horizontal .control-label > .asterisk {
+  padding-left: 3px;
+}
 
 .ilFormHeader {
   padding: 12px 0 12px 15px;