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) • 2.89 kB
1
2
3
var n={expandCollapse:"expandCollapse",header:"header","focus-visible":"focus-visible",headerContent:"headerContent",iconComponent:"iconComponent",content:"content",section:"section",hideBorder:"hideBorder",hideBorderBottom:"hideBorderBottom",showBorder:"showBorder",headerOpen:"headerOpen",animateIconOpen:"animateIconOpen",animateIconClose:"animateIconClose"};!function(n){const e="s_id-b80b356395ac_2_149_4";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".expandCollapse {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n color: var(--primary-text-color);\n background-color: transparent;\n box-sizing: border-box;\n border-radius: var(--border-radius-small);\n}\n\n.header {\n border: none;\n margin: 0;\n padding: 0;\n width: auto;\n overflow: visible;\n background: transparent;\n /* inherit font & color from ancestor */\n color: inherit;\n font: inherit;\n /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n line-height: normal;\n /* Corrects font smoothing for webkit */\n -webkit-font-smoothing: inherit;\n -moz-osx-font-smoothing: inherit;\n /* Corrects inability to style clickable `input` types in iOS */\n appearance: none;\n padding: var(--spacing-medium);\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n}\n\n.header:focus-visible, .header.focus-visible {\n outline: none;\n z-index: 11;\n border-radius: 4px;\n box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n\n.header:focus:not(.focus-visible) {\n outline: none;\n}\n\n.header:hover {\n background-color: var(--primary-background-hover-color);\n}\n\n.header:active {\n transform: scale(1);\n}\n\n.header .headerContent {\n margin: 0;\n}\n\n.header .iconComponent {\n color: var(--icon-color);\n}\n\n.content {\n padding: var(--spacing-medium);\n}\n\n.section {\n width: 100%;\n}\n\n.hideBorder {\n border: none;\n}\n\n.hideBorderBottom {\n border-bottom: none;\n}\n\n.showBorder {\n border: 1px solid var(--ui-border-color);\n}\n\n.showBorder .headerOpen {\n border-bottom: 1px solid;\n border-color: var(--ui-border-color);\n}\n\n.animateIconOpen {\n transform: rotate(-180deg);\n transition: transform var(--motion-expressive-short) var(--motion-timing-transition);\n}\n\n.animateIconClose {\n transform: rotate(-360deg);\n transition: transform var(--motion-expressive-short) var(--motion-timing-transition);\n}");export{n as default}; //# sourceMappingURL=ExpandCollapse.module.scss.js.map