@transferwise/components 0.0.0-experimental-e8160fd → 0.0.0-experimental-0384cde

package/src/slidingPanel/SlidingPanel.css

@@ -1,105 +0,0 @@
-.sliding-panel {
-  transform: translateX(-100%)  ;
-  transition: transform cubic-bezier(0, 0.94, 0.62, 1) 350ms;
-  background: #ffffff;
-  background: var(--color-background-elevated);
-  z-index: 1030;
-  position: absolute;
-}
-[dir="rtl"] .sliding-panel {
-  transform: translateX(100%)  ;
-}
-.sliding-panel.sliding-panel--fixed {
-  position: fixed;
-}
-.sliding-panel.sliding-panel--open-right,
-.sliding-panel.sliding-panel--open-left {
-  top: 0;
-  bottom: 0;
-}
-.sliding-panel.sliding-panel--open-right {
-  transform: translateX(100%)  ;
-  right: 0;
-}
-[dir="rtl"] .sliding-panel.sliding-panel--open-right {
-  transform: translateX(-100%)  ;
-}
-[dir="rtl"] .sliding-panel.sliding-panel--open-right {
-  left: 0;
-  right: auto;
-  right: initial;
-}
-.sliding-panel.sliding-panel--open-left {
-  transform: translateX(-100%)  ;
-  left: 0;
-}
-[dir="rtl"] .sliding-panel.sliding-panel--open-left {
-  transform: translateX(100%)  ;
-}
-[dir="rtl"] .sliding-panel.sliding-panel--open-left {
-  right: 0;
-  left: auto;
-  left: initial;
-}
-.sliding-panel.sliding-panel-enter-done.sliding-panel--open-right,
-.sliding-panel.sliding-panel-enter-done.sliding-panel--open-left {
-  transform: translateX(0);
-}
-.sliding-panel.sliding-panel-enter-done.sliding-panel--open-top,
-.sliding-panel.sliding-panel-enter-done.sliding-panel--open-bottom {
-  transform: translateY(0);
-}
-.sliding-panel.sliding-panel--open-top,
-.sliding-panel.sliding-panel--open-bottom {
-  right: 0;
-  left: 0;
-  width: 100%;
-}
-[dir="rtl"] .sliding-panel.sliding-panel--open-top,
-[dir="rtl"] .sliding-panel.sliding-panel--open-bottom {
-  left: 0;
-  right: auto;
-  right: initial;
-}
-[dir="rtl"] .sliding-panel.sliding-panel--open-top,
-[dir="rtl"] .sliding-panel.sliding-panel--open-bottom {
-  right: 0;
-  left: auto;
-  left: initial;
-}
-.sliding-panel.sliding-panel--open-top {
-  transform: translateY(-100%);
-  top: 0;
-}
-.sliding-panel.sliding-panel--open-bottom {
-  transform: translateY(100%);
-  bottom: 0;
-}
-.sliding-panel.sliding-panel--border-top {
-  box-shadow: inset 0 -1px 0 0 #e2e6e8;
-}
-.sliding-panel.sliding-panel--border-right {
-  box-shadow: inset 1px 0 0 0 #e2e6e8;
-}
-.sliding-panel.sliding-panel--border-bottom {
-  box-shadow: inset 0 1px 0 0 #e2e6e8;
-}
-.sliding-panel.sliding-panel--border-left {
-  box-shadow: inset -1px 0 0 0 #e2e6e8;
-}
-.np-theme-personal .sliding-panel.sliding-panel--border-top {
-  box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.10196);
-  box-shadow: inset 0 -1px 0 0 var(--color-border-neutral);
-}
-.np-theme-personal .sliding-panel.sliding-panel--border-right {
-  box-shadow: inset 1px 0 0 0 rgba(0,0,0,0.10196);
-  box-shadow: inset 1px 0 0 0 var(--color-border-neutral);
-}
-.np-theme-personal .sliding-panel.sliding-panel--border-bottom {
-  box-shadow: inset 0 1px 0 0 rgba(0,0,0,0.10196);
-  box-shadow: inset 0 1px 0 0 var(--color-border-neutral);
-}
-.np-theme-personal .sliding-panel.sliding-panel--border-left {
-  box-shadow: inset -1px 0 0 0 rgba(0,0,0,0.10196);
-  box-shadow: inset -1px 0 0 0 var(--color-border-neutral);
-}

package/src/snackbar/Snackbar.css

@@ -1,93 +0,0 @@
-.snackbar {
-  text-align: center;
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  z-index: 1060;
-}
-[dir="rtl"] .snackbar {
-  right: 0;
-  left: auto;
-  left: initial;
-}
-[dir="rtl"] .snackbar {
-  left: 0;
-  right: 0;
-}
-.snackbar__text {
-  background: #37517e;
-  color: #ffffff;
-  display: inline-flex;
-  border-radius: 2px;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
-  align-items: center;
-  justify-content: space-between;
-  text-align: left;
-  font-size: 0.875rem;
-  font-size: var(--font-size-14);
-  margin: 0 16px;
-  margin: 0 var(--size-16);
-  padding: 8px 16px;
-  padding: var(--size-8) var(--size-16);
-  width: calc(100% - 32px);
-  width: calc(100% - var(--size-32));
-  transition: 400ms cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-[dir="rtl"] .snackbar__text {
-  text-align: right;
-}
-.np-theme-personal .snackbar__text {
-  box-shadow: 0 2px 4px 0 rgba(69, 71, 69, 0.35);
-  position: relative;
-  background: var(--color-contrast-theme);
-  border-radius: 10px;
-  border-radius: var(--radius-small);
-  color: var(--color-contrast-overlay);
-}
-.np-theme-personal .snackbar__text::after {
-  display: block;
-  border-radius: inherit;
-  height: 100%;
-  width: 100%;
-  content: "";
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: -1;
-  background-color: rgba(134,167,189,0.10196);
-  background-color: var(--color-background-neutral);
-}
-.np-theme-personal--dark .snackbar__text,
-.np-theme-personal--forest-green .snackbar__text {
-  box-shadow: none;
-}
-@media (min-width: 576px) {
-  .snackbar__text {
-    width: auto;
-    max-width: 600px;
-  }
-}
-.snackbar__text__action {
-  flex-shrink: 0;
-  margin-left: 16px;
-  margin-left: var(--size-16);
-}
-[dir="rtl"] .snackbar__text__action {
-  margin-right: 16px;
-  margin-right: var(--size-16);
-  margin-left: 0;
-}
-.snackbar__text-container-enter,
-.snackbar__text-container-exit {
-  transform: translateY(calc(100% + 10px));
-}
-.snackbar__text-container-enter-active {
-  transform: translateY(-16px);
-  transform: translateY(calc(-16px - env(safe-area-inset-bottom)));
-}
-@media (min-width: 576px) {
-  .snackbar__text-container-enter-active {
-    transform: translateY(-24px);
-  }
-}

package/src/statusIcon/StatusIcon.css

@@ -1,27 +0,0 @@
-.status-circle .light {
-  color: var(--color-contrast);
-}
-.status-circle .dark {
-  color: #37517e;
-  color: var(--color-content-primary);
-}
-.status-circle.warning,
-.status-circle.pending {
-  background-color: var(--color-sentiment-warning);
-}
-.np-theme-personal .status-circle.warning .status-icon,
-.np-theme-personal .status-circle.pending .status-icon {
-  color: var(--color-dark);
-}
-.status-circle.negative,
-.status-circle.error {
-  background-color: var(--color-sentiment-negative);
-}
-.status-circle.neutral {
-  background-color: #5d7079;
-  background-color: var(--color-content-secondary);
-}
-.status-circle.positive,
-.status-circle.success {
-  background-color: var(--color-sentiment-positive);
-}

package/src/stepper/Stepper.css

@@ -1,84 +0,0 @@
-.tw-stepper {
-  padding-bottom: 24px;
-  width: 100%;
-}
-@media only screen and (max-width: 575px) {
-  .tw-stepper {
-    padding-bottom: 0;
-  }
-}
-.tw-stepper__step {
-  position: absolute;
-  top: 0;
-  list-style-type: none;
-}
-.tw-stepper__step--active .tw-stepper__step-label {
-  cursor: default;
-  color: #37517e;
-  color: var(--color-content-primary);
-}
-.tw-stepper__step--clickable .tw-stepper__step-label {
-  color: #0097c7;
-  color: var(--color-content-accent);
-  transition: color 0.15s ease-in-out;
-  line-height: 0;
-  border-radius: 2px;
-}
-.np-theme-personal .tw-stepper__step--clickable .tw-stepper__step-label {
-  color: #5d7079;
-  color: var(--color-content-secondary);
-  top: 0;
-}
-.tw-stepper__step--has-tooltip {
-  cursor: pointer;
-}
-@media screen and (min-width: 576px) and (max-width: 991px) {
-  .tw-stepper__step:first-child .tooltip-inner {
-    transform: translateX(calc(50% - 32px));
-  }
-  .tw-stepper__step:last-child .tooltip-inner {
-    transform: translateX(calc(-50% + 32px));
-  }
-}
-.tw-stepper__step-label {
-  position: absolute;
-  top: 0;
-  color: #5d7079;
-  color: var(--color-content-secondary);
-  transition: color 0.6s ease-in-out;
-  white-space: nowrap;
-  transform: translateX(-50%)  ;
-}
-[dir="rtl"] .tw-stepper__step-label {
-  transform: translateX(50%)  ;
-}
-.tw-stepper .tooltip {
-  top: 24px !important;
-  white-space: nowrap;
-}
-.tw-stepper .tooltip .tooltip-inner {
-  max-width: 100%;
-}
-.tw-stepper .tw-tooltip-container {
-  display: inline-block;
-}
-.tw-stepper-steps {
-  position: relative;
-  padding: 0   ;
-}
-[dir="rtl"] .tw-stepper-steps {
-  padding: 0   ;
-}
-.progress-bar {
-  -webkit-backface-visibility: hidden;
-  background-color: var(--color-interactive-primary);
-  transition: width 0.6s ease-in-out;
-  will-change: width;
-}
-.btn-unstyled {
-  background: none;
-  border: none;
-  margin: 0;
-  padding: 0;
-  display: block;
-}

package/src/summary/Summary.css

@@ -1,85 +0,0 @@
-.np-summary {
-  min-width: 280px;
-}
-.np-summary__body {
-  flex: 1;
-}
-.np-summary__title {
-  margin-top: 2px;
-  line-height: calc(22 / 16);
-  font-weight: 600;
-  font-weight: var(--font-weight-semi-bold);
-  justify-content: space-between;
-  margin-top: 0;
-}
-.np-summary__title span {
-  line-height: 1.375;
-  margin-bottom: 0 !important;
-  letter-spacing: normal;
-}
-.np-summary__title .np-info button {
-  margin-top: 0;
-}
-.np-summary__title .np-info__small {
-  margin-top: 0;
-}
-.np-summary__title .np-info .tw-icon {
-  color: var(--color-interactive-primary);
-}
-.np-summary__icon {
-  position: relative;
-  color: #37517e;
-  color: var(--color-content-primary);
-}
-.np-summary__icon .np-summary-icon__done {
-  color: var(--color-sentiment-positive);
-}
-.np-summary__icon .np-summary-icon__pending {
-  color: var(--color-sentiment-warning);
-}
-.np-summary__icon :nth-child(2) {
-  background-color: transparent;
-  border-radius: 50%;
-  position: absolute;
-  right: calc(8px * -1);
-  right: calc(var(--size-8) * -1);
-  bottom: -6px;
-}
-[dir="rtl"] .np-summary__icon :nth-child(2) {
-  left: calc(8px * -1);
-  left: calc(var(--size-8) * -1);
-  right: auto;
-  right: initial;
-}
-.np-summary__description {
-  margin-top: 4px;
-  margin-top: var(--size-4);
-  font-size: 0.875rem;
-  font-size: var(--font-size-14);
-  line-height: calc(20 / 14);
-  color: #5d7079;
-  color: var(--color-content-secondary);
-  padding-right: calc(24px + 8px);
-  padding-right: calc(var(--size-24) + var(--size-8));
-}
-[dir="rtl"] .np-summary__description {
-  padding-left: calc(24px + 8px);
-  padding-left: calc(var(--size-24) + var(--size-8));
-  padding-right: 0;
-}
-.np-summary__description-icon {
-  margin-top: 4px;
-  margin-top: var(--size-4);
-}
-.np-summary__action {
-  margin-top: 4px;
-  margin-top: var(--size-4);
-  font-size: 0.875rem;
-  font-size: var(--font-size-14);
-  font-weight: 600;
-  font-weight: var(--font-weight-semi-bold);
-}
-.np-summary + .np-summary {
-  margin-top: 24px;
-  margin-top: var(--size-24);
-}

package/src/switch/Switch.css

@@ -1,68 +0,0 @@
-.np-switch {
-  display: inline-flex;
-  overflow: hidden;
-  width: 50px;
-  padding: 2px;
-  border-radius: 16px;
-}
-.np-switch:focus {
-  outline: none;
-}
-.np-switch:focus-visible {
-  outline: var(--ring-outline-color) solid var(--ring-outline-width);
-  outline-offset: var(--ring-outline-offset);
-}
-.np-switch--thumb {
-  display: flex;
-  transition: transform cubic-bezier(0, 0.94, 0.62, 1) 350ms;
-}
-.np-switch--thumb .tw-icon {
-  color: #fff;
-}
-.np-switch--unchecked {
-  background: #c9cbce;
-  background: var(--color-interactive-secondary);
-}
-.np-switch--unchecked .switch--thumb {
-  transform: translateX(0);
-}
-.np-switch--checked {
-  background: #00a2dd;
-  background: var(--color-interactive-accent);
-}
-.np-switch--checked .np-switch--thumb {
-  transform: translateX(20px)  ;
-}
-[dir="rtl"] .np-switch--checked .np-switch--thumb {
-  transform: translateX(-20px)  ;
-}
-.np-switch input {
-  position: absolute;
-  left: -100%;
-  display: none;
-  width: 0;
-  height: 0;
-  opacity: 0;
-}
-[dir="rtl"] .np-switch input {
-  right: -100%;
-  left: auto;
-  left: initial;
-}
-.np-switch:not([aria-disabled]) {
-  cursor: pointer;
-}
-.np-theme-personal .np-switch {
-  padding: 1px 2px;
-}
-.np-theme-personal .np-switch--checked {
-  background: var(--color-interactive-primary);
-}
-.np-theme-personal .np-switch--thumb {
-  width: 20px;
-  height: 20px;
-  margin: 3px;
-  border-radius: 50%;
-  background-color: #ffffff;
-  background-color: var(--color-background-screen);
-}