@transferwise/components 46.165.1 → 46.165.3

package/build/styles/css/link-callout.css

@@ -1,6 +1,5 @@
 .link-callout > .tw-icon-chevron-up {
   display: inline-block;
-  margin-inline-start: 8px;
   margin-inline-start: var(--size-8);
   pointer-events: none;
   transition: transform 0.2s ease-in-out;

package/build/styles/css/list-group.css

@@ -2,22 +2,16 @@
   list-style-type: none;
   margin-block-end: 20px;
   padding-inline-start: 0;
-  border-inline-start: 1px solid rgba(0,0,0,0.10196);
-  border-inline-start: 1px solid #0000001a;
   border-inline-start: 1px solid var(--color-border-neutral);
-  border-inline-end: 1px solid rgba(0,0,0,0.10196);
-  border-inline-end: 1px solid #0000001a;
   border-inline-end: 1px solid var(--color-border-neutral);
 }
 .list-group-item {
   display: block;
   padding-block: 16px 16px;
   padding-inline: 14px 16px;
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
   border-inline-start: 2px solid transparent;
   margin-block-start: 1px;
-  line-height: 1.5;
   line-height: var(--line-height-body);
   transition: all ease 0.15s;
 }
@@ -39,17 +33,13 @@
 .list-group-item-heading {
   margin-block-end: 0;
   margin: 0;
-  line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
   word-wrap: break-word;
-  font-weight: 500;
   font-weight: var(--font-weight-medium);
-  font-size: 0.875rem;
   font-size: var(--font-size-14);
   letter-spacing: -0.006em;
   line-height: 140%;
-  color: #37517e;
   color: var(--color-content-primary);
 }
 @supports (hyphenate-limit-chars: 1) {
@@ -83,31 +73,25 @@
 .list-group-item-heading + p,
 .list-group-item-heading + ul:not(.list-unstyled),
 .list-group-item-heading + ol:not(.list-unstyled) {
-  margin-block-start: 8px;
   margin-block-start: var(--size-8);
 }
 .list-group-item-text {
   margin-block-end: 0;
-  color: #5d7079;
   color: var(--color-content-secondary);
 }
 a.list-group-item {
-  color: #0097c7;
   color: var(--color-content-accent);
   -webkit-text-decoration: none;
   text-decoration: none;
 }
 a.list-group-item .list-group-item-heading {
-  color: #0097c7;
   color: var(--color-content-accent);
 }
 a.list-group-item:not(.disabled):not(:disabled):hover,
 a.list-group-item:not(.disabled):not(:disabled):focus {
   -webkit-text-decoration: none;
   text-decoration: none;
-  color: #0084b3;
   color: var(--color-content-accent-hover);
-  background-color: rgba(134,167,189,0.10196);
   background-color: var(--color-background-neutral);
 }
 .list-group-item[ng-click] {
@@ -118,13 +102,9 @@ a.list-group-item:not(.disabled):not(:disabled):focus {
 }
 .list-group-item.active {
   z-index: 2;
-  background-color: #ffffff;
   background-color: var(--color-background-elevated);
-  box-shadow: 0 1px 10px rgba(0,0,0,0.10196);
   box-shadow: 0 1px 10px var(--color-border-neutral);
-  margin-block-start: 24px;
   margin-block-start: var(--size-24);
-  margin-block-end: 24px;
   margin-block-end: var(--size-24);
 }
 .list-group-item.active:first-child {
@@ -153,98 +133,75 @@ a.list-group-item:not(.disabled):not(:disabled):focus {
 }
 .list-group-inactive .list-group-item:hover,
 .list-group-inactive .list-group-item.active {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 @media (min-width: 600px) {
   .list-group-inactive .list-group-item:hover .circle,
   .list-group-inactive .list-group-item.active .circle {
-    background-color: rgba(134,167,189,0.10196);
     background-color: var(--color-background-neutral);
   }
 }
 .list-group-inactive .list-group-item.active {
-  margin-block-start: 24px;
   margin-block-start: var(--size-24);
 }
 .list-group-item-success {
-  border-inline-start: 3px solid #008026;
   border-inline-start: 3px solid var(--color-content-positive);
 }
 .list-group-item.list-group-item-success {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 .list-group-item-success .list-group-item-text {
-  color: #008026;
   color: var(--color-content-positive);
 }
 a.list-group-item-success {
-  color: #008026;
   color: var(--color-content-positive);
 }
 a.list-group-item-success:hover {
-  color: #008026;
   color: var(--color-content-positive);
 }
 .list-group-item-info {
-  border-inline-start: 3px solid #0097c7;
   border-inline-start: 3px solid var(--color-content-accent);
 }
 .list-group-item.list-group-item-info {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 .list-group-item-info .list-group-item-text {
-  color: #0097c7;
   color: var(--color-content-accent);
 }
 a.list-group-item-info {
-  color: #0097c7;
   color: var(--color-content-accent);
 }
 a.list-group-item-info:hover {
-  color: #0097c7;
   color: var(--color-content-accent);
 }
 .list-group-item-warning {
-  border-inline-start: 3px solid #9a6500;
   border-inline-start: 3px solid var(--color-content-warning);
 }
 .list-group-item.list-group-item-warning {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 .list-group-item-warning .list-group-item-text {
-  color: #9a6500;
   color: var(--color-content-warning);
 }
 a.list-group-item-warning {
-  color: #9a6500;
   color: var(--color-content-warning);
 }
 a.list-group-item-warning:hover {
-  color: #9a6500;
   color: var(--color-content-warning);
 }
 .list-group-item-danger {
-  border-inline-start: 3px solid #cf2929;
   border-inline-start: 3px solid var(--color-content-negative);
 }
 .list-group-item.list-group-item-danger {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 .list-group-item-danger .list-group-item-text {
-  color: #cf2929;
   color: var(--color-content-negative);
 }
 a.list-group-item-danger {
-  color: #cf2929;
   color: var(--color-content-negative);
 }
 a.list-group-item-danger:hover {
-  color: #cf2929;
   color: var(--color-content-negative);
 }
 .list-group:hover .list-group-item:not(.active) {
@@ -254,18 +211,15 @@ a.list-group-item-danger:hover {
   opacity: 0.94;
 }
 .list-group:hover .list-group-item:hover {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 .list-group:hover .list-group-item:hover .media {
   opacity: 1;
 }
 .list-group-inactive:hover .list-group-item:not(.active) {
-  background-color: rgba(134,167,189,0.10196);
   background-color: var(--color-background-neutral);
 }
 .list-group-inactive:hover .list-group-item:hover {
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
 }
 @keyframes listSlideOver {

package/build/styles/css/media.css

@@ -20,17 +20,14 @@
 }
 /* Alignment */
 .media-right {
-  padding-inline-start: 16px;
   padding-inline-start: var(--size-16);
 }
 .media-left {
-  padding-inline-end: 16px;
   padding-inline-end: var(--size-16);
 }
 @media (max-width: 320px) {
   .media-right,
   .media-left {
-    padding-inline-start: 32px;
     padding-inline-start: var(--size-32);
   }
 }

package/build/styles/css/modals.css

@@ -27,14 +27,11 @@
 .modal-dialog {
   position: relative;
   inline-size: auto;
-  margin: 16px;
   margin: var(--size-16);
 }
 .modal-content {
   position: relative;
-  background-color: #ffffff;
   background-color: var(--color-background-screen);
-  border: 1px solid rgba(134,167,189,0.10196);
   border: 1px solid var(--color-background-neutral);
   border-radius: 3px;
   box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
@@ -47,7 +44,6 @@
   box-shadow: none;
 }
 .np-theme-personal .modal-content {
-  border-radius: 10px;
   border-radius: var(--radius-small);
 }
 .modal-backdrop {
@@ -77,10 +73,7 @@
 }
 .modal-header {
   padding: 24px;
-  border-block-end: 1px solid rgba(0,0,0,0.10196);
-  border-block-end: 1px solid #0000001a;
   border-block-end: 1px solid var(--color-border-neutral);
-  min-block-size: calc(24px + 24px);
   min-block-size: calc(24px + var(--size-24));
 }
 .modal-header .close {
@@ -88,7 +81,6 @@
 }
 .modal-title {
   margin: 0;
-  line-height: 1.2;
   line-height: var(--line-height-title);
 }
 .modal-body {
@@ -96,16 +88,12 @@
   padding: 24px;
 }
 .modal-footer {
-  padding-block: 16px;
   padding-block: var(--size-16);
   padding-inline: 24px;
   text-align: end;
-  border-block-start: 1px solid rgba(0,0,0,0.10196);
-  border-block-start: 1px solid #0000001a;
   border-block-start: 1px solid var(--color-border-neutral);
 }
 .modal-footer .btn + .btn {
-  margin-inline-start: 8px;
   margin-inline-start: var(--size-8);
   margin-block-end: 0;
 }
@@ -139,14 +127,12 @@
   .modal-header {
     padding-block: 28px;
     padding-inline: 32px;
-    min-block-size: calc(28px + 24px);
     min-block-size: calc(28px + var(--size-24));
   }
   .modal-body {
     padding: 32px;
   }
   .modal-footer {
-    padding-block: 16px;
     padding-block: var(--size-16);
     padding-inline: 32px;
   }