Add Reuired and Optional checkbox to mapping table

Issue-ID: CCSDK-2795

Signed-off-by: Sarah Abouzainah <sabouzainah.ext@orange.com>
Change-Id: I81f5a1f7da38ca44ade8d14ffffde209a4e05eee

1 files changed, 23 insertions, 1 deletions

diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index 2d7e23094..91b1f8652 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -18,7 +18,7 @@ body{
   transition: 0.3s !important;
 }
 /*Bootstrap*/
-.custom-control-input:checked ~ .custom-control-label::before {
+.custom-control-input:checked ~ .custom-control-label::before{
   border-color: transparent !important;
 }
 .btn-outline-danger{
@@ -33,6 +33,28 @@ body{
   border: solid 1px #C3CDDB !important;
   border-radius: 0 !important;
 }
+.reuiredInput .custom-control-label::before{
+  width: 18px !important;
+  height: 18px !important;
+  border-radius: 50% !important;
+}
+
+.reuiredInput .custom-control-label::after{
+  content: "_";
+  color: #C4CEDB !important;
+  width: 18px !important;
+  height: 18px !important;
+  line-height: 6px;
+  text-align: center;
+}
+.reuiredInput .custom-control-input:checked ~ .custom-control-label::after{
+  top: 4px !important;
+  left: -24px !important; 
+  content: "";
+}
+.reuiredInput .custom-control-input:checked ~ .custom-control-label::before{
+  background: #66BB00 !important;
+}
 .custom-control-input:checked ~ .custom-control-label::before{
   background: #1B3E6F !important;
 }