@constructor-io/constructorio-ui-quizzes 1.3.8 → 1.3.10

package/README.md

@@ -7,7 +7,7 @@ A UI Library that provides React components to manage the fetching and rendering
 
 ## Introduction
 
-[Constructor.io's Quizzes](https://constructor.io/products/quizzes/) are interactive experiences that personalizes the shopping journey for each of your customers. This UI library simplifies the integration process by providing React Components that handle the fetching and rendering logic for Quizzes. Typescript support is available.
+[Constructor.io's Quizzes](https://constructor.io/products/quizzes/) are interactive experiences that personalize the shopping journey for each of your customers. This UI library simplifies the integration process by providing React Components that handle the fetching and rendering logic for Quizzes. Typescript support is available.
 
 [Our storybook docs](https://constructor-io.github.io/constructorio-ui-quizzes) are the best place to explore the behavior and the available configuration options for this UI Library.
 

package/dist/constructorio-ui-quizzes-bundled.js

@@ -1,4 +1,4 @@
-(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.id="cio-quizzes-styles",o.appendChild(document.createTextNode(".cio-quiz{--primary-color-h: 227;--primary-color-s: 70%;--primary-color-l: 46%;--primary-color-variant-100: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 10%), calc(var(--primary-color-l) + 25%) );--primary-color-variant-400: hsl( var(--primary-color-h), var(--primary-color-s), var(--primary-color-l) );--primary-color-variant-500: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 10%), calc(var(--primary-color-l) - 5%) );--primary-color-variant-600: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 15%), calc(var(--primary-color-l) - 10%) );--primary-color-variant-700: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 15%), calc(var(--primary-color-l) - 15%) );--primary-color-variant-800: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 20%), calc(var(--primary-color-l) - 20%) );--primary-color: var(--primary-color-variant-400);--gray-dust-100: #92959c;--gray-dust-200: #74757b;--gray-dust-500: #46474a;--gray-dust-900: #2c2c2f;--bottom-bar-height: 80px;--container-image-small-height: 250px;container:quiz / inline-size}.cio-quiz,.cio-quiz *{box-sizing:border-box;font-family:Inter,sans-serif}.cio-quiz{position:relative;min-width:100%;min-height:100%;height:100%;overflow:auto;display:flex;justify-content:center;background-color:#fff;color:var(--gray-dust-500);font-size:16px}.cio-quiz button{cursor:pointer}.cio-container{display:flex;justify-content:center;margin-top:2rem;padding-bottom:var(--bottom-bar-height)}.cio-container--with-image{display:flex;flex-direction:column;width:100%;max-height:100vh;padding-bottom:var(--bottom-bar-height)}.cio-session-prompt-modal{position:absolute;display:flex;z-index:100;width:100%;height:100%;background-color:#00000080;justify-content:space-between}.cio-session-prompt-container{margin:auto}.cio-session-prompt-content{display:flex;flex-direction:column;gap:1rem;height:fit-content;margin:2rem;padding:2rem;border-radius:8px;background:#ffffff;line-height:1.5}.cio-session-prompt-controls-container{display:flex;justify-content:space-between;gap:1rem}.cio-session-prompt-content .cio-button-container{margin:0;padding:0}.cio-session-prompt-controls-container .cio-button-container:nth-child(1) .cio-question-cta-button{color:var(--primary-color);background-color:#fff}.cio-question-content{display:flex;flex-direction:column;padding:1rem}.cio-question-title{font-size:2.125em;margin:0}.cio-question-description{font-size:1em;line-height:1.5;margin-top:1.5rem}.cio-question-image{width:100%;height:100%;object-fit:cover}.cio-question-image-container{box-sizing:border-box;width:100%;object-fit:cover;max-height:var(--container-image-small-height);height:var(--container-image-small-height);display:flex}.cio-question-input-text{width:100%;padding:.5rem;border:0;border-bottom:1px solid var(--gray-dust-100);color:var(--primary-color-variant-500);padding:.8rem;outline:none;font-size:1rem}.cio-question-input-text:focus,.cio-question-input-text:active{border-bottom:1px solid var(--primary-color-variant-500)}.cio-question-input-text::placeholder{color:var(--gray-dust-100)}.cio-question-buttons-container{width:100%;height:var(--bottom-bar-height);padding:8px 16px;display:flex;position:absolute;bottom:0px;left:0px;background:white;background-color:#ffffffde;align-items:center}.cio-question-buttons-container-text{display:none}.cio-question-cta-button{background:var(--primary-color);color:#fff;border:1px solid var(--primary-color);border-radius:4px;height:3rem;font-size:1rem;flex-grow:1;margin-left:auto;width:100%}.cio-button-container{max-width:10rem;flex-grow:1;margin-left:auto;padding-left:1rem}.cio-question-cta-button:hover{background:var(--primary-color-variant-500);border:2px solid var(--primary-color-variant-600)}.cio-question-cta-button:active{background:var(--primary-color-variant-700);border:2px solid var(--primary-color-variant-800)}.cio-question-cta-button:focus{outline:3px solid var(--primary-color-variant-100)}.cio-question-cta-button:disabled,.cio-question-cta-button.disabled{background:var(--gray-dust-200);border:2px solid var(--gray-dust-200);cursor:auto;outline:none}.cio-question-back-button{color:var(--primary-color);background:#ffffff;border:1px solid var(--primary-color);border-radius:4px;height:3rem;width:3rem;font-size:1rem;margin-right:4rem}.cio-question-back-button:hover{border:2px solid var(--primary-color-variant-600)}.cio-question-back-button:active{border:2px solid var(--primary-color-variant-700)}.cio-question-back-button:focus{outline:3px solid var(--primary-color-variant-100)}.cio-question-back-button svg{display:inline}.cio-cover-question-container--with-image{padding:0;padding-bottom:var(--bottom-bar-height)}.cio-question-option-container{padding:1.5rem;border-radius:8px;border:1px solid var(--primary-color-variant-100);box-shadow:0 4px 10px #5d7ce826;width:calc(50% - 10px);display:flex;flex-direction:column;cursor:pointer}.cio-question-option-container.selected,.cio-question-option-container-text-only.selected{outline:3px solid var(--primary-color-variant-600);box-shadow:0 4px 10px #5d7ce859}.cio-question-option-container:hover:not(.selected){outline:1px solid var(--primary-color-variant-600);box-shadow:0 4px 10px #5d7ce840}.cio-question-option-container-text-only:hover:not(.selected){outline:1px solid var(--primary-color-variant-600);box-shadow:0 4px 10px #5d7ce840}.cio-select-question-container{position:relative;display:flex;flex-direction:column;align-items:center;align-self:start;max-width:1200px;padding:1rem;margin-top:2rem;min-height:calc(100% - 3rem);width:100%}.cio-question-options-container{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;width:100%;margin-bottom:var(--bottom-bar-height);margin-top:2rem}.cio-question-options-container-text-only{display:flex;flex-direction:column;gap:1rem;width:100%;padding:10px;margin-bottom:auto;margin-top:2rem}.cio-question-option-container-text-only{padding:1.5rem;border-radius:8px;border:1px solid var(--primary-color-variant-100);box-shadow:0 4px 10px #5d7ce826;display:flex;flex-direction:column;width:100%;margin:auto;cursor:pointer}.cio-question-option-image{width:100%;height:auto;border-radius:4px;object-fit:cover;margin-bottom:16px;aspect-ratio:1/1}.cio-question-option-value{text-align:center;margin:auto 0}.cio-select-question-text{width:100%;display:flex;flex-direction:column;justify-content:space-between}.cio-select-question-text .cio-question-description{margin-bottom:0}.cio-results-container{width:100%;max-width:1200px;padding:2rem 1rem;display:flex;flex-direction:column}.cio-results-title{margin-top:0;margin-bottom:1rem;color:var(--gray-dust-500)}.cio-results-filter-container{margin-bottom:1.5rem}.cio-results-filter-container p{color:var(--gray-dust-500);margin-bottom:1.5rem}.cio-results-filter-options{display:flex;flex-wrap:wrap;gap:.5rem;cursor:default}.cio-results-filter-option{background-color:#fff;border:1px solid var(--primary-color);color:var(--primary-color-variant-500);border-radius:10000px;padding:.4rem 1.25rem;display:flex;justify-content:center;align-items:center;font-size:.75rem}.cio-results{display:flex;flex-direction:row;flex-wrap:wrap}.cio-zero-results{margin-top:2rem;text-align:center;display:flex;flex-direction:column;justify-content:center;max-width:420px;margin-left:auto;margin-right:auto}.cio-zero-results-subtitle{font-weight:500;font-size:1.25rem;line-height:1.5rem;color:var(--gray-dust-500);margin-top:0}.cio-zero-results-description{color:var(--gray-dust-100);line-height:1.25rem;margin-top:0}.cio-zero-results .cio-button-container{width:14rem;margin-right:auto;margin-left:auto;padding-left:0}.cio-result-card{background-color:transparent;height:auto;box-sizing:border-box;text-decoration:none;margin:0;margin-bottom:1.5rem;flex-basis:100%;display:flex;flex-direction:column}.cio-result-card-anchor,.cio-result-card-container{text-decoration:none;background-color:transparent;color:inherit;height:100%;display:flex;flex-direction:column;justify-content:space-between}.cio-result-card-image{width:auto;height:240px;margin-left:auto;margin-right:auto;margin-bottom:10px}.cio-result-card-image img{height:100%;width:100%;object-fit:contain}.cio-result-card-text{flex-grow:1;display:flex;flex-direction:column;justify-content:space-between;text-decoration:none}.cio-result-card-title{color:var(--gray-dust-500);margin:0;margin-bottom:1rem;font-weight:700}.cio-result-card-prices{margin-bottom:1rem;font-weight:700}.cio-result-card-sale-price{color:#bf1728;margin-right:.75rem}.cio-result-card-regular-price{color:var(--gray-dust-900)}.cio-result-card-regular-price--strike-through{text-decoration:line-through}.cio-result-card-cta-button{padding:.75rem 2.5rem;height:3rem;background:var(--primary-color);border:1px solid var(--primary-color);border-radius:4px;color:#fff;font-size:1rem;width:100%}.cio-result-card-cta-button:hover{background:var(--primary-color-variant-500);border:2px solid var(--primary-color-variant-600)}.cio-result-card-cta-button:active{background:var(--primary-color-variant-700);border:2px solid var(--primary-color-variant-800)}.cio-result-card-cta-button:focus{outline:3px solid var(--primary-color-variant-100)}.cio-result-card-cta-button:disabled,.cio-result-card-cta-button.disabled{background:var(--gray-dust-200);border:2px solid var(--gray-dust-200)}.cio-question-redo-button{background:none;border:none;display:flex;gap:.5rem;align-items:center}.cio-question-redo-button:hover{text-decoration:underline}.cio-question-redo-button span{margin-top:1px}@container quiz (min-width: 640px){.cio-container{padding-bottom:0}.cio-container--with-image{display:flex;justify-content:center;align-items:center;margin-bottom:0;padding-bottom:0}.cio-question-image-container{height:100%;flex-basis:50%;flex-shrink:0;border-radius:4px}.cio-cover-question-container--with-image{justify-content:center;margin-bottom:0;padding-bottom:0}.cio-select-question-text{margin-top:2rem}.cio-select-question-buttons{padding:1rem 3rem}.cio-results-container{padding:3rem 4rem}.cio-results-filter-and-redo-container{display:flex;justify-content:space-between;align-items:end;margin-bottom:1.5rem}.cio-results-filter-container{margin-bottom:0}.cio-results{column-gap:5%}.cio-result-card{flex-basis:30%}.cio-question-buttons-container-text{text-align:center;flex-grow:1;color:var(--gray-dust-100);font-size:1.125rem;display:block}}@container quiz (min-width: 768px){.cio-container{align-items:center;margin-top:0}.cio-container--with-image{padding:6% 2%;align-items:center;flex-direction:row}.cio-cover-question-container--with-image{flex-direction:row-reverse}.cio-question-input-text{margin-bottom:1rem}.cio-question-image-container{max-height:100%}.cio-cover-question-container--with-image .cio-question-image-container{max-height:unset}.cio-question-content{justify-content:center;height:fit-content;flex-basis:70%;flex-shrink:1;margin:0 auto;padding:3rem}.cio-question-description{margin-bottom:2rem}.cio-question-buttons-container{position:sticky;padding:0;margin:0;align-items:center}.cio-cover-question-container--with-image{padding:0}.cio-select-question-text{padding:0;padding-bottom:2rem;margin:0}.cio-select-question-buttons{padding:1rem 5rem}.cio-select-question-container{justify-content:center;margin:0;padding:2rem;padding-bottom:0}.cio-question-option-container{width:calc(25% - 13px)}.cio-question-options-container{padding:0;margin-bottom:2rem}.cio-question-options-container-text-only{flex-direction:row;flex-wrap:wrap;justify-content:center;margin-bottom:2rem;margin-top:0}.cio-question-option-container-text-only{margin:0;width:30%}}@container quiz (min-width: 1280px){.cio-cover-question-container--with-image{padding:0}.cio-question-option-container-text-only{width:30%}.cio-select-question-container{margin-bottom:0}.cio-select-question-text{padding:2.5rem 0rem}.cio-results-container{margin-top:3rem}.cio-zero-results{margin-top:7rem}.cio-question-content{padding:5rem}}.cio-spinner{display:inline-block;position:relative;width:80px;margin:auto}.cio-spinner div{box-sizing:border-box;display:block;position:absolute;top:-35px;width:64px;height:64px;margin:4px;border:4px solid var(--primary-color);border-radius:50%;animation:cio-spinner 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:var(--primary-color) transparent transparent transparent}.cio-spinner div:nth-child(1){animation-delay:-.45s}.cio-spinner div:nth-child(2){animation-delay:-.3s}.cio-spinner div:nth-child(3){animation-delay:-.15s}@keyframes cio-spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}")),document.head.appendChild(o)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
+(function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.id="cio-quizzes-styles",o.appendChild(document.createTextNode('@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap";.cio-quiz{--primary-color-h: 227;--primary-color-s: 70%;--primary-color-l: 46%;--primary-color-variant-100: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 10%), calc(var(--primary-color-l) + 25%) );--primary-color-variant-400: hsl( var(--primary-color-h), var(--primary-color-s), var(--primary-color-l) );--primary-color-variant-500: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 10%), calc(var(--primary-color-l) - 5%) );--primary-color-variant-600: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 15%), calc(var(--primary-color-l) - 10%) );--primary-color-variant-700: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 15%), calc(var(--primary-color-l) - 15%) );--primary-color-variant-800: hsl( var(--primary-color-h), calc(var(--primary-color-s) + 20%), calc(var(--primary-color-l) - 20%) );--primary-color: var(--primary-color-variant-400);--gray-dust-100: #92959c;--gray-dust-200: #74757b;--gray-dust-500: #46474a;--gray-dust-900: #2c2c2f;--bottom-bar-height: 80px;--container-image-small-height: 250px;container:quiz / inline-size}.cio-quiz,.cio-quiz *{box-sizing:border-box;font-family:Inter,sans-serif}.cio-quiz{position:relative;min-width:100%;min-height:100%;height:100%;overflow:auto;display:flex;justify-content:center;background-color:#fff;color:var(--gray-dust-500);font-size:16px}.cio-quiz button{cursor:pointer}.cio-container{display:flex;justify-content:center;margin-top:2rem;padding-bottom:var(--bottom-bar-height);width:100%}.cio-container--with-image{display:flex;flex-direction:column;width:100%;max-height:100vh;padding-bottom:var(--bottom-bar-height)}.cio-session-prompt-modal{position:absolute;display:flex;z-index:100;width:100%;height:100%;background-color:#00000080;justify-content:space-between}.cio-session-prompt-container{margin:auto}.cio-session-prompt-content{display:flex;flex-direction:column;gap:1rem;height:fit-content;margin:2rem;padding:2rem;border-radius:8px;background:#ffffff;line-height:1.5}.cio-session-prompt-controls-container{display:flex;justify-content:space-between;gap:1rem}.cio-session-prompt-content .cio-button-container{margin:0;padding:0}.cio-session-prompt-controls-container .cio-button-container:nth-child(1) .cio-question-cta-button{color:var(--primary-color);background-color:#fff}.cio-question-content{display:flex;flex-direction:column;padding:1rem}.cio-question-title{font-size:2.125em;margin:0}.cio-question-description{font-size:1em;line-height:1.5;margin-top:1.5rem}.cio-question-image{width:100%;height:100%;object-fit:cover}.cio-question-image-container{box-sizing:border-box;width:100%;object-fit:cover;max-height:var(--container-image-small-height);height:var(--container-image-small-height);display:flex}.cio-question-input-text{width:100%;padding:.5rem;border:0;border-bottom:1px solid var(--gray-dust-100);color:var(--primary-color-variant-500);padding:.8rem;outline:none;font-size:1rem}.cio-question-input-text:focus,.cio-question-input-text:active{border-bottom:1px solid var(--primary-color-variant-500)}.cio-question-input-text::placeholder{color:var(--gray-dust-100)}.cio-question-buttons-container{width:100%;height:var(--bottom-bar-height);padding:8px 16px;display:flex;position:absolute;bottom:0px;left:0px;background:white;background-color:#ffffffde;align-items:center}.cio-question-buttons-container-text{display:none}.cio-question-cta-button{background:var(--primary-color);color:#fff;border:1px solid var(--primary-color);border-radius:4px;height:3rem;font-size:1rem;flex-grow:1;margin-left:auto;width:100%}.cio-button-container{max-width:10rem;flex-grow:1;margin-left:auto;padding-left:1rem}.cio-question-cta-button:hover{background:var(--primary-color-variant-500);border:2px solid var(--primary-color-variant-600)}.cio-question-cta-button:active{background:var(--primary-color-variant-700);border:2px solid var(--primary-color-variant-800)}.cio-question-cta-button:focus{outline:3px solid var(--primary-color-variant-100)}.cio-question-cta-button:disabled,.cio-question-cta-button.disabled{background:var(--gray-dust-200);border:2px solid var(--gray-dust-200);cursor:auto;outline:none}.cio-question-back-button{color:var(--primary-color);background:#ffffff;border:1px solid var(--primary-color);border-radius:4px;height:3rem;width:3rem;font-size:1rem;margin-right:4rem}.cio-question-back-button:hover{border:2px solid var(--primary-color-variant-600)}.cio-question-back-button:active{border:2px solid var(--primary-color-variant-700)}.cio-question-back-button:focus{outline:3px solid var(--primary-color-variant-100)}.cio-question-back-button svg{display:inline}.cio-cover-question-container--with-image{padding:0;padding-bottom:var(--bottom-bar-height)}.cio-question-option-container{padding:1.5rem;border-radius:8px;border:1px solid var(--primary-color-variant-100);box-shadow:0 4px 10px #5d7ce826;width:calc(50% - 10px);display:flex;flex-direction:column;cursor:pointer}.cio-question-option-container.selected,.cio-question-option-container-text-only.selected{outline:3px solid var(--primary-color-variant-600);box-shadow:0 4px 10px #5d7ce859}.cio-question-option-container:hover:not(.selected){outline:1px solid var(--primary-color-variant-600);box-shadow:0 4px 10px #5d7ce840}.cio-question-option-container-text-only:hover:not(.selected){outline:1px solid var(--primary-color-variant-600);box-shadow:0 4px 10px #5d7ce840}.cio-select-question-container{position:relative;display:flex;flex-direction:column;align-items:center;align-self:start;max-width:1200px;padding:1rem;margin-top:2rem;min-height:calc(100% - 3rem);width:100%}.cio-question-options-container{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;width:100%;margin-bottom:var(--bottom-bar-height);margin-top:2rem}.cio-question-options-container-text-only{display:flex;flex-direction:column;gap:1rem;width:100%;padding:10px;margin-bottom:auto;margin-top:2rem}.cio-question-option-container-text-only{padding:1.5rem;border-radius:8px;border:1px solid var(--primary-color-variant-100);box-shadow:0 4px 10px #5d7ce826;display:flex;flex-direction:column;width:100%;margin:auto;cursor:pointer}.cio-question-option-image{width:100%;height:auto;border-radius:4px;object-fit:cover;margin-bottom:16px;aspect-ratio:1/1}.cio-question-option-value{text-align:center;margin:auto 0}.cio-select-question-text{width:100%;display:flex;flex-direction:column;justify-content:space-between}.cio-select-question-text .cio-question-description{margin-bottom:0}.cio-results-container{width:100%;max-width:1200px;padding:2rem 1rem;display:flex;flex-direction:column}.cio-results-title{margin-top:0;margin-bottom:1rem;color:var(--gray-dust-500)}.cio-results-filter-container{margin-bottom:1.5rem}.cio-results-filter-container p{color:var(--gray-dust-500);margin-bottom:1.5rem}.cio-results-filter-options{display:flex;flex-wrap:wrap;gap:.5rem;cursor:default}.cio-results-filter-option{background-color:#fff;border:1px solid var(--primary-color);color:var(--primary-color-variant-500);border-radius:10000px;padding:.4rem 1.25rem;display:flex;justify-content:center;align-items:center;font-size:.75rem}.cio-results{display:flex;flex-direction:row;flex-wrap:wrap}.cio-zero-results{margin-top:2rem;text-align:center;display:flex;flex-direction:column;justify-content:center;max-width:420px;margin-left:auto;margin-right:auto}.cio-zero-results-subtitle{font-weight:500;font-size:1.25rem;line-height:1.5rem;color:var(--gray-dust-500);margin-top:0}.cio-zero-results-description{color:var(--gray-dust-100);line-height:1.25rem;margin-top:0}.cio-zero-results .cio-button-container{width:14rem;margin-right:auto;margin-left:auto;padding-left:0}.cio-result-card{background-color:transparent;height:auto;box-sizing:border-box;text-decoration:none;margin:0;margin-bottom:1.5rem;flex-basis:100%;display:flex;flex-direction:column}.cio-result-card-anchor,.cio-result-card-container{text-decoration:none;background-color:transparent;color:inherit;height:100%;display:flex;flex-direction:column;justify-content:space-between}.cio-result-card-image{width:auto;height:240px;margin-left:auto;margin-right:auto;margin-bottom:10px}.cio-result-card-image img{height:100%;width:100%;object-fit:contain}.cio-result-card-text{flex-grow:1;display:flex;flex-direction:column;justify-content:space-between;text-decoration:none}.cio-result-card-title{color:var(--gray-dust-500);margin:0;margin-bottom:1rem;font-weight:700}.cio-result-card-prices{margin-bottom:1rem;font-weight:700}.cio-result-card-sale-price{color:#bf1728;margin-right:.75rem}.cio-result-card-regular-price{color:var(--gray-dust-900)}.cio-result-card-regular-price--strike-through{text-decoration:line-through}.cio-result-card-cta-button{padding:.75rem 2.5rem;height:3rem;background:var(--primary-color);border:1px solid var(--primary-color);border-radius:4px;color:#fff;font-size:1rem;width:100%}.cio-result-card-cta-button:hover{background:var(--primary-color-variant-500);border:2px solid var(--primary-color-variant-600)}.cio-result-card-cta-button:active{background:var(--primary-color-variant-700);border:2px solid var(--primary-color-variant-800)}.cio-result-card-cta-button:focus{outline:3px solid var(--primary-color-variant-100)}.cio-result-card-cta-button:disabled,.cio-result-card-cta-button.disabled{background:var(--gray-dust-200);border:2px solid var(--gray-dust-200)}.cio-question-redo-button{background:none;border:none;display:flex;gap:.5rem;align-items:center}.cio-question-redo-button:hover{text-decoration:underline}.cio-question-redo-button span{margin-top:1px}@container quiz (min-width: 640px){.cio-container{padding-bottom:0}.cio-container--with-image{display:flex;justify-content:center;align-items:center;margin-bottom:0;padding-bottom:0}.cio-question-image-container{height:100%;flex-basis:50%;flex-shrink:0;border-radius:4px}.cio-cover-question-container--with-image{justify-content:center;margin-bottom:0;padding-bottom:0}.cio-select-question-text{margin-top:2rem}.cio-select-question-buttons{padding:1rem 3rem}.cio-results-container{padding:3rem 4rem}.cio-results-filter-and-redo-container{display:flex;justify-content:space-between;align-items:end;margin-bottom:1.5rem}.cio-results-filter-container{margin-bottom:0}.cio-results{column-gap:5%}.cio-result-card{flex-basis:30%}.cio-question-buttons-container-text{text-align:center;flex-grow:1;color:var(--gray-dust-100);font-size:1.125rem;display:block}}@container quiz (min-width: 768px){.cio-container{align-items:center;margin-top:0}.cio-container--with-image{padding:6% 2%;align-items:center;flex-direction:row}.cio-cover-question-container--with-image{flex-direction:row-reverse}.cio-question-input-text{margin-bottom:1rem}.cio-question-image-container{max-height:100%}.cio-cover-question-container--with-image .cio-question-image-container{max-height:unset}.cio-question-content{justify-content:center;height:fit-content;flex-basis:70%;flex-shrink:1;margin:0 auto;padding:3rem}.cio-question-description{margin-bottom:2rem}.cio-question-buttons-container{position:sticky;padding:0;margin:0;align-items:center}.cio-cover-question-container--with-image{padding:0}.cio-select-question-text{padding:0;padding-bottom:2rem;margin:0}.cio-select-question-buttons{padding:1rem 5rem}.cio-select-question-container{justify-content:center;margin:0;padding:2rem;padding-bottom:0}.cio-question-option-container{width:calc(25% - 13px)}.cio-question-options-container{padding:0;margin-bottom:2rem}.cio-question-options-container-text-only{flex-direction:row;flex-wrap:wrap;justify-content:center;margin-bottom:2rem;margin-top:0}.cio-question-option-container-text-only{margin:0;width:30%}}@container quiz (min-width: 1280px){.cio-cover-question-container--with-image{padding:0}.cio-question-option-container-text-only{width:30%}.cio-select-question-container{margin-bottom:0}.cio-select-question-text{padding:2.5rem 0rem}.cio-results-container{margin-top:3rem}.cio-zero-results{margin-top:7rem}.cio-question-content{padding:5rem}}.cio-spinner{display:inline-block;position:relative;width:80px;margin:auto}.cio-spinner div{box-sizing:border-box;display:block;position:absolute;top:-35px;width:64px;height:64px;margin:4px;border:4px solid var(--primary-color);border-radius:50%;animation:cio-spinner 1.2s cubic-bezier(.5,0,.5,1) infinite;border-color:var(--primary-color) transparent transparent transparent}.cio-spinner div:nth-child(1){animation-delay:-.45s}.cio-spinner div:nth-child(2){animation-delay:-.3s}.cio-spinner div:nth-child(3){animation-delay:-.15s}@keyframes cio-spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}')),document.head.appendChild(o)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
 var Ot=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function Jf(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var X={},Zf={get exports(){return X},set exports(e){X=e}},K={};/**
  * @license React
  * react.production.min.js

package/lib/styles.css

@@ -1,3 +1,5 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap');
+
 /* Theme colors */
 .cio-quiz {
   --primary-color-h: 227;
@@ -72,6 +74,7 @@
   justify-content: center;
   margin-top: 2rem;
   padding-bottom: var(--bottom-bar-height);
+  width: 100%;
 }
 .cio-container--with-image {
   display: flex;
@@ -597,7 +600,7 @@
   }
 
   /* Control Bar Instructions */
-    .cio-question-buttons-container-text {
+  .cio-question-buttons-container-text {
     text-align: center;
     flex-grow: 1;
     color: var(--gray-dust-100);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@constructor-io/constructorio-ui-quizzes",
-  "version": "1.3.8",
+  "version": "1.3.10",
   "description": "Constructor.io Quizzes UI library for web applications",
   "author": "constructor.io",
   "license": "MIT",