@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
1 lines • 2.25 kB
CSS
.eufemia-scope--11_8_2 .dnb-forms-submit-indicator{--padding-left:0.5em;--font-animation:font-size var(--font-animation-duration,400ms) var(--easing-default);--opacity-animation:opacity var(--opacity-animation-duration,0ms) var(--easing-default) var(--opacity-animation-delay,0ms);--dots-color:var(--token-color-text-neutral)}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator:has(.dnb-forms-submit-indicator__label){--font-animation-duration:400ms;--opacity-animation-duration:400ms;--opacity-animation-delay:250ms}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator{display:inline}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator__label{padding:.5em 0}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator__content{align-items:center;font-size:0;line-height:1em;opacity:0;transition:var(--font-animation),var(--opacity-animation);will-change:font-size opacity}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator__content b{animation-duration:1.2s;animation-iteration-count:infinite;animation-name:submit-indicator-dot;background-color:var(--dots-color);border-radius:50%;display:inline-block;height:.25em;margin-left:.25em;opacity:.2;transform:scale(.75);width:.25em}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator__content b:first-of-type{animation-delay:50ms;margin-left:var(--padding-left)}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator__content b:nth-of-type(2){animation-delay:.2s}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator__content b:nth-of-type(3){animation-delay:.4s}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator--state-pending .dnb-forms-submit-indicator__content{font-size:1em;opacity:1}.eufemia-scope--11_8_2 .dnb-forms-submit-indicator--inline-wrap .dnb-forms-submit-indicator__content{--padding-left:0.25em;display:flex}.eufemia-scope--11_8_2 .dnb-button .dnb-forms-submit-indicator__content{--dots-color:currentcolor;cursor:inherit}@keyframes submit-indicator-dot{0%{opacity:.2;transform:scale(.75)}20%{opacity:1;transform:scale(1)}50%{opacity:1;transform:scale(1)}70%{opacity:.2;transform:scale(.75)}to{opacity:.2;transform:scale(.75)}}@keyframes submit-indicator-success{0%{font-size:1em;opacity:.2}20%{font-size:1em;opacity:1}80%{opacity:1}85%{font-size:1em;opacity:.3}90%{opacity:0}to{font-size:0;opacity:0}}