aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorSarah Abouzainah <sabouzainah.ext@orange.com>2020-09-30 14:53:50 +0200
committerSarah Abouzainah <sabouzainah.ext@orange.com>2020-09-30 14:53:50 +0200
commit661d7a5acca219bb7c6196dfb2ef934c70d1f144 (patch)
tree7ff9fc39637c64c31a4b8f8216f80ead5ba973db
parentdb9eee076faac066ff337193a9211d28cd206711 (diff)
Add Reuired and Optional checkbox to mapping table
Issue-ID: CCSDK-2795 Signed-off-by: Sarah Abouzainah <sabouzainah.ext@orange.com> Change-Id: I81f5a1f7da38ca44ade8d14ffffde209a4e05eee
-rw-r--r--cds-ui/designer-client/package-lock.json6
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html7
-rw-r--r--cds-ui/designer-client/src/styles.css24
3 files changed, 36 insertions, 1 deletions
diff --git a/cds-ui/designer-client/package-lock.json b/cds-ui/designer-client/package-lock.json
index 6ee937186..14feaad08 100644
--- a/cds-ui/designer-client/package-lock.json
+++ b/cds-ui/designer-client/package-lock.json
@@ -10941,6 +10941,12 @@
}
}
},
+ "sonar-scanner": {
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/sonar-scanner/-/sonar-scanner-3.1.0.tgz",
+ "integrity": "sha1-UcHBEB9UuYq8XYVlIJsdkjKXk0M=",
+ "dev": true
+ },
"sort-keys": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
index 870770ac5..3cac1edd5 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.html
@@ -170,6 +170,13 @@
(click)="selectProp(dict.name)"></td> -->
</td>
<td>
+ <div class="custom-control custom-checkbox reuiredInput">
+ <input type="checkbox" class="custom-control-input"
+ id="customCheck-{{dict.name}}" [checked]="selectedProps.has(dict.name)"
+ (click)="selectProp(dict.name)">
+ <label class="custom-control-label" for="customCheck-{{dict.name}}"></label>
+ </div>
+
<img *ngIf="dict.definition?.property?.required"
src="/assets/img/icon-required-yes.svg">
<img *ngIf="!dict.definition?.property?.required"
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;
}