Add and modify style elements of Designer components

Issue-ID: CCSDK-2823
Issue-ID: CCSDK-2800
Issue-ID: CCSDK-2780

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

1 files changed, 10 insertions, 11 deletions

diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index b215dd46a..252cb89b1 100644
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -582,7 +582,7 @@ height: 40px;
 .packages-card [data-tooltip]:after {
   padding: 9px;
   font-size: 11px;
-  background: #fff;
+  background: #C3CDDB;
   border: solid 1px #E6EDF5;
   box-shadow: 0 0 12 rgba(0,0,0,0.8);
   border-radius: 3px;
@@ -1946,8 +1946,8 @@ ul.package-contributers{
 [data-tooltip]:after {
   z-index: 1000;
   padding: 8px 20px !important;
-  width: auto;
-  background-color: #fff !important;
+  width: max-content;
+  background-color: #C3CDDB !important;
   color: #1B3E6F;
   content: attr(data-tooltip);
   font-size: 12px;
@@ -2015,7 +2015,7 @@ ul.package-contributers{
   margin-right: -12px;
   margin-bottom: 0;
   border-top-color: transparent;
-  border-left-color: #fff;
+  border-left-color: #C3CDDB;
   /* border-left-color: hsla(0, 0%, 20%, 0.9); */
 }
 
@@ -2040,8 +2040,8 @@ ul.package-contributers{
   margin-top: -12px;
   margin-bottom: 0;
   border-top-color: transparent;
-  border-bottom-color: #DEE8F3;
-  border-bottom-color: rgba(222, 232, 243, 1.0);
+  border-bottom-color: #C3CDDB;
+  border-bottom-color: rgba(195, 205, 219, 1.0);
 }
 
 .tooltip-bottom:hover:before,
@@ -2064,7 +2064,7 @@ ul.package-contributers{
   margin-bottom: 0;
   margin-left: -12px;
   border-top-color: transparent;
-  border-right-color: #fff;
+  border-right-color: #C3CDDB;
   /* border-right-color: hsla(0, 0%, 20%, 0.9); */
 }
 
@@ -2100,8 +2100,7 @@ ul.package-contributers{
   width: 100% !important;
 }
 .tooltip .tooltip-inner{
-  width: auto !important;
-  max-width: 280px !important;
+  width: max-content !important;
   text-align: left!important;
   /* color:#1B3E6F;
   background-color: #fff !important; */
@@ -2140,8 +2139,8 @@ padding-left: 20px !important;
   border-radius: 20px !important;
 }
 .btn-primary{
-    background-color: #1273EB !important;
-    border-color: #1273EB !important;
+  background-color: #1273EB !important;
+  border-color: #1273EB !important;
 }
 .btn-primary:hover {
   background-color: #0069d9 !important;