1 files changed, 92 insertions, 23 deletions

diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index 1464cc295..b215dd46a 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -18,6 +18,9 @@ body{
   transition: 0.3s !important;
 }
 /*Bootstrap*/
+.custom-control-input:checked ~ .custom-control-label::before{
+  border-color: transparent !important;
+}
 .btn-outline-danger{
   background: #fff !important;
   border: solid 1px #ECEDF2 !important;
@@ -30,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;
 }
@@ -974,6 +999,11 @@ height: 40px;
   text-indent: unset;
   text-align: center;
 }
+.helpMenu li:hover,
+.helpMenu li:hover i,
+.helpMenu li:hover p{
+  cursor: pointer;
+}
 .helpMenu li:not(:last-child){
   margin-bottom: 9px;
 }
@@ -990,7 +1020,7 @@ height: 40px;
   padding: 6px;
 }
 .helpMenu .dropdown-content a{
-  padding: 0 12px;
+  padding: 5px 12px !important;
   text-align: left;
   text-indent: 0;
   font-size: 14px;
@@ -1049,7 +1079,7 @@ height: 40px;
   -webkit-box-shadow: 0 4px 10px 0 #eef0f5;
   box-shadow: 0 4px 10px 0 #eef0f5;
   position: relative;
-  z-index: 8;
+  z-index: 300;
   /* position: fixed;
   width: calc(100% - 50px); */
 }
@@ -1627,6 +1657,7 @@ ul.package-contributers{
   margin-bottom: 26px;
   width: 100px;
   height: 30px;
+  line-height: 15px;
   background: #1B3E6F;
   color: #fff;
   font-size: 12px;
@@ -1920,6 +1951,7 @@ ul.package-contributers{
   color: #1B3E6F;
   content: attr(data-tooltip);
   font-size: 12px;
+  font-weight: bold !important;
   line-height: 1.2;
   border-radius: 3px;
 }
@@ -2076,22 +2108,26 @@ ul.package-contributers{
   color:#1B3E6F;
   background-color: #C3CDDB !important;
   border: solid 1px #C3CDDB;
-  border-radius: 3px !important;
-  border-top-left-radius: 0 !important;
+  border-radius: 1px !important;
+  /* border-top-left-radius: 0 !important; */
   font-size: 12px;
   opacity: 1.0 !important;
 } 
 
-.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before {
+.bs-tooltip-auto[x-placement^=top] .arrow::before, 
+.bs-tooltip-top .arrow::before {
   border-top-color: #C3CDDB !important;
 }
-.bs-tooltip-auto[x-placement^=right] .arrow::before, .bs-tooltip-right .arrow::before {
+.bs-tooltip-auto[x-placement^=right] .arrow::before, 
+.bs-tooltip-right .arrow::before {
   border-right-color: #C3CDDB !important;
 }
-.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before {
+.bs-tooltip-auto[x-placement^=bottom] .arrow::before, 
+.bs-tooltip-bottom .arrow::before {
   border-bottom-color: #C3CDDB !important;
 }
-.bs-tooltip-auto[x-placement^=left] .arrow::before, .bs-tooltip-left .arrow::before {
+.bs-tooltip-auto[x-placement^=left] .arrow::before, 
+.bs-tooltip-left .arrow::before {
   border-left-color: #C3CDDB !important;
 }
 
@@ -2509,9 +2545,11 @@ animation: glowing 1500ms infinite;
 }
 
 
-.action-button.delete i{
+/* .action-button.delete i{
   color: #BABBC3;
-}
+} */
+.action-button.delete,
+.action-button.delete i,
 .action-button.delete:hover,
 .action-button.delete:hover .icon-delete-sm{
   color: #FF6469 !important;
@@ -2890,7 +2928,7 @@ animation: glowing 1500ms infinite;
   top: 13px;
 }
 .ace_scroller{
-  overflow: auto !important;
+  /* overflow: auto !important; */
 }
 .ace_print-margin{
   left: 100% !important;
@@ -3001,6 +3039,36 @@ padding: 0 10px 0 0;
 .mapping-source-load.hover-disable:hover i{
   background: transparent;
 }
+.mapping-editBar{
+  margin-bottom: 1rem;
+}
+.mapping-editBar .custom-checkbox,
+.mapping-editBar .btn{
+  margin: 0 4px !important;
+  padding: 9px !important;
+  width: 36px;
+  height: 36px;
+  background: #F4F9FE;
+  border-radius: 50% !important;
+  text-align: center;
+  line-height: 14px;
+}
+.mapping-editBar .custom-checkbox{
+  margin-left: 0 !important;
+}
+.mapping-editBar .custom-control-label{
+  top: -2px;
+  left: 16px;
+}
+.mapping-editBar .btn i{
+  color: #1B3E6F;
+  font-size: 18px;
+  opacity: .5;
+}
+.mapping-editBar .custom-checkbox:hover,
+.mapping-editBar .btn:hover i{
+  opacity: 1;
+}
 .template-mapping-list{
   background: #F4F9FE;
   border: 1px solid #E9F3FF;
@@ -3013,6 +3081,7 @@ padding: 0 10px 0 0;
 }
 .template-mapping-list:hover, 
 .template-mapping-list.active {
+  cursor: pointer;
   /* background: #1B3E6F;  */
   text-decoration: none;
   /* color: #fff !important; */
@@ -3164,8 +3233,8 @@ margin-right: 5px;
   font-size: 13px;
 }
 .template-mapping-action .btn-primary{
-  background:#5DBDBA !important ;
-  border-color:#5DBDBA !important ;
+  background:#66BB00 !important ;
+  border-color:#66BB00 !important ;
   color: #fff !important ;
 }
 .template-mapping-action .btn-outline-secondary{
@@ -3366,10 +3435,10 @@ table.dataTable.no-footer{
   overflow: auto;
   padding: 20px;
   padding-top: 9px;
-  background: #fff;
-  color: #1B3E6F;
+  background: #1B3E6F;
+  color: #fff;
   border-top: solid 6px #1273EB;
-  box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18) !important;
+  box-shadow: 0 2px 13px 6px rgba(47, 83, 151, .17) !important;
   border-radius: 3px !important;
   /* border-top-right-radius: 0 !important;
   border-bottom-right-radius: 0 !important; */
@@ -3413,14 +3482,14 @@ for simplicity
   border: 0;
   background: none;
   font-weight: normal;
-  color: #1273EB;
+  color: #E0E8F2;
   font-size: 12px;
 }
 /*Wizard Content*/
 .mat-menu-panel{
-  box-shadow: 0 2px 6px 0 rgba(47, 83, 151, 0.18) !important;
+  box-shadow: 0 2px 13px 6px rgba(47, 83, 151, .17) !important;
   border-radius: 3px !important;
-  border-bottom: solid 3px #1273EB;
+  border-top: solid 3px #1273EB;
 }
 .mat-menu-panel::after {
   content: '';
@@ -3430,13 +3499,13 @@ for simplicity
   position: absolute;
   border-left: 8px solid transparent;
   border-right: 8px solid transparent;
-  border-bottom: 8px solid #fff;
+  border-bottom: 8px solid #1273EB;
   left: 9px;
   top: -8px;
 }
 .mat-card{
-  background: #fff !important;
-  color: #1B3E6F !important;
+  background: #1B3E6F !important;
+  color: #fff !important;
   font-family: inherit !important;
   border-radius: 0 !important;
 }
@@ -3450,7 +3519,7 @@ for simplicity
   font-size: 16px !important;
 }
 .mat-icon-button[disabled]{
-  color: rgba(27, 62, 111, .5) !important;
+  color: rgba(224, 232, 242, .5) !important;
 }