@speakapbv/dough-component-library 10.6.0 → 10.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.es.js +1 -1
  2. package/dist/index.js +1 -1
  3. package/package.json +1 -1
package/dist/index.es.js CHANGED
@@ -229,7 +229,7 @@ var cn = (function () {
229
229
  return classesList.join(" ").trim();
230
230
  });
231
231
 
232
- var css_248z$1 = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-button-wrapper {\n border: none;\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n position: relative;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n line-height: 0;\n cursor: pointer;\n}\n.dough-button-wrapper * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-not-clickable, .dough-button-wrapper.dough-button-not-clickable * {\n pointer-events: none;\n}\nhtml.dough-IE11 .dough-button-wrapper {\n line-height: normal !important;\n overflow: visible;\n}\nhtml.dough-IE11 .dough-button-wrapper:hover > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.06 !important;\n}\nhtml.dough-IE11 .dough-button-wrapper:active > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.13 !important;\n}\n.dough-button-wrapper:focus, .dough-button-wrapper:active {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper:focus *, .dough-button-wrapper:active * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-full-width {\n width: 100%;\n min-width: 100%;\n max-width: 100%;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button {\n min-width: 100%;\n max-width: 100%;\n margin: 0 auto;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button > .dough-button-label {\n width: 100% !important;\n text-align: center;\n}\n\n.dough-button {\n display: inline-flex;\n flex-flow: row nowrap;\n justify-content: center;\n align-items: center;\n -webkit-tap-highlight-color: transparent;\n border-radius: 6px;\n position: relative;\n outline-color: rgba(0, 0, 0, 0);\n overflow: visible;\n box-sizing: border-box;\n pointer-events: all;\n z-index: 100;\n background-color: transparent !important;\n position: relative;\n}\n.dough-button:not(.dough-button-no-padding) {\n padding: 8px;\n}\nhtml.dough-IE11 .dough-button:not(.dough-button-no-padding) > .dough-button-label {\n margin: 4px;\n}\n.dough-button.dough-button-shadow:not(.dough-color-transparent):not(.dough-button-as-link) {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);\n}\nbody:not(.no-transition) .dough-button {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n width: auto;\n height: auto;\n overflow: visible;\n border-radius: 6px;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > svg {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 10;\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n.dough-button > .dough-button-background-wrapper > svg:not(.dough-button-background-wrapper-border-svg) {\n opacity: 0.1;\n}\n.dough-button > .dough-button-background-wrapper > svg.dough-button-background-wrapper-border-svg {\n stroke-width: 2px;\n z-index: 20;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 5;\n width: auto;\n height: auto;\n transform-origin: center center;\n border-radius: 6px;\n opacity: 0;\n transform: translate3d(0, 0, 0) scale(1);\n background-color: transparent !important;\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0);\n}\nhtml.dough-IE11 .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 105;\n width: auto;\n height: auto;\n border-radius: 6px;\n opacity: 0;\n background-color: black !important;\n animation: none !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-background {\n box-shadow: 0px 0px 0px 3px var(--dough-color-background);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-theme {\n box-shadow: 0px 0px 0px 3px var(--dough-color-theme);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-white {\n box-shadow: 0px 0px 0px 3px var(--dough-color-white);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-primary {\n box-shadow: 0px 0px 0px 3px var(--dough-color-primary);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-dark {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-dark);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-button {\n box-shadow: 0px 0px 0px 3px var(--dough-color-button);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-like {\n box-shadow: 0px 0px 0px 3px var(--dough-color-like);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-success {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-success);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-danger {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-danger);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-6 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-6);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px var(--dough-color-transparent);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0.1);\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: button-glow 1000ms 1 forwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter {\n position: absolute;\n right: 3px;\n bottom: 3px;\n left: 3px;\n z-index: 20;\n width: auto;\n height: 3px;\n border-radius: 3px;\n overflow: hidden;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n position: relative;\n display: block;\n content: \"\";\n width: 100%;\n height: 100%;\n opacity: 0.4;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: button-waiter 2000ms infinite backwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button.dough-button-color-picker.dough-button-with-border > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n}\n.dough-button.dough-button-color-picker > .dough-button-background-wrapper {\n transition-duration: 0s !important;\n}\n.dough-button.dough-button-size-extra-small {\n padding: 4px 12px 4px 12px;\n min-width: 24px;\n min-height: 24px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-color-picker {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-extra-small > .dough-button-icon {\n width: 20px;\n height: 20px;\n min-width: 0;\n}\n.dough-button.dough-button-size-extra-small .dough-inline-svg-icon {\n width: 12px !important;\n height: 12px !important;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) > .dough-button-icon {\n width: 12px;\n height: 12px;\n}\n.dough-button.dough-button-size-small {\n min-width: 32px;\n min-height: 32px;\n}\nhtml.dough-IE11 .dough-button.dough-button-size-small {\n height: 32px;\n}\n.dough-button.dough-button-size-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-small > .dough-button-icon {\n min-width: 16px;\n width: 16px;\n height: 16px;\n font-size: 16px;\n}\n.dough-button.dough-button-size-small .dough-inline-svg-icon {\n width: 16px !important;\n height: 16px !important;\n}\n.dough-button.dough-button-size-normal {\n min-width: 40px;\n min-height: 40px;\n}\n.dough-button.dough-button-size-normal.dough-button-rounded {\n border-radius: 20px;\n}\n.dough-button.dough-button-size-extra-large, .dough-button.dough-button-size-large {\n min-width: 48px;\n min-height: 48px;\n}\n.dough-button.dough-button-size-extra-large.dough-button-rounded, .dough-button.dough-button-size-large.dough-button-rounded {\n border-radius: 24px;\n}\n.dough-button .dough-inline-svg-icon {\n display: inline-block;\n font-size: inherit;\n width: 20px;\n height: 20px;\n overflow: visible;\n}\n.dough-button.dough-button-wait, .dough-button.dough-button-disabled, .dough-button.dough-button-disabled * {\n pointer-events: none !important;\n}\n.dough-button.dough-button-disabled {\n opacity: 0.5;\n}\n.dough-button.align-right {\n float: right;\n}\n.dough-button > .dough-button-label {\n width: initial !important;\n height: initial !important;\n color: inherit !important;\n font-size: 0.75rem;\n line-height: initial !important;\n position: relative;\n z-index: 1;\n font-weight: 700;\n font-family: \"Roboto\", sans-serif;\n}\nhtml.dough-IE11 .dough-button > .dough-button-label {\n line-height: normal !important;\n}\n.dough-button > .dough-button-label:empty {\n display: none;\n}\n.dough-button > .dough-button-icon {\n display: flex;\n flex-flow: row nowrap;\n box-sizing: border-box;\n overflow: visible;\n position: relative;\n z-index: 1;\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 16px;\n justify-content: center;\n align-items: center;\n}\n.dough-button > .dough-button-icon + .dough-button-label {\n margin-left: 8px !important;\n}\n.dough-button.dough-color-transparent > .dough-button-icon {\n color: var(--dough-color-icon-default);\n}\nhtml.dough-IE11 .dough-button.dough-color-transparent > .dough-button-icon {\n color: #999999;\n}\n.dough-button.dough-button-rounded {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 40px !important;\n}\n.dough-button.dough-button-flat {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 0 !important;\n}\n.dough-button:not(.dough-button-has-label) > .dough-button-label {\n display: none;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-small {\n width: 32px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-normal {\n width: 40px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-large {\n width: 48px;\n}\n.dough-button.dough-button-as-link {\n padding: 0;\n min-height: auto;\n text-decoration: underline;\n background-color: rgba(0, 0, 0, 0) !important;\n color: var(--dough-color-text-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link {\n color: rgb(110, 111, 117) !important;\n}\n.dough-button.dough-button-as-link > .dough-button-label {\n font-weight: initial;\n}\n.dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: var(--dough-color-icon-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: #999999 !important;\n}\n.dough-button.dough-button-no-padding {\n min-width: auto;\n}\n\n@keyframes button-glow {\n 0% {\n transform: translate3d(0, 0, 0) scale(0.7);\n opacity: 0;\n }\n 20% {\n opacity: 0.4;\n transform: translate3d(0, 0, 0) scale(1);\n }\n 100% {\n transform: translate3d(0, 0, 0) scale(1);\n opacity: 0;\n }\n}\n@keyframes button-waiter {\n 0% {\n transform: translate3d(-100%, 0, 0);\n }\n 20% {\n transform: translate3d(0, 0, 0);\n }\n 35% {\n transform: translate3d(100%, 0, 0);\n }\n 50% {\n transform: translate3d(100%, 0, 0);\n }\n 70% {\n transform: translate3d(0, 0, 0);\n }\n 85% {\n transform: translate3d(-100%, 0, 0);\n }\n 100% {\n transform: translate3d(-100%, 0, 0);\n }\n}\n@media (hover: hover) and (pointer: fine) {\n .dough-button.dough-button-color-picker:not(.dough-button-with-border):hover > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(94%);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover), .dough-button:not(.dough-button-color-picker):active {\n box-shadow: none !important;\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper.dough-color-transparent, .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper:not(.dough-color-transparent), .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(87%);\n }\n}";
232
+ var css_248z$1 = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-button-wrapper {\n border: none;\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n position: relative;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n line-height: 0;\n cursor: pointer;\n}\n.dough-button-wrapper * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-not-clickable, .dough-button-wrapper.dough-button-not-clickable * {\n pointer-events: none;\n}\nhtml.dough-IE11 .dough-button-wrapper {\n line-height: normal !important;\n overflow: visible;\n}\nhtml.dough-IE11 .dough-button-wrapper:hover > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.06 !important;\n}\nhtml.dough-IE11 .dough-button-wrapper:active > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.13 !important;\n}\n.dough-button-wrapper:focus, .dough-button-wrapper:active {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper:focus *, .dough-button-wrapper:active * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-full-width {\n width: 100%;\n min-width: 100%;\n max-width: 100%;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button {\n min-width: 100%;\n max-width: 100%;\n margin: 0 auto;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button > .dough-button-label {\n width: 100% !important;\n text-align: center;\n}\n\n.dough-button {\n display: inline-flex;\n flex-flow: row nowrap;\n justify-content: center;\n align-items: center;\n -webkit-tap-highlight-color: transparent;\n border-radius: 6px;\n position: relative;\n outline-color: rgba(0, 0, 0, 0);\n overflow: visible;\n box-sizing: border-box;\n pointer-events: all;\n z-index: 100;\n background-color: transparent !important;\n position: relative;\n}\n.dough-button:not(.dough-button-no-padding) {\n padding: 8px;\n}\nhtml.dough-IE11 .dough-button:not(.dough-button-no-padding) > .dough-button-label {\n margin: 4px;\n}\n.dough-button.dough-button-shadow:not(.dough-color-transparent):not(.dough-button-as-link) {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);\n}\nbody:not(.no-transition) .dough-button {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n width: auto;\n height: auto;\n overflow: visible;\n border-radius: 6px;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > svg {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 10;\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n.dough-button > .dough-button-background-wrapper > svg:not(.dough-button-background-wrapper-border-svg) {\n opacity: 0.1;\n}\n.dough-button > .dough-button-background-wrapper > svg.dough-button-background-wrapper-border-svg {\n stroke-width: 2px;\n z-index: 20;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 5;\n width: auto;\n height: auto;\n transform-origin: center center;\n border-radius: 6px;\n opacity: 0;\n transform: translate3d(0, 0, 0) scale(1);\n background-color: transparent !important;\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0);\n}\nhtml.dough-IE11 .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 105;\n width: auto;\n height: auto;\n border-radius: 6px;\n opacity: 0;\n background-color: black !important;\n animation: none !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-background {\n box-shadow: 0px 0px 0px 3px var(--dough-color-background);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-theme {\n box-shadow: 0px 0px 0px 3px var(--dough-color-theme);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-white {\n box-shadow: 0px 0px 0px 3px var(--dough-color-white);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-primary {\n box-shadow: 0px 0px 0px 3px var(--dough-color-primary);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-dark {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-dark);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-button {\n box-shadow: 0px 0px 0px 3px var(--dough-color-button);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-like {\n box-shadow: 0px 0px 0px 3px var(--dough-color-like);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-success {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-success);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-danger {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-danger);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-6 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-6);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px var(--dough-color-transparent);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0.1);\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: button-glow 1000ms 1 forwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter {\n position: absolute;\n right: 3px;\n bottom: 3px;\n left: 3px;\n z-index: 20;\n width: auto;\n height: 3px;\n border-radius: 3px;\n overflow: hidden;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n position: relative;\n display: block;\n content: \"\";\n width: 100%;\n height: 100%;\n opacity: 0.4;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: button-waiter 2000ms infinite backwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button.dough-button-color-picker.dough-button-with-border > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n}\n.dough-button.dough-button-color-picker > .dough-button-background-wrapper {\n transition-duration: 0s !important;\n}\n.dough-button.dough-button-size-extra-small {\n padding: 4px 12px 4px 12px;\n min-width: 24px;\n min-height: 24px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-color-picker {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-extra-small > .dough-button-icon {\n width: 20px;\n height: 20px;\n min-width: 0;\n}\n.dough-button.dough-button-size-extra-small .dough-inline-svg-icon {\n width: 12px !important;\n height: 12px !important;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) > .dough-button-icon {\n width: 12px;\n height: 12px;\n}\n.dough-button.dough-button-size-small {\n min-width: 32px;\n min-height: 32px;\n}\nhtml.dough-IE11 .dough-button.dough-button-size-small {\n height: 32px;\n}\n.dough-button.dough-button-size-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-small > .dough-button-icon {\n min-width: 16px;\n width: 16px;\n height: 16px;\n font-size: 16px;\n}\n.dough-button.dough-button-size-small .dough-inline-svg-icon {\n width: 16px !important;\n height: 16px !important;\n}\n.dough-button.dough-button-size-normal {\n min-width: 40px;\n min-height: 40px;\n}\n.dough-button.dough-button-size-normal.dough-button-rounded {\n border-radius: 20px;\n}\n.dough-button.dough-button-size-extra-large, .dough-button.dough-button-size-large {\n min-width: 48px;\n min-height: 48px;\n}\n.dough-button.dough-button-size-extra-large.dough-button-rounded, .dough-button.dough-button-size-large.dough-button-rounded {\n border-radius: 24px;\n}\n.dough-button .dough-inline-svg-icon {\n display: inline-block;\n font-size: inherit;\n width: 20px;\n height: 20px;\n overflow: visible;\n}\n.dough-button.dough-button-wait, .dough-button.dough-button-disabled, .dough-button.dough-button-disabled * {\n pointer-events: none !important;\n}\n.dough-button.dough-button-disabled {\n opacity: 0.5;\n}\n.dough-button.align-right {\n float: right;\n}\n.dough-button > .dough-button-label {\n width: initial !important;\n height: initial !important;\n color: inherit !important;\n font-size: 0.75rem;\n line-height: initial !important;\n position: relative;\n z-index: 1;\n font-weight: 700;\n font-family: \"Roboto\", sans-serif;\n}\nhtml.dough-IE11 .dough-button > .dough-button-label {\n line-height: normal !important;\n}\n.dough-button > .dough-button-label:empty {\n display: none;\n}\n.dough-button > .dough-button-label + .dough-button-icon {\n margin-left: 8px !important;\n}\n.dough-button > .dough-button-icon {\n display: flex;\n flex-flow: row nowrap;\n box-sizing: border-box;\n overflow: visible;\n position: relative;\n z-index: 1;\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 16px;\n justify-content: center;\n align-items: center;\n}\n.dough-button > .dough-button-icon + .dough-button-label {\n margin-left: 8px !important;\n}\n.dough-button.dough-color-transparent > .dough-button-icon {\n color: var(--dough-color-icon-default);\n}\nhtml.dough-IE11 .dough-button.dough-color-transparent > .dough-button-icon {\n color: #999999;\n}\n.dough-button.dough-button-rounded {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 40px !important;\n}\n.dough-button.dough-button-flat {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 0 !important;\n}\n.dough-button:not(.dough-button-has-label) > .dough-button-label {\n display: none;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-small {\n width: 32px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-normal {\n width: 40px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-large {\n width: 48px;\n}\n.dough-button.dough-button-as-link {\n padding: 0;\n min-height: auto;\n text-decoration: underline;\n background-color: rgba(0, 0, 0, 0) !important;\n color: var(--dough-color-text-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link {\n color: rgb(110, 111, 117) !important;\n}\n.dough-button.dough-button-as-link > .dough-button-label {\n font-weight: initial;\n}\n.dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: var(--dough-color-icon-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: #999999 !important;\n}\n.dough-button.dough-button-no-padding {\n min-width: auto;\n}\n\n@keyframes button-glow {\n 0% {\n transform: translate3d(0, 0, 0) scale(0.7);\n opacity: 0;\n }\n 20% {\n opacity: 0.4;\n transform: translate3d(0, 0, 0) scale(1);\n }\n 100% {\n transform: translate3d(0, 0, 0) scale(1);\n opacity: 0;\n }\n}\n@keyframes button-waiter {\n 0% {\n transform: translate3d(-100%, 0, 0);\n }\n 20% {\n transform: translate3d(0, 0, 0);\n }\n 35% {\n transform: translate3d(100%, 0, 0);\n }\n 50% {\n transform: translate3d(100%, 0, 0);\n }\n 70% {\n transform: translate3d(0, 0, 0);\n }\n 85% {\n transform: translate3d(-100%, 0, 0);\n }\n 100% {\n transform: translate3d(-100%, 0, 0);\n }\n}\n@media (hover: hover) and (pointer: fine) {\n .dough-button.dough-button-color-picker:not(.dough-button-with-border):hover > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(94%);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover), .dough-button:not(.dough-button-color-picker):active {\n box-shadow: none !important;\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper.dough-color-transparent, .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper:not(.dough-color-transparent), .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(87%);\n }\n}";
233
233
  styleInject(css_248z$1);
234
234
 
235
235
  var css_248z$2 = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-link {\n box-sizing: border-box;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n text-decoration: none;\n cursor: pointer;\n pointer-events: all !important;\n display: inline-block;\n line-height: normal;\n white-space: pre-line;\n word-break: break-word;\n position: relative;\n}\n.dough-link * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-link.disabled {\n pointer-events: none !important;\n}\nhtml.dough-IE11 .dough-link:hover {\n opacity: 0.83;\n}\nbody:not(.no-transition) .dough-link {\n transition: filter 350ms cubic-bezier(0.25, 1, 0, 1), transform 1500ms cubic-bezier(0.12, 1, 0, 1);\n}\nbody.no-transition .dough-link {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-link.dough-link-full-width {\n width: 100%;\n box-sizing: border-box;\n}\n.dough-link:visited, .dough-link:link, .dough-link:active {\n text-decoration: none;\n}\n.dough-link.dough-link-disabled {\n pointer-events: none !important;\n}\n.dough-link.dough-link-color-only-on-hover:not(:hover) {\n color: inherit !important;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .dough-link:not(.dough-link-disabled):hover:not(.dough-link-no-underline) {\n text-decoration: underline;\n }\n .dough-link:not(.dough-link-disabled):not(.dough-button-wrapper):hover {\n filter: brightness(96%);\n }\n}";
package/dist/index.js CHANGED
@@ -224,7 +224,7 @@ var cn = (function () {
224
224
  return classesList.join(" ").trim();
225
225
  });
226
226
 
227
- var css_248z$1 = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-button-wrapper {\n border: none;\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n position: relative;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n line-height: 0;\n cursor: pointer;\n}\n.dough-button-wrapper * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-not-clickable, .dough-button-wrapper.dough-button-not-clickable * {\n pointer-events: none;\n}\nhtml.dough-IE11 .dough-button-wrapper {\n line-height: normal !important;\n overflow: visible;\n}\nhtml.dough-IE11 .dough-button-wrapper:hover > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.06 !important;\n}\nhtml.dough-IE11 .dough-button-wrapper:active > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.13 !important;\n}\n.dough-button-wrapper:focus, .dough-button-wrapper:active {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper:focus *, .dough-button-wrapper:active * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-full-width {\n width: 100%;\n min-width: 100%;\n max-width: 100%;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button {\n min-width: 100%;\n max-width: 100%;\n margin: 0 auto;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button > .dough-button-label {\n width: 100% !important;\n text-align: center;\n}\n\n.dough-button {\n display: inline-flex;\n flex-flow: row nowrap;\n justify-content: center;\n align-items: center;\n -webkit-tap-highlight-color: transparent;\n border-radius: 6px;\n position: relative;\n outline-color: rgba(0, 0, 0, 0);\n overflow: visible;\n box-sizing: border-box;\n pointer-events: all;\n z-index: 100;\n background-color: transparent !important;\n position: relative;\n}\n.dough-button:not(.dough-button-no-padding) {\n padding: 8px;\n}\nhtml.dough-IE11 .dough-button:not(.dough-button-no-padding) > .dough-button-label {\n margin: 4px;\n}\n.dough-button.dough-button-shadow:not(.dough-color-transparent):not(.dough-button-as-link) {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);\n}\nbody:not(.no-transition) .dough-button {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n width: auto;\n height: auto;\n overflow: visible;\n border-radius: 6px;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > svg {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 10;\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n.dough-button > .dough-button-background-wrapper > svg:not(.dough-button-background-wrapper-border-svg) {\n opacity: 0.1;\n}\n.dough-button > .dough-button-background-wrapper > svg.dough-button-background-wrapper-border-svg {\n stroke-width: 2px;\n z-index: 20;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 5;\n width: auto;\n height: auto;\n transform-origin: center center;\n border-radius: 6px;\n opacity: 0;\n transform: translate3d(0, 0, 0) scale(1);\n background-color: transparent !important;\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0);\n}\nhtml.dough-IE11 .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 105;\n width: auto;\n height: auto;\n border-radius: 6px;\n opacity: 0;\n background-color: black !important;\n animation: none !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-background {\n box-shadow: 0px 0px 0px 3px var(--dough-color-background);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-theme {\n box-shadow: 0px 0px 0px 3px var(--dough-color-theme);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-white {\n box-shadow: 0px 0px 0px 3px var(--dough-color-white);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-primary {\n box-shadow: 0px 0px 0px 3px var(--dough-color-primary);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-dark {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-dark);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-button {\n box-shadow: 0px 0px 0px 3px var(--dough-color-button);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-like {\n box-shadow: 0px 0px 0px 3px var(--dough-color-like);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-success {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-success);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-danger {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-danger);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-6 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-6);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px var(--dough-color-transparent);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0.1);\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: button-glow 1000ms 1 forwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter {\n position: absolute;\n right: 3px;\n bottom: 3px;\n left: 3px;\n z-index: 20;\n width: auto;\n height: 3px;\n border-radius: 3px;\n overflow: hidden;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n position: relative;\n display: block;\n content: \"\";\n width: 100%;\n height: 100%;\n opacity: 0.4;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: button-waiter 2000ms infinite backwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button.dough-button-color-picker.dough-button-with-border > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n}\n.dough-button.dough-button-color-picker > .dough-button-background-wrapper {\n transition-duration: 0s !important;\n}\n.dough-button.dough-button-size-extra-small {\n padding: 4px 12px 4px 12px;\n min-width: 24px;\n min-height: 24px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-color-picker {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-extra-small > .dough-button-icon {\n width: 20px;\n height: 20px;\n min-width: 0;\n}\n.dough-button.dough-button-size-extra-small .dough-inline-svg-icon {\n width: 12px !important;\n height: 12px !important;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) > .dough-button-icon {\n width: 12px;\n height: 12px;\n}\n.dough-button.dough-button-size-small {\n min-width: 32px;\n min-height: 32px;\n}\nhtml.dough-IE11 .dough-button.dough-button-size-small {\n height: 32px;\n}\n.dough-button.dough-button-size-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-small > .dough-button-icon {\n min-width: 16px;\n width: 16px;\n height: 16px;\n font-size: 16px;\n}\n.dough-button.dough-button-size-small .dough-inline-svg-icon {\n width: 16px !important;\n height: 16px !important;\n}\n.dough-button.dough-button-size-normal {\n min-width: 40px;\n min-height: 40px;\n}\n.dough-button.dough-button-size-normal.dough-button-rounded {\n border-radius: 20px;\n}\n.dough-button.dough-button-size-extra-large, .dough-button.dough-button-size-large {\n min-width: 48px;\n min-height: 48px;\n}\n.dough-button.dough-button-size-extra-large.dough-button-rounded, .dough-button.dough-button-size-large.dough-button-rounded {\n border-radius: 24px;\n}\n.dough-button .dough-inline-svg-icon {\n display: inline-block;\n font-size: inherit;\n width: 20px;\n height: 20px;\n overflow: visible;\n}\n.dough-button.dough-button-wait, .dough-button.dough-button-disabled, .dough-button.dough-button-disabled * {\n pointer-events: none !important;\n}\n.dough-button.dough-button-disabled {\n opacity: 0.5;\n}\n.dough-button.align-right {\n float: right;\n}\n.dough-button > .dough-button-label {\n width: initial !important;\n height: initial !important;\n color: inherit !important;\n font-size: 0.75rem;\n line-height: initial !important;\n position: relative;\n z-index: 1;\n font-weight: 700;\n font-family: \"Roboto\", sans-serif;\n}\nhtml.dough-IE11 .dough-button > .dough-button-label {\n line-height: normal !important;\n}\n.dough-button > .dough-button-label:empty {\n display: none;\n}\n.dough-button > .dough-button-icon {\n display: flex;\n flex-flow: row nowrap;\n box-sizing: border-box;\n overflow: visible;\n position: relative;\n z-index: 1;\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 16px;\n justify-content: center;\n align-items: center;\n}\n.dough-button > .dough-button-icon + .dough-button-label {\n margin-left: 8px !important;\n}\n.dough-button.dough-color-transparent > .dough-button-icon {\n color: var(--dough-color-icon-default);\n}\nhtml.dough-IE11 .dough-button.dough-color-transparent > .dough-button-icon {\n color: #999999;\n}\n.dough-button.dough-button-rounded {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 40px !important;\n}\n.dough-button.dough-button-flat {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 0 !important;\n}\n.dough-button:not(.dough-button-has-label) > .dough-button-label {\n display: none;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-small {\n width: 32px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-normal {\n width: 40px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-large {\n width: 48px;\n}\n.dough-button.dough-button-as-link {\n padding: 0;\n min-height: auto;\n text-decoration: underline;\n background-color: rgba(0, 0, 0, 0) !important;\n color: var(--dough-color-text-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link {\n color: rgb(110, 111, 117) !important;\n}\n.dough-button.dough-button-as-link > .dough-button-label {\n font-weight: initial;\n}\n.dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: var(--dough-color-icon-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: #999999 !important;\n}\n.dough-button.dough-button-no-padding {\n min-width: auto;\n}\n\n@keyframes button-glow {\n 0% {\n transform: translate3d(0, 0, 0) scale(0.7);\n opacity: 0;\n }\n 20% {\n opacity: 0.4;\n transform: translate3d(0, 0, 0) scale(1);\n }\n 100% {\n transform: translate3d(0, 0, 0) scale(1);\n opacity: 0;\n }\n}\n@keyframes button-waiter {\n 0% {\n transform: translate3d(-100%, 0, 0);\n }\n 20% {\n transform: translate3d(0, 0, 0);\n }\n 35% {\n transform: translate3d(100%, 0, 0);\n }\n 50% {\n transform: translate3d(100%, 0, 0);\n }\n 70% {\n transform: translate3d(0, 0, 0);\n }\n 85% {\n transform: translate3d(-100%, 0, 0);\n }\n 100% {\n transform: translate3d(-100%, 0, 0);\n }\n}\n@media (hover: hover) and (pointer: fine) {\n .dough-button.dough-button-color-picker:not(.dough-button-with-border):hover > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(94%);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover), .dough-button:not(.dough-button-color-picker):active {\n box-shadow: none !important;\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper.dough-color-transparent, .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper:not(.dough-color-transparent), .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(87%);\n }\n}";
227
+ var css_248z$1 = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-button-wrapper {\n border: none;\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n background-color: transparent;\n font-family: inherit;\n position: relative;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n line-height: 0;\n cursor: pointer;\n}\n.dough-button-wrapper * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-not-clickable, .dough-button-wrapper.dough-button-not-clickable * {\n pointer-events: none;\n}\nhtml.dough-IE11 .dough-button-wrapper {\n line-height: normal !important;\n overflow: visible;\n}\nhtml.dough-IE11 .dough-button-wrapper:hover > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.06 !important;\n}\nhtml.dough-IE11 .dough-button-wrapper:active > .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n opacity: 0.13 !important;\n}\n.dough-button-wrapper:focus, .dough-button-wrapper:active {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper:focus *, .dough-button-wrapper:active * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-button-wrapper.dough-button-full-width {\n width: 100%;\n min-width: 100%;\n max-width: 100%;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button {\n min-width: 100%;\n max-width: 100%;\n margin: 0 auto;\n}\n.dough-button-wrapper.dough-button-full-width > .dough-button > .dough-button-label {\n width: 100% !important;\n text-align: center;\n}\n\n.dough-button {\n display: inline-flex;\n flex-flow: row nowrap;\n justify-content: center;\n align-items: center;\n -webkit-tap-highlight-color: transparent;\n border-radius: 6px;\n position: relative;\n outline-color: rgba(0, 0, 0, 0);\n overflow: visible;\n box-sizing: border-box;\n pointer-events: all;\n z-index: 100;\n background-color: transparent !important;\n position: relative;\n}\n.dough-button:not(.dough-button-no-padding) {\n padding: 8px;\n}\nhtml.dough-IE11 .dough-button:not(.dough-button-no-padding) > .dough-button-label {\n margin: 4px;\n}\n.dough-button.dough-button-shadow:not(.dough-color-transparent):not(.dough-button-as-link) {\n box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);\n}\nbody:not(.no-transition) .dough-button {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n width: auto;\n height: auto;\n overflow: visible;\n border-radius: 6px;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper {\n transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > svg {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 10;\n width: 100%;\n height: 100%;\n overflow: visible;\n}\n.dough-button > .dough-button-background-wrapper > svg:not(.dough-button-background-wrapper-border-svg) {\n opacity: 0.1;\n}\n.dough-button > .dough-button-background-wrapper > svg.dough-button-background-wrapper-border-svg {\n stroke-width: 2px;\n z-index: 20;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 5;\n width: auto;\n height: auto;\n transform-origin: center center;\n border-radius: 6px;\n opacity: 0;\n transform: translate3d(0, 0, 0) scale(1);\n background-color: transparent !important;\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0);\n}\nhtml.dough-IE11 .dough-button > .dough-button-background-wrapper > .dough-button-background-glow {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 105;\n width: auto;\n height: auto;\n border-radius: 6px;\n opacity: 0;\n background-color: black !important;\n animation: none !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-background {\n box-shadow: 0px 0px 0px 3px var(--dough-color-background);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-theme {\n box-shadow: 0px 0px 0px 3px var(--dough-color-theme);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-white {\n box-shadow: 0px 0px 0px 3px var(--dough-color-white);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-primary {\n box-shadow: 0px 0px 0px 3px var(--dough-color-primary);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-header-dark {\n box-shadow: 0px 0px 0px 3px var(--dough-color-header-dark);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-button {\n box-shadow: 0px 0px 0px 3px var(--dough-color-button);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-like {\n box-shadow: 0px 0px 0px 3px var(--dough-color-like);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-success {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-success);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning-light {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning-light);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-warning {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-warning);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-status-danger {\n box-shadow: 0px 0px 0px 3px var(--dough-color-status-danger);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-selector-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-selector-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-1 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-1);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-2 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-2);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-3 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-3);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-4 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-4);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-5 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-5);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-gray-6 {\n box-shadow: 0px 0px 0px 3px var(--dough-color-gray-6);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px var(--dough-color-transparent);\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-color-transparent {\n box-shadow: 0px 0px 0px 3px rgba(0, 0, 0, 0.1);\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: button-glow 1000ms 1 forwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-background-glow.dough-glow-background {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter {\n position: absolute;\n right: 3px;\n bottom: 3px;\n left: 3px;\n z-index: 20;\n width: auto;\n height: 3px;\n border-radius: 3px;\n overflow: hidden;\n}\n.dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n position: relative;\n display: block;\n content: \"\";\n width: 100%;\n height: 100%;\n opacity: 0.4;\n}\nbody:not(.no-transition) .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: button-waiter 2000ms infinite backwards;\n}\nbody.no-transition .dough-button > .dough-button-background-wrapper > .dough-button-waiter > svg {\n animation: none 0ms linear;\n animation-delay: 0ms !important;\n}\n.dough-button.dough-button-color-picker.dough-button-with-border > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n}\n.dough-button.dough-button-color-picker > .dough-button-background-wrapper {\n transition-duration: 0s !important;\n}\n.dough-button.dough-button-size-extra-small {\n padding: 4px 12px 4px 12px;\n min-width: 24px;\n min-height: 24px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-color-picker {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-extra-small > .dough-button-icon {\n width: 20px;\n height: 20px;\n min-width: 0;\n}\n.dough-button.dough-button-size-extra-small .dough-inline-svg-icon {\n width: 12px !important;\n height: 12px !important;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) {\n padding: 4px;\n}\n.dough-button.dough-button-size-extra-small:not(.dough-button-has-label) > .dough-button-icon {\n width: 12px;\n height: 12px;\n}\n.dough-button.dough-button-size-small {\n min-width: 32px;\n min-height: 32px;\n}\nhtml.dough-IE11 .dough-button.dough-button-size-small {\n height: 32px;\n}\n.dough-button.dough-button-size-small.dough-button-rounded {\n border-radius: 16px;\n}\n.dough-button.dough-button-size-small > .dough-button-icon {\n min-width: 16px;\n width: 16px;\n height: 16px;\n font-size: 16px;\n}\n.dough-button.dough-button-size-small .dough-inline-svg-icon {\n width: 16px !important;\n height: 16px !important;\n}\n.dough-button.dough-button-size-normal {\n min-width: 40px;\n min-height: 40px;\n}\n.dough-button.dough-button-size-normal.dough-button-rounded {\n border-radius: 20px;\n}\n.dough-button.dough-button-size-extra-large, .dough-button.dough-button-size-large {\n min-width: 48px;\n min-height: 48px;\n}\n.dough-button.dough-button-size-extra-large.dough-button-rounded, .dough-button.dough-button-size-large.dough-button-rounded {\n border-radius: 24px;\n}\n.dough-button .dough-inline-svg-icon {\n display: inline-block;\n font-size: inherit;\n width: 20px;\n height: 20px;\n overflow: visible;\n}\n.dough-button.dough-button-wait, .dough-button.dough-button-disabled, .dough-button.dough-button-disabled * {\n pointer-events: none !important;\n}\n.dough-button.dough-button-disabled {\n opacity: 0.5;\n}\n.dough-button.align-right {\n float: right;\n}\n.dough-button > .dough-button-label {\n width: initial !important;\n height: initial !important;\n color: inherit !important;\n font-size: 0.75rem;\n line-height: initial !important;\n position: relative;\n z-index: 1;\n font-weight: 700;\n font-family: \"Roboto\", sans-serif;\n}\nhtml.dough-IE11 .dough-button > .dough-button-label {\n line-height: normal !important;\n}\n.dough-button > .dough-button-label:empty {\n display: none;\n}\n.dough-button > .dough-button-label + .dough-button-icon {\n margin-left: 8px !important;\n}\n.dough-button > .dough-button-icon {\n display: flex;\n flex-flow: row nowrap;\n box-sizing: border-box;\n overflow: visible;\n position: relative;\n z-index: 1;\n min-width: 20px;\n width: 20px;\n height: 20px;\n font-size: 16px;\n justify-content: center;\n align-items: center;\n}\n.dough-button > .dough-button-icon + .dough-button-label {\n margin-left: 8px !important;\n}\n.dough-button.dough-color-transparent > .dough-button-icon {\n color: var(--dough-color-icon-default);\n}\nhtml.dough-IE11 .dough-button.dough-color-transparent > .dough-button-icon {\n color: #999999;\n}\n.dough-button.dough-button-rounded {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper {\n border-radius: 40px;\n}\n.dough-button.dough-button-rounded > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 40px !important;\n}\n.dough-button.dough-button-flat {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper {\n border-radius: 0 !important;\n}\n.dough-button.dough-button-flat > .dough-button-background-wrapper > .dough-button-background-glow {\n border-radius: 0 !important;\n}\n.dough-button:not(.dough-button-has-label) > .dough-button-label {\n display: none;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-small {\n width: 32px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-normal {\n width: 40px;\n}\n.dough-button:not(.dough-button-has-label).dough-button-size-large {\n width: 48px;\n}\n.dough-button.dough-button-as-link {\n padding: 0;\n min-height: auto;\n text-decoration: underline;\n background-color: rgba(0, 0, 0, 0) !important;\n color: var(--dough-color-text-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link {\n color: rgb(110, 111, 117) !important;\n}\n.dough-button.dough-button-as-link > .dough-button-label {\n font-weight: initial;\n}\n.dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: var(--dough-color-icon-default) !important;\n}\nhtml.dough-IE11 .dough-button.dough-button-as-link .dough-inline-svg-icon > path {\n fill: #999999 !important;\n}\n.dough-button.dough-button-no-padding {\n min-width: auto;\n}\n\n@keyframes button-glow {\n 0% {\n transform: translate3d(0, 0, 0) scale(0.7);\n opacity: 0;\n }\n 20% {\n opacity: 0.4;\n transform: translate3d(0, 0, 0) scale(1);\n }\n 100% {\n transform: translate3d(0, 0, 0) scale(1);\n opacity: 0;\n }\n}\n@keyframes button-waiter {\n 0% {\n transform: translate3d(-100%, 0, 0);\n }\n 20% {\n transform: translate3d(0, 0, 0);\n }\n 35% {\n transform: translate3d(100%, 0, 0);\n }\n 50% {\n transform: translate3d(100%, 0, 0);\n }\n 70% {\n transform: translate3d(0, 0, 0);\n }\n 85% {\n transform: translate3d(-100%, 0, 0);\n }\n 100% {\n transform: translate3d(-100%, 0, 0);\n }\n}\n@media (hover: hover) and (pointer: fine) {\n .dough-button.dough-button-color-picker:not(.dough-button-with-border):hover > .dough-button-background-wrapper {\n border: 1px solid #ededed;\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button:not(.dough-button-color-picker):hover > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(94%);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover), .dough-button:not(.dough-button-color-picker):active {\n box-shadow: none !important;\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper.dough-color-transparent, .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper.dough-color-transparent {\n background-color: rgba(0, 0, 0, 0.07);\n }\n .dough-button-wrapper:focus > .dough-button:not(.dough-button-color-picker):not(:hover) > .dough-button-background-wrapper:not(.dough-color-transparent), .dough-button:not(.dough-button-color-picker):active > .dough-button-background-wrapper:not(.dough-color-transparent) {\n filter: brightness(87%);\n }\n}";
228
228
  styleInject(css_248z$1);
229
229
 
230
230
  var css_248z$2 = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-link {\n box-sizing: border-box;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n text-decoration: none;\n cursor: pointer;\n pointer-events: all !important;\n display: inline-block;\n line-height: normal;\n white-space: pre-line;\n word-break: break-word;\n position: relative;\n}\n.dough-link * {\n outline: none;\n -webkit-tap-highlight-color: transparent;\n}\n.dough-link.disabled {\n pointer-events: none !important;\n}\nhtml.dough-IE11 .dough-link:hover {\n opacity: 0.83;\n}\nbody:not(.no-transition) .dough-link {\n transition: filter 350ms cubic-bezier(0.25, 1, 0, 1), transform 1500ms cubic-bezier(0.12, 1, 0, 1);\n}\nbody.no-transition .dough-link {\n transition: none 0ms linear !important;\n transition-delay: 0ms !important;\n}\n.dough-link.dough-link-full-width {\n width: 100%;\n box-sizing: border-box;\n}\n.dough-link:visited, .dough-link:link, .dough-link:active {\n text-decoration: none;\n}\n.dough-link.dough-link-disabled {\n pointer-events: none !important;\n}\n.dough-link.dough-link-color-only-on-hover:not(:hover) {\n color: inherit !important;\n}\n\n@media (hover: hover) and (pointer: fine) {\n .dough-link:not(.dough-link-disabled):hover:not(.dough-link-no-underline) {\n text-decoration: underline;\n }\n .dough-link:not(.dough-link-disabled):not(.dough-button-wrapper):hover {\n filter: brightness(96%);\n }\n}";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@speakapbv/dough-component-library",
3
- "version": "10.6.0",
3
+ "version": "10.6.1",
4
4
  "description": "DOUGH: Speakap React Component Library",
5
5
  "author": "Speakap",
6
6
  "license": "MIT",