.woocommerce-task-dashboard__body { .woocommerce-card__description { color: $studio-gray-50; } .woocommerce-task-card .woocommerce-card__body { border-top: 1px solid $studio-gray-5; padding: 0; } .woocommerce-card.is-narrow { max-width: 680px; margin-left: auto; margin-right: auto; } .woocommerce-task-dashboard__container .components-button:not(.components-icon-button), .components-modal__frame .components-button.is-button { height: 40px; min-width: 106px; margin: $gap $gap-smaller 0 0; justify-content: center; font-size: 14px; font-weight: 500; &:not(.is-primary) { color: $studio-pink-50; } } .woocommerce-task-dashboard__container { .woocommerce-task-card__prompt-actions { .components-button:not(.components-icon-button) { color: $studio-white; } } .skip-actions { text-align: center; button.components-button.is-secondary { color: $studio-gray-50; margin: 0; min-width: 0; } } } .woocommerce-list { margin: 0; .woocommerce-list__item.is-complete { background: $studio-gray-0; .woocommerce-list__item-before i { color: $studio-gray-20; } .woocommerce-list__item-title { color: $studio-gray-50; } .woocommerce-list__item-content { display: none; } } .woocommerce-list__item-before i { width: 36px; height: 36px; font-size: 36px; color: $studio-woocommerce-purple-60; } .woocommerce-list__item-after i { color: $studio-gray-60; } } .woocommerce-list__item-title { color: $studio-gray-80; } .woocommerce-list__item-content { color: $studio-gray-50; } #wpbody-content { position: relative; } .components-modal__screen-overlay { background: rgba(43, 45, 47, 0.4); } .components-modal__frame { .components-modal__header { border-bottom: 0; margin-bottom: 0; } .woocommerce-task-payments__stripe-error-wrapper { align-items: flex-end; flex-grow: 1; display: flex; flex-direction: column; } } .woocommerce-task-dashboard__welcome-modal { width: 400px; .components-modal__header-heading-container { justify-content: center; } .components-modal__header-heading { display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 20px; } .woocommerce-task-dashboard__welcome-modal-icon { font-size: 56px; margin-bottom: $gap; } .components-modal__header { height: auto; margin-bottom: $gap; position: static; } .components-modal__content { padding: $gap * 2; text-align: center; } .woocommerce-task-dashboard__welcome-modal-message p { font-size: 16px; color: $studio-gray-60; } .components-modal__header .components-icon-button { position: absolute; left: auto; right: 0; top: 0; padding: $gap; &:hover { box-shadow: none; } svg { width: 30px; height: 30px; } svg path { fill: $studio-gray-60; } } } } .woocommerce-shipping-rate { display: flex; padding-top: $gap-small; padding-bottom: $gap-small; .woocommerce-shipping-rate__main { width: 100%; } .woocommerce-shipping-rate__icon { padding-top: $gap; margin-right: $gap-large; } .woocommerce-shipping-rate__name { align-items: center; display: flex; padding-top: $gap; font-size: 16px; line-height: 22px; color: $studio-gray-90; margin-bottom: $gap-small; border-top: 1px solid $studio-gray-5; .components-form-toggle { margin-left: auto; height: 18px; } } .woocommerce-shipping-rate__control-wrapper { .components-base-control { margin-bottom: 0; } .components-base-control__label { display: block; position: relative; top: -8px; width: 100%; font-size: 12px; } .text-control-with-affixes__prefix, .text-control-with-affixes__suffix { font-size: 16px; line-height: 24px; color: $studio-gray-50; border: 0; padding: 0; align-items: center; display: flex; top: -12px; } .components-text-control__input { position: relative; top: -12px; } .text-control-with-affixes__prefix { margin-right: $gap-smallest; } .text-control-with-affixes__suffix { margin-left: $gap-smallest; } } } .woocommerce-task-tax__automated-tax-control { display: flex; align-items: center; margin-top: $gap; i { margin-left: $gap; margin-right: $gap-large; } .woocommerce-task-tax__automated-tax-control-inner { border-top: 1px solid $studio-gray-5; display: flex; align-items: center; flex: 1; font-size: 16px; padding-top: $gap; padding-bottom: $gap; } .components-form-toggle { margin-left: auto; } } .woocommerce-task-tax__success { display: flex; flex-direction: column; align-items: center; padding: $gap-largest; text-align: center; .woocommerce-task-tax__success-icon { font-size: 48px; height: 48px; align-items: center; display: flex; } #woocommerce-task-tax__success-message { font-size: 32px; font-weight: 400; } .components-button.is-primary { min-width: 328px; @include breakpoint( '<782px' ) { min-width: auto; } } p { margin-top: 0; font-size: 16px; } } .woocommerce-task-payment { .woocommerce-card__body { display: flex; padding: $gap-large $gap-larger; align-items: center; position: relative; overflow: hidden; } .woocommerce-task-payment__recommended-ribbon { position: absolute; transform: rotate(-45deg) translate(-50%, -50%); background: $studio-gray-80; color: $studio-white; font-size: 11px; line-height: 20px; position: absolute; top: 0; left: 0; line-height: 1; padding: 7px $gap-largest; transform-origin: top left; margin-top: 36px; margin-left: 36px; span { max-width: 70px; } } .woocommerce-task-payment__before { margin-right: $gap-larger; img { max-width: 100px; } } .woocommerce-task-payment__title { font-size: 16px; font-weight: 400; color: $studio-gray-80; margin-top: 0; margin-bottom: $gap-smaller; } .woocommerce-task-payment__content { font-size: 14px; color: $studio-gray-60; margin: 0; margin-right: $gap-larger; } .woocommerce-task-payment__after { margin-left: auto; .components-button.is-button { margin: 0; } } @include breakpoint( '<600px' ) { .woocommerce-card__body { flex-direction: column; } .woocommerce-task-payment__recommended-ribbon { display: none; } .woocommerce-task-payment__before { order: 1; margin-right: auto; margin-bottom: $gap-large; } .woocommerce-task-payment__after { position: absolute; right: $gap-larger; top: $gap-large; .components-form-toggle { margin-top: $gap-smallest; } } .woocommerce-task-payment__text { order: 3; margin-top: $gap; } } } .woocommerce-task-payment-method { .woocommerce-card__body { padding: $gap-large; > h3 { margin: 0; color: $studio-gray-90; } p { font-size: 14px; color: $studio-gray-50; font-weight: 400; margin-top: 2px; margin-bottom: $gap-smaller; } } } .woocommerce-task-payment-method__fields { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 0 $gap; margin-bottom: $gap-smaller; .components-base-control { margin-bottom: 0; } } .woocommerce-task-dashboard__container .woocommerce-task-payments .woocommerce-task-payments__actions { text-align: center; button.components-button.is-primary { margin: 0; } button.components-button.is-link { margin: 0; height: auto; color: $studio-gray-60; font-weight: normal; } } .woocommerce-task-appearance { .woocommerce-image-upload { margin-bottom: $gap-smallest; } } .woocommerce-task-card__prompt { width: 100%; min-width: 100%; margin-bottom: $gap-large; margin-top: -$gap-smallest; cursor: default; .components-snackbar__content { display: block; align-items: unset; justify-content: unset; span { margin-left: -$gap-large; } } .woocommerce-task-card__prompt-actions { button.is-link, button.is-link:active, button.is-link:focus { color: $studio-white; margin-left: $gap-large; background: transparent; } button.is-link:hover { color: $studio-white; } } .woocommerce-task-card__prompt-pointer { border-bottom: 10px solid $core-grey-dark-700; /* Snackbar color */ border-left: 10px solid transparent; border-right: 10px solid transparent; position: relative; width: 0; height: 0; display: inline-block; top: -30px; } .woocommerce-task-card__prompt-content { display: flex; align-items: baseline; justify-content: space-between; max-height: 10px; margin-left: $gap-large; position: relative; top: -40px; } .woocommerce-task-card__prompt-actions { margin-right: -$gap; } &:hover { .woocommerce-task-card__prompt-pointer { border-bottom-color: $core-grey-dark-900; /* Snackbar hover */ } } } .woocommerce-task-card__section-controls { .dashicon { margin: 0 $gap-smaller 0 0; vertical-align: bottom; } .woocommerce-ellipsis-menu__item { padding-bottom: 10px; } }