diff --git a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.style.less b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.style.less index 74ae97d24514..9d638012dc7a 100644 --- a/projects/addon-commerce/components/input-card-grouped/input-card-grouped.style.less +++ b/projects/addon-commerce/components/input-card-grouped/input-card-grouped.style.less @@ -12,8 +12,6 @@ height: var(--tui-height-l); width: @width-full; border-radius: var(--tui-radius-m); - overflow: hidden; - isolation: isolate; &[data-mode='onDark'] { --tui-autofill: var(--tui-autofill-night); @@ -43,9 +41,8 @@ height: 100%; &_cvc { - inline-size: 50%; margin-left: @offset-full; - transform: translate3d(200%, 0, 0); + transform: translate3d(100%, 0, 0); :host-context(tui-root._mobile) & { margin-left: @offset-small; @@ -53,18 +50,7 @@ } &_expire { - inline-size: 50%; - transform: translate3d(@wrapper-offset-full, 0, 0); - - :host-context(tui-root._mobile) & { - transform: translate3d(@wrapper-offset-small, 0, 0); - } - - .t-placeholder, - .t-input { - margin-inline-start: 0; - padding-inline-start: 100% !important; - } + transform: translate3d(100%, 0, 0); } &_active { @@ -73,13 +59,6 @@ :host-context(tui-root._mobile) & { transform: translate3d(@wrapper-offset-small, 0, 0); } - - &.t-wrapper_expire { - .t-placeholder, - .t-input { - padding-inline-start: var(--tui-padding-l) !important; - } - } } } @@ -127,7 +106,7 @@ .t-input { .textfield-input(); - .transition(~'background, padding'); + .transition(background); border: 0; padding: 0 1rem; @@ -150,19 +129,12 @@ caret-color: var(--tui-base-09); color: transparent !important; -webkit-text-fill-color: transparent !important; - transition: - background-color 600000s 0s, - padding var(--tui-duration) ease-in-out; } //noinspection CssInvalidPseudoSelector &::-webkit-credit-card-auto-fill-button { .webkit-auto-fill-button-hidden(); } - - &:focus { - z-index: 1; - } } &_inert { @@ -199,13 +171,8 @@ .textfield-placeholder(); margin: 1.125rem 1rem; line-height: 1.25rem; - width: auto; } .t-ghost { visibility: hidden; } - -tui-svg { - z-index: 1; -}