@elliemae/ds-basic 2.2.0-alpha.2 → 2.2.0-beta.0

package/css/dimsum.css

@@ -2890,8 +2890,8 @@ fieldset.em-ds-form-item-content {
   z-index: -1;
   width: calc(100% + 16px);
   height: calc(100% + 8px);
-  background-color: #FEFBEE;
-  border: 1px solid #8F6326;
+  background-color: #fefbee;
+  border: 1px solid #8f6326;
   border-radius: 4px;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.35); }
 
@@ -2903,8 +2903,8 @@ fieldset.em-ds-form-item-content {
   z-index: -1;
   width: calc(100% + 16px);
   height: calc(100% + 8px);
-  background-color: #FFF9D3;
-  border: 1px solid #8F6326;
+  background-color: #fff9d3;
+  border: 2px solid #8f6326;
   border-radius: 4px;
   box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.3); }
 
@@ -6009,7 +6009,7 @@ div.em-ds-button {
     outline: none;
     position: relative; }
     .em-ds-button--link.em-ds-button--icon-only:focus span.label-wrapper:after, .em-ds-button--link.em-ds-button--icon-only.em-ds-button--variant-focus span.label-wrapper:after {
-      content: '';
+      content: "";
       position: absolute;
       top: 0;
       left: 0;
@@ -7352,7 +7352,8 @@ div.em-ds-button {
     .em-ds-shuttle-wrapper .em-ds-shuttle-header__breadcrumb {
       overflow: hidden;
       align-self: center;
-      flex: 1; }
+      flex: 1;
+      padding: 4px 0; }
       .em-ds-shuttle-wrapper .em-ds-shuttle-header__breadcrumb .em-ds-breadcrumb {
         width: 100%; }
         .em-ds-shuttle-wrapper .em-ds-shuttle-header__breadcrumb .em-ds-breadcrumb ol {
@@ -7434,29 +7435,31 @@ div.em-ds-button {
     margin-right: 16px; }
 
 .em-ds-shuttle-list-item {
-  display: flex;
-  justify-content: flex-start;
+  display: grid;
+  grid-template-columns: auto -webkit-min-content;
+  grid-template-columns: auto min-content;
   align-items: center;
   overflow: hidden;
   position: relative;
   border-bottom: 1px solid #e0e3e8;
-  background-color: #ffffff; }
+  background-color: #ffffff;
+  z-index: 999; }
   .em-ds-shuttle-list-item.drag-helper {
     border: 1px solid #e0e3e8; }
   .em-ds-shuttle-list-item__parent-helper-text {
     margin-left: 0.61538rem;
     color: #006aa9; }
   .em-ds-shuttle-list-item__content {
-    display: flex;
+    display: grid;
     align-items: center;
-    flex: 1 0 auto;
+    grid-template-columns: -webkit-min-content minmax(0px, -webkit-min-content) auto;
+    grid-template-columns: min-content minmax(0px, min-content) auto;
     height: 2.76923rem;
     padding-left: 0.61538rem;
     padding-right: 0.61538rem;
     border-left: 4px solid #e0e3e8;
     cursor: default;
-    pointer-events: none;
-    max-width: calc(100% - 72px); }
+    pointer-events: none; }
     .em-ds-shuttle-list-item__content span.shuttle-tooltip-text {
       cursor: pointer;
       pointer-events: all; }
@@ -7470,7 +7473,7 @@ div.em-ds-button {
       pointer-events: all; }
       .em-ds-shuttle-list-item__content--can-hover:hover {
         background-color: #f6fbff; }
-  .em-ds-shuttle-list-item__icon-wrapper {
+  .em-ds-shuttle-list-item__icon-wrapper > span {
     margin-right: 0.61538rem; }
   .em-ds-shuttle-list-item__actions {
     display: flex; }
@@ -7482,7 +7485,8 @@ div.em-ds-button {
       height: 2.76923rem;
       width: 2.76923rem;
       border-left: 1px solid #e0e3e8; }
-      .em-ds-shuttle-list-item__actions .em-ds-button svg, .em-ds-shuttle-list-item__actions .em-ds-button svg:not([fill]) {
+      .em-ds-shuttle-list-item__actions .em-ds-button svg,
+      .em-ds-shuttle-list-item__actions .em-ds-button svg:not([fill]) {
         fill: #1e79c2; }
       .em-ds-shuttle-list-item__actions .em-ds-button:hover:not(:disabled) {
         background-color: #f6fbff; }