From fa499f99b3acf00cabe33503b2dd38de45068169 Mon Sep 17 00:00:00 2001
From: Sergio Elvira Perez <sergioelviraperez@gmail.com>
Date: Wed, 23 Feb 2022 16:25:55 +0100
Subject: [PATCH] OEL-1175: Image and styles added to solve required fields on
 forms.

---
 assets/images/required.svg           |  1 +
 resources/sass/components/_all.scss  |  1 +
 resources/sass/components/_form.scss | 19 +++++++++++++++++++
 3 files changed, 21 insertions(+)
 create mode 100644 assets/images/required.svg
 create mode 100644 resources/sass/components/_form.scss

diff --git a/assets/images/required.svg b/assets/images/required.svg
new file mode 100644
index 000000000..f7882d6df
--- /dev/null
+++ b/assets/images/required.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#EE0000"  d="M0,7.562l1.114-3.438c2.565,0.906,4.43,1.688,5.59,2.35C6.398,3.553,6.237,1.544,6.22,0.447h3.511 c-0.05,1.597-0.234,3.6-0.558,6.003c1.664-0.838,3.566-1.613,5.714-2.325L16,7.562c-2.05,0.678-4.06,1.131-6.028,1.356 c0.984,0.856,2.372,2.381,4.166,4.575l-2.906,2.059c-0.935-1.274-2.041-3.009-3.316-5.206c-1.194,2.275-2.244,4.013-3.147,5.206 l-2.856-2.059c1.872-2.307,3.211-3.832,4.017-4.575C3.849,8.516,1.872,8.062,0,7.562"/></svg>
diff --git a/resources/sass/components/_all.scss b/resources/sass/components/_all.scss
index b5bf8d950..0252da2af 100644
--- a/resources/sass/components/_all.scss
+++ b/resources/sass/components/_all.scss
@@ -2,3 +2,4 @@
 // -----------------------------------------------------------------------------
 @import 'blockquote';
 @import 'navbar';
+@import 'form';
diff --git a/resources/sass/components/_form.scss b/resources/sass/components/_form.scss
new file mode 100644
index 000000000..aed601f8a
--- /dev/null
+++ b/resources/sass/components/_form.scss
@@ -0,0 +1,19 @@
+// form
+// https://getbootstrap.com/docs/5.0/forms/overview/
+// -----------------------------------------------------------------------------
+
+// Custom css for forms.
+/**
+ * Required field
+ */
+.form-required:after {
+  content: '';
+  vertical-align: super;
+  display: inline-block;
+  background-image: url(../images/required.svg);
+  background-repeat: no-repeat;
+  background-size: 6px 6px;
+  width: 6px;
+  height: 6px;
+  margin: 0 0.3em;
+}