UNPKG

monday-ui-react-core

Version:

Official monday.com UI resources for application development in React.js

github.com/mondaycom/vibe

mondaycom/vibe

3 lines (2 loc) • 3.26 kB
1
2
3
var n={counter:"counter",withAnimation:"withAnimation",counterPopElastic:"counterPopElastic",sizeSmall:"sizeSmall",sizeLarge:"sizeLarge",kindFill:"kindFill",colorPrimary:"colorPrimary",colorDark:"colorDark",colorNegative:"colorNegative",colorLight:"colorLight",kindLine:"kindLine",fadeEnter:"fadeEnter",fadeEnterActive:"fadeEnterActive",fadeExit:"fadeExit",fadeExitActive:"fadeExitActive","counter-pop-elastic":"counter-pop-elastic"};!function(n){const o="s_id-2d04cfa2a785_2_149_4";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+o))return;const t=document.createElement("style");t.id=o,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".counter {\n display: inline-flex;\n justify-content: center;\n border-radius: 30px;\n overflow: hidden;\n transform-origin: center;\n}\n@keyframes counter-pop-elastic {\n 0% {\n transform: scale(1);\n }\n 33% {\n transform: scale(1.2);\n }\n 66% {\n transform: scale(0.9);\n }\n 100% {\n transform: scale(1);\n }\n}\n.withAnimation {\n animation: counterPopElastic var(--motion-expressive-short);\n}\n.sizeSmall {\n font: var(--font-text2-normal);\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n min-width: 18px;\n line-height: 18px;\n padding: 0 var(--spacing-small);\n}\n.sizeLarge {\n -webkit-font-smoothing: var(--font-smoothing-webkit);\n -moz-osx-font-smoothing: var(--font-smoothing-moz);\n font: var(--font-text2-normal);\n min-width: 24px;\n padding: 2px var(--spacing-small);\n}\n.kindFill.colorPrimary {\n color: var(--fixed-light-color);\n background-color: var(--primary-color);\n}\n.kindFill.colorDark {\n color: var(--text-color-on-inverted);\n background-color: var(--inverted-color-background);\n}\n.kindFill.colorNegative {\n color: var(--fixed-light-color);\n background-color: var(--negative-color);\n}\n.kindFill.colorLight {\n color: var(--primary-text-color);\n background-color: var(--ui-background-color);\n}\n.kindLine {\n box-shadow: 0 0 0 1px currentColor inset;\n}\n.kindLine.colorPrimary {\n color: var(--primary-color);\n}\n.kindLine.colorDark {\n color: var(--inverted-color-background);\n}\n.kindLine.colorNegative {\n color: var(--negative-color);\n}\n.kindLine.colorLight {\n color: var(--primary-text-color);\n box-shadow: 0 0 0 1px var(--ui-background-color) inset !important;\n}\n/* New number enters */\n.fadeEnter {\n opacity: 0;\n transform: translateY(15px);\n}\n.fadeEnterActive {\n position: relative;\n opacity: 1;\n transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n transform: translateY(0);\n}\n/* Old number exits */\n.fadeExit {\n position: relative;\n opacity: 1;\n transform: translateY(0);\n}\n.fadeExitActive {\n position: relative;\n opacity: 0;\n transform: translateY(-15px);\n transition: transform var(--motion-productive-long) var(--motion-timing-exit), opacity var(--motion-productive-short);\n}");export{n as default}; //# sourceMappingURL=Counter.module.scss.js.map