Replace the existing mapping table with MatTable

[ccsdk/cds.git] / cds-ui / designer-client / src / styles.css

diff --git a/cds-ui/designer-client/src/styles.css b/cds-ui/designer-client/src/styles.css
index 91b1f86..8d4ee8e 100644 (file)
--- a/cds-ui/designer-client/src/styles.css
+++ b/cds-ui/designer-client/src/styles.css
@@ -78,6 +78,9 @@ body{
   width: 14px !important;
   height: 14px;
 }
+.btn[aria-expanded="true"] > .card{
+  overflow: visible;
+}
 .card-header .btn[aria-expanded="true"],
 .card-header .btn[aria-expanded="false"]{
   padding-left: 25px !important;
@@ -582,7 +585,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 +1949,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 +2018,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 +2043,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 +2067,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 +2103,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 +2142,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;
@@ -2927,9 +2929,6 @@ animation: glowing 1500ms infinite;
   position: absolute;
   top: 13px;
 }
-.ace_scroller{
-  overflow: auto !important;
-}
 .ace_print-margin{
   left: 100% !important;
   background: #eee !important;
@@ -3081,6 +3080,7 @@ padding: 0 10px 0 0;
 }
 .template-mapping-list:hover, 
 .template-mapping-list.active {
+  cursor: pointer;
   /* background: #1B3E6F;  */
   text-decoration: none;
   /* color: #fff !important; */
@@ -3298,7 +3298,7 @@ margin-right: 5px;
 .mapping-table th{
   padding-top: 10px !important;
   padding-bottom: 10px !important;
-  background: #F4F9FE;
+  /* background: #F4F9FE; */
 }
 .mapping-table td{
   border-top: 0 !important;