@ututrust/web-components 2.1.7 → 2.1.9
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.
- package/dist/index.js +200 -282
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -41082,8 +41082,8 @@
|
|
|
41082
41082
|
}
|
|
41083
41083
|
}
|
|
41084
41084
|
|
|
41085
|
-
var css_248z$
|
|
41086
|
-
styleInject(css_248z$
|
|
41085
|
+
var css_248z$q = "::slotted(ul) {\n list-style: none;\n padding: 0;\n margin: 0;\n}";
|
|
41086
|
+
styleInject(css_248z$q);
|
|
41087
41087
|
|
|
41088
41088
|
function Root(props) {
|
|
41089
41089
|
var apiUrl = getBaseProps(props, TAG_ROOT).apiUrl;
|
|
@@ -41108,7 +41108,7 @@
|
|
|
41108
41108
|
return v$2(BaseComponent, {
|
|
41109
41109
|
forwardedRef: ref,
|
|
41110
41110
|
className: "recommendation-root",
|
|
41111
|
-
style: css_248z$
|
|
41111
|
+
style: css_248z$q,
|
|
41112
41112
|
excludeBootstrap: true,
|
|
41113
41113
|
excludeFonts: true
|
|
41114
41114
|
}, v$2("slot", null));
|
|
@@ -41160,8 +41160,8 @@
|
|
|
41160
41160
|
// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
|
|
41161
41161
|
addToUnscopables$1(FIND);
|
|
41162
41162
|
|
|
41163
|
-
var css_248z$
|
|
41164
|
-
styleInject(css_248z$
|
|
41163
|
+
var css_248z$p = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.utu-recommendation {\n border-radius: 5px;\n padding-right: 1rem;\n}\n.utu-recommendation-content {\n display: flex;\n margin-left: 5px;\n}\n.utu-recommendation-text {\n align-self: center;\n margin-left: 20px;\n}\n.utu-recommendation-text-light {\n color: #000000;\n}\n.utu-recommendation-text-dark {\n color: #ffffff;\n}\n\n.summary-image-list {\n display: flex;\n justify-content: center;\n margin: 1.5rem 0 1rem 2rem;\n padding-left: 0;\n list-style: none;\n}\n.summary-image-item {\n margin-left: -15px;\n height: 2.5rem;\n}\n.summary-image-item-light {\n border: 2px solid rgb(252, 229, 70);\n}\n.summary-image-item-dark {\n border: 2px solid rgb(252, 229, 70);\n}";
|
|
41164
|
+
styleInject(css_248z$p);
|
|
41165
41165
|
|
|
41166
41166
|
function getRoot(ref) {
|
|
41167
41167
|
if (ref && ref.current) {
|
|
@@ -41216,10 +41216,9 @@
|
|
|
41216
41216
|
};
|
|
41217
41217
|
}, [ref, targetUuid]);
|
|
41218
41218
|
return v$2(BaseComponent, {
|
|
41219
|
-
style: css_248z$o,
|
|
41220
41219
|
forwardedRef: ref,
|
|
41221
41220
|
className: "utu-recommendation x-utu-section x-utu-section-no-border-" + envCondition
|
|
41222
|
-
},
|
|
41221
|
+
}, v$2("style", null, css_248z$p), rankingItem && v$2("div", {
|
|
41223
41222
|
className: "utu-recommendation-content"
|
|
41224
41223
|
}, v$2("ul", {
|
|
41225
41224
|
className: "summary-image-list"
|
|
@@ -41239,22 +41238,22 @@
|
|
|
41239
41238
|
}));
|
|
41240
41239
|
})), v$2("div", {
|
|
41241
41240
|
className: "utu-recommendation-text utu-recommendation-text-" + envCondition
|
|
41242
|
-
}, rankingItem.summaryText)))
|
|
41241
|
+
}, rankingItem.summaryText)));
|
|
41243
41242
|
}
|
|
41244
41243
|
|
|
41245
|
-
var css_248z$
|
|
41244
|
+
var css_248z$o = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.utu-feedback-form {\n width: 65%;\n margin: auto;\n}\n\n.utu-feedback-form_title {\n text-align: center;\n height: 3rem;\n background-color: #fcf8e5;\n font-weight: bold;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n\n.x-utu-feedback-form_body_1 {\n display: flex;\n justify-content: space-between;\n}\n\n.x-utu-feedback-details_divider {\n background-color: grey;\n height: 100px;\n width: 3px;\n}";
|
|
41245
|
+
styleInject(css_248z$o);
|
|
41246
|
+
|
|
41247
|
+
var css_248z$n = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.button {\n cursor: pointer;\n}\n.button:hover {\n background-color: rgb(253, 253, 253);\n}\n.button:active {\n transform: translateY(1px);\n}\n\n.x-utu-badge-set-container {\n width: 6em;\n height: 72px;\n padding: 1rem 1rem 1rem 0;\n}\n.x-utu-badge-set-section {\n display: flex;\n flex-direction: row;\n background-color: rgba(255, 221, 51, 0.1);\n border-radius: 10.07px;\n}\n.x-utu-badge-section {\n display: flex;\n overflow-x: scroll;\n white-space: nowrap;\n padding-bottom: 1rem;\n width: 95%;\n margin: auto;\n /* width */\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.x-utu-badge-section-container {\n padding-top: 1rem;\n}\n.x-utu-badge-section > div {\n padding: 1rem;\n}\n.x-utu-badge-section::-webkit-scrollbar {\n width: 10px;\n height: 8px;\n}\n.x-utu-badge-section::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 10px;\n}\n.x-utu-badge-section::-webkit-scrollbar-thumb {\n background: rgb(252, 229, 70);\n border-radius: 10px;\n}\n.x-utu-badge-section::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n.x-utu-badge-disable {\n height: 50px;\n width: 50px;\n opacity: 0.6;\n}\n.x-utu-badge-item-text {\n justify-content: center;\n align-items: center;\n color: white;\n}\n.x-utu-badge-text {\n font-size: 0.7rem;\n}\n.x-utu-badge-text-h3 {\n text-align: center;\n}\n.x-utu-badge-text-h3-light {\n color: #000000;\n}\n.x-utu-badge-text-h3-dark {\n color: #ffffff;\n}\n.x-utu-badge-img {\n width: 2rem;\n}\n.x-utu-badge-img-container {\n display: flex;\n justify-content: space-around;\n opacity: 1;\n}\n.x-utu-badge-img-big {\n width: 4.5rem;\n}\n.x-utu-badge-img-big-section {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n}\n\n.x-utu-badge-section-title {\n width: 100%;\n box-sizing: border-box;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-badge-section {\n padding-left: 0;\n padding-right: 0;\n }\n}\n@media only screen and (min-width: 1210px) {\n .x-utu-badge-section {\n padding-top: 0;\n }\n}";
|
|
41246
41248
|
styleInject(css_248z$n);
|
|
41247
41249
|
|
|
41248
|
-
var css_248z$m = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size:
|
|
41250
|
+
var css_248z$m = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}";
|
|
41249
41251
|
styleInject(css_248z$m);
|
|
41250
41252
|
|
|
41251
|
-
var css_248z$l = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}";
|
|
41252
|
-
styleInject(css_248z$l);
|
|
41253
|
-
|
|
41254
41253
|
/* eslint max-len: 0 */
|
|
41255
41254
|
function Logo() {
|
|
41256
41255
|
return v$2("svg", {
|
|
41257
|
-
style: css_248z$
|
|
41256
|
+
style: css_248z$m,
|
|
41258
41257
|
version: "1.1",
|
|
41259
41258
|
id: "Capa_1",
|
|
41260
41259
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -42082,9 +42081,7 @@
|
|
|
42082
42081
|
var _d = useFeedbackApi(apiUrl, props[ATTR_SOURCE_UUID], props[ATTR_TARGET_UUID], props[ATTR_TRANSACTION_ID]),
|
|
42083
42082
|
sendFeedback = _d.sendFeedback,
|
|
42084
42083
|
submitStatus = _d.submitStatus;
|
|
42085
|
-
return v$2(BaseComponent, {
|
|
42086
|
-
style: css_248z$m
|
|
42087
|
-
}, v$2("section", {
|
|
42084
|
+
return v$2(BaseComponent, null, v$2("style", null, css_248z$n), v$2("section", {
|
|
42088
42085
|
className: "x-utu-badge-set-section"
|
|
42089
42086
|
}, v$2("div", {
|
|
42090
42087
|
className: "x-utu-badge-img-big-section"
|
|
@@ -44296,8 +44293,8 @@
|
|
|
44296
44293
|
return _formControl.current;
|
|
44297
44294
|
}
|
|
44298
44295
|
|
|
44299
|
-
var css_248z$
|
|
44300
|
-
styleInject(css_248z$
|
|
44296
|
+
var css_248z$l = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-feedback-text-space {\n align-self: start;\n}\n.x-utu-feedback-text-area {\n padding: 5px;\n height: 8rem;\n width: 100%;\n border-radius: 10px 10px 0 0;\n border: 0;\n background-color: rgba(255, 221, 51, 0.1);\n}\n.x-utu-feedback-text-input-section {\n width: 100%;\n display: flex;\n justify-content: center;\n}\n.x-utu-feedback-text-input-form {\n display: flex;\n flex-direction: column;\n padding: 1rem 2.5rem 1rem;\n justify-content: center;\n align-items: center;\n width: 100vw;\n}\n.x-utu-feedback-text-input-btn {\n border-radius: 0 0 10px 10px;\n width: 100%;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-feedback-text-area {\n width: 100%;\n min-height: 10rem;\n }\n .x-utu-feedback-text-input-form {\n padding: 2rem 2.5rem;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .x-utu-feedback-text-input-btn {\n width: 100%;\n }\n}";
|
|
44297
|
+
styleInject(css_248z$l);
|
|
44301
44298
|
|
|
44302
44299
|
var minLength = 5;
|
|
44303
44300
|
function FeedbackTextInput(props) {
|
|
@@ -44319,11 +44316,10 @@
|
|
|
44319
44316
|
sendFeedback(feedback);
|
|
44320
44317
|
}
|
|
44321
44318
|
return v$2(BaseComponent, {
|
|
44322
|
-
style: css_248z$k,
|
|
44323
44319
|
className: "x-utu-feedback-text-input-section x-utu-section x-utu-section-no-border-" + envCondition,
|
|
44324
44320
|
excludeBootstrap: true,
|
|
44325
44321
|
excludeFonts: true
|
|
44326
|
-
}, v$2("form", {
|
|
44322
|
+
}, v$2("style", null, css_248z$l), v$2("form", {
|
|
44327
44323
|
onSubmit: handleSubmit(onSubmit),
|
|
44328
44324
|
className: "x-utu-feedback-text-input-form"
|
|
44329
44325
|
}, v$2("h3", {
|
|
@@ -44346,7 +44342,7 @@
|
|
|
44346
44342
|
},
|
|
44347
44343
|
className: "x-utu-feedback-text-input-btn x-utu-btn x-utu-btn-" + envCondition,
|
|
44348
44344
|
type: "submit"
|
|
44349
|
-
}, "Submit
|
|
44345
|
+
}, "Submit Your Review"))));
|
|
44350
44346
|
}
|
|
44351
44347
|
|
|
44352
44348
|
var $$3 = _export;
|
|
@@ -45414,15 +45410,15 @@
|
|
|
45414
45410
|
}
|
|
45415
45411
|
];
|
|
45416
45412
|
|
|
45417
|
-
var css_248z$j = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.endor-input-form {\n display: flex;\n flex-direction: row;\n justify-items: center;\n justify-content: center;\n align-items: center;\n padding-top: 32px;\n padding-bottom: 32px;\n}\n.endor-input-form-section {\n padding: 1rem;\n}\n.endor-input-form-text-area {\n color: #000000;\n height: 3rem;\n width: 100%;\n margin-right: 16px;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 12.8px;\n align-items: center;\n align-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n}\n.endor-input-section {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n}\n.endor-text {\n font-size: 24px;\n}\n.endor-text-light {\n color: black;\n}\n.endor-text-dark {\n color: white;\n}\n.endor-text-area {\n display: flex;\n flex-direction: row;\n}\n.endor-text-info {\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: rgb(252, 229, 70);\n width: 1rem;\n height: 1rem;\n margin-left: 1rem;\n font-size: 0.8rem;\n border-radius: 50%;\n cursor: pointer;\n margin-left: 0.5rem;\n transition-timing-function: ease-in-out;\n transition-duration: 2s;\n transition: width 2s, height 4s;\n}\n.endor-text-container {\n position: relative;\n padding: 2px;\n font-size: 13px;\n margin-top: 2px;\n cursor: pointer;\n display: flex;\n}\n.endor-text-tooltip {\n position: absolute;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background: #000;\n color: #fff;\n white-space: nowrap;\n padding: 5px 10px;\n border-radius: 5px;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.5s ease;\n}\n.endor-text-tooltip::before {\n content: \"\";\n position: absolute;\n left: 50%;\n top: 100%;\n transform: translateX(-50%);\n border: 15px solid;\n border-color: #000 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);\n}\n.endor-text-container:hover .endor-text-tooltip {\n top: -110%;\n visibility: visible;\n opacity: 1;\n}\n.endor-text-body {\n font-size: 12.8px;\n}\n.endor-text-title {\n font-size: 12.8px;\n}\n.endor-btn {\n border-radius: 10px;\n}\n\n.endor-utt-balance {\n margin-bottom: 32px;\n display: flex;\n display: flex;\n box-sizing: border-box;\n width: 10rem;\n height: 4rem;\n border-radius: 5px 30px 30px 5px;\n background-color: rgb(252, 229, 70);\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 767px) {\n .endor-input-section {\n padding-left: 0;\n padding-right: 0;\n }\n .endor-input-form {\n width: 40%;\n padding: 32px;\n }\n .endor-input-form-text-area {\n background-color: rgb(253, 253, 253);\n font-size: 16px;\n }\n .endor-input-form-section {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n width: 100%;\n }\n .endor-text {\n padding: 32px;\n width: 40%;\n }\n .endor-text-info {\n font-size: 16px;\n }\n}\n@media only screen and (min-width: 830px) {\n .endor-text-body {\n font-size: 16px;\n }\n .endor-text-title {\n font-size: 16px;\n }\n .endor-input-form-text-area {\n font-size: 16px;\n }\n}\n.utt-balance-logo {\n justify-items: center;\n height: 4rem;\n width: 4rem;\n}\n\n.x-utu-utt-heading-text {\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n justify-content: center;\n}";
|
|
45413
|
+
var css_248z$k = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.endor-input-form {\n display: flex;\n flex-direction: row;\n justify-items: center;\n justify-content: center;\n align-items: center;\n padding-top: 32px;\n padding-bottom: 32px;\n}\n.endor-input-form-section {\n padding: 1rem;\n}\n.endor-input-form-text-area {\n color: #000000;\n height: 3rem;\n width: 100%;\n margin-right: 16px;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n align-items: center;\n align-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n}\n.endor-input-section {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n}\n.endor-text {\n font-size: 0.9rem;\n}\n.endor-text-light {\n color: black;\n}\n.endor-text-dark {\n color: white;\n}\n.endor-text-area {\n display: flex;\n flex-direction: row;\n}\n.endor-text-info {\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: rgb(252, 229, 70);\n width: 1rem;\n height: 1rem;\n margin-left: 1rem;\n font-size: 0.9rem;\n border-radius: 50%;\n cursor: pointer;\n margin-left: 0.5rem;\n transition-timing-function: ease-in-out;\n transition-duration: 2s;\n transition: width 2s, height 4s;\n}\n.endor-text-container {\n position: relative;\n padding: 2px;\n font-size: 13px;\n margin-top: 2px;\n cursor: pointer;\n display: flex;\n}\n.endor-text-tooltip {\n position: absolute;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background: #000;\n color: #fff;\n white-space: nowrap;\n padding: 5px 10px;\n border-radius: 5px;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.5s ease;\n}\n.endor-text-tooltip::before {\n content: \"\";\n position: absolute;\n left: 50%;\n top: 100%;\n transform: translateX(-50%);\n border: 15px solid;\n border-color: #000 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);\n}\n.endor-text-container:hover .endor-text-tooltip {\n top: -110%;\n visibility: visible;\n opacity: 1;\n}\n.endor-text-body {\n font-size: 0.9rem;\n}\n.endor-text-title {\n font-size: 0.9rem;\n}\n.endor-btn {\n border-radius: 10px;\n}\n\n.endor-utt-balance {\n margin-bottom: 32px;\n display: flex;\n display: flex;\n box-sizing: border-box;\n width: 10rem;\n height: 4rem;\n border-radius: 5px 30px 30px 5px;\n background-color: rgb(252, 229, 70);\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 767px) {\n .endor-input-section {\n padding-left: 0;\n padding-right: 0;\n }\n .endor-input-form {\n width: 40%;\n padding: 32px;\n }\n .endor-input-form-text-area {\n background-color: rgb(253, 253, 253);\n font-size: 0.9rem;\n }\n .endor-input-form-section {\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n width: 100%;\n }\n .endor-text {\n padding: 32px;\n width: 40%;\n }\n .endor-text-info {\n font-size: 0.9rem;\n }\n}\n@media only screen and (min-width: 830px) {\n .endor-text-body {\n font-size: 0.9rem;\n }\n .endor-text-title {\n font-size: 0.9rem;\n }\n .endor-input-form-text-area {\n font-size: 0.9rem;\n }\n}\n.utt-balance-logo {\n justify-items: center;\n height: 4rem;\n width: 4rem;\n}\n\n.x-utu-utt-heading-text {\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n justify-content: center;\n}\n\n.x-utu-h3 {\n font-size: 0.8rem;\n}";
|
|
45414
|
+
styleInject(css_248z$k);
|
|
45415
|
+
|
|
45416
|
+
var css_248z$j = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-utt-balance {\n width: 100%;\n align-items: center;\n text-align: center;\n justify-content: center;\n background-color: rgb(252, 229, 70);\n margin-top: 0.25rem;\n}";
|
|
45418
45417
|
styleInject(css_248z$j);
|
|
45419
45418
|
|
|
45420
|
-
var css_248z$i = "
|
|
45419
|
+
var css_248z$i = ".x-utu-spinner {\n -webkit-transform-origin: 50% 65%;\n transform-origin: 50% 65%;\n}\n\n@-webkit-keyframes dash {\n to {\n stroke-dashoffset: 136;\n }\n}\n@keyframes dash {\n to {\n stroke-dashoffset: 136;\n }\n}\n@-webkit-keyframes rotate {\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n}\n@keyframes rotate {\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n}";
|
|
45421
45420
|
styleInject(css_248z$i);
|
|
45422
45421
|
|
|
45423
|
-
var css_248z$h = ".x-utu-spinner {\n -webkit-transform-origin: 50% 65%;\n transform-origin: 50% 65%;\n}\n\n@-webkit-keyframes dash {\n to {\n stroke-dashoffset: 136;\n }\n}\n@keyframes dash {\n to {\n stroke-dashoffset: 136;\n }\n}\n@-webkit-keyframes rotate {\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n}\n@keyframes rotate {\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n}";
|
|
45424
|
-
styleInject(css_248z$h);
|
|
45425
|
-
|
|
45426
45422
|
var defaultProps = {
|
|
45427
45423
|
width: 20,
|
|
45428
45424
|
height: 20,
|
|
@@ -45436,7 +45432,7 @@
|
|
|
45436
45432
|
_d = _a.useFilter,
|
|
45437
45433
|
useFilter = _d === void 0 ? false : _d;
|
|
45438
45434
|
return v$2("svg", {
|
|
45439
|
-
style: css_248z$
|
|
45435
|
+
style: css_248z$i,
|
|
45440
45436
|
className: "x-utu-spinner",
|
|
45441
45437
|
id: "goo-loader",
|
|
45442
45438
|
width: width,
|
|
@@ -45518,13 +45514,12 @@
|
|
|
45518
45514
|
fetchBalance();
|
|
45519
45515
|
}, []);
|
|
45520
45516
|
return v$2(BaseComponent, {
|
|
45521
|
-
style: css_248z$i,
|
|
45522
45517
|
className: "utt_balance"
|
|
45523
|
-
}, isLoading ? v$2(LoadingIndicator, {
|
|
45518
|
+
}, v$2("style", null, css_248z$j), isLoading ? v$2(LoadingIndicator, {
|
|
45524
45519
|
width: 15,
|
|
45525
45520
|
height: 15
|
|
45526
45521
|
}) : v$2("h3", {
|
|
45527
|
-
className: "x-utu-h3"
|
|
45522
|
+
className: "x-utu-h3-balance"
|
|
45528
45523
|
}, UTTWalletState));
|
|
45529
45524
|
}
|
|
45530
45525
|
|
|
@@ -45804,11 +45799,10 @@
|
|
|
45804
45799
|
}
|
|
45805
45800
|
};
|
|
45806
45801
|
return v$2(BaseComponent, {
|
|
45807
|
-
style: css_248z$j,
|
|
45808
45802
|
className: "endor-input-section x-utu-section x-utu-section-no-border-" + envCondition,
|
|
45809
45803
|
excludeBootstrap: true,
|
|
45810
45804
|
excludeFonts: true
|
|
45811
|
-
}, v$2("section", {
|
|
45805
|
+
}, v$2("style", null, css_248z$k), v$2("section", {
|
|
45812
45806
|
className: 'endor-input-form-section'
|
|
45813
45807
|
}, v$2("div", {
|
|
45814
45808
|
className: 'endor-utt-balance'
|
|
@@ -45822,13 +45816,13 @@
|
|
|
45822
45816
|
className: 'endor-text-area'
|
|
45823
45817
|
}, v$2("p", {
|
|
45824
45818
|
className: 'endor-text-title'
|
|
45825
|
-
}, "Would you like to
|
|
45819
|
+
}, "Would you like to endorse this platform?"), v$2("div", {
|
|
45826
45820
|
className: 'endor-text-container'
|
|
45827
45821
|
}, v$2("span", {
|
|
45828
45822
|
className: 'endor-text-tooltip'
|
|
45829
|
-
}, "To endorse, you need to have some UTT in your account.
|
|
45823
|
+
}, "To endorse, you need to have some UTT in your account."), v$2("p", {
|
|
45830
45824
|
className: 'endor-text-info'
|
|
45831
|
-
}, "i"))), v$2("p", {
|
|
45825
|
+
}, "i"))), v$2("br", null), v$2("p", {
|
|
45832
45826
|
className: 'endor-text-body'
|
|
45833
45827
|
}, "When you endorse a platform, it means you have personally had a good experience and want to back your rating by staking an amount of UTT (UTU trust token) on the platform.")), v$2("form", {
|
|
45834
45828
|
onSubmit: handleSubmit(onSubmit),
|
|
@@ -47105,8 +47099,8 @@
|
|
|
47105
47099
|
};
|
|
47106
47100
|
var _default = reactStars.default = ReactStars;
|
|
47107
47101
|
|
|
47108
|
-
var css_248z$
|
|
47109
|
-
styleInject(css_248z$
|
|
47102
|
+
var css_248z$h = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.star-rating-section {\n display: flex;\n justify-content: center;\n align-items: center;\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n width: 170px;\n}\n\n.utu-star-rating-text {\n font-size: 1rem;\n font-weight: bold;\n color: rgb(252, 229, 70);\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .star-rating-section {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n padding-left: 1rem;\n width: 170px;\n }\n}";
|
|
47103
|
+
styleInject(css_248z$h);
|
|
47110
47104
|
|
|
47111
47105
|
/* eslint-disable no-nested-ternary */
|
|
47112
47106
|
function StarRatingInput(props) {
|
|
@@ -47135,11 +47129,10 @@
|
|
|
47135
47129
|
});
|
|
47136
47130
|
};
|
|
47137
47131
|
return v$2(BaseComponent, {
|
|
47138
|
-
style: css_248z$g,
|
|
47139
47132
|
className: "star-rating-section x-utu-section x-utu-section-" + (isDark ? "dark" : "light"),
|
|
47140
47133
|
excludeBootstrap: true,
|
|
47141
47134
|
excludeFonts: true
|
|
47142
|
-
}, v$2(SubmitStatusView, {
|
|
47135
|
+
}, v$2("style", null, css_248z$h), v$2(SubmitStatusView, {
|
|
47143
47136
|
submitStatus: submitStatus
|
|
47144
47137
|
}, v$2(_default, {
|
|
47145
47138
|
count: 5,
|
|
@@ -47152,8 +47145,8 @@
|
|
|
47152
47145
|
}, starRatings, " / 5.0"));
|
|
47153
47146
|
}
|
|
47154
47147
|
|
|
47155
|
-
var css_248z$f = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\n.x-utu-video {\n display: flex;\n justify-content: center;\n}\n.x-utu-video-btn-round {\n border: none;\n margin: 5px 0;\n width: 4rem;\n height: 4rem;\n font-size: 9px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n z-index: 1;\n border-radius: 50px;\n}\n.x-utu-video-btn-round-light {\n background-color: rgb(252, 229, 70);\n}\n.x-utu-video-btn-round-dark {\n background-color: rgb(252, 229, 70);\n}\n.x-utu-video-btn-round-loading {\n position: absolute;\n bottom: 5.5rem;\n margin-top: 0.25;\n}\n.x-utu-video-btn-round-spinner-light {\n fill: #000000;\n}\n.x-utu-video-btn-round-spinner-dark {\n fill: #000000;\n}\n.x-utu-video-btn-round-play {\n width: 4rem;\n margin-left: 0.5rem;\n}\n.x-utu-video-btn-round-play-light {\n fill: #000000;\n}\n.x-utu-video-btn-round-play-dark {\n fill: #000000;\n}\n.x-utu-video-btn-round-stop {\n position: absolute;\n bottom: 10%;\n margin-top: 0.25;\n background-color: rgb(252, 229, 70);\n}\n.x-utu-video-btn-round-stop-light {\n fill: #000000;\n}\n.x-utu-video-btn-round-stop-dark {\n fill: #000000;\n}\n.x-utu-video-btn-round-text-light {\n color: #000000;\n}\n.x-utu-video-btn-round-text-dark {\n color: #000000;\n}\n.x-utu-video-btn-container {\n display: flex;\n z-index: 0;\n justify-content: center;\n}\n.x-utu-video-btn-stop-icon {\n width: 20px;\n height: 20px;\n border-radius: 5px;\n}\n.x-utu-video-btn-stop-icon-light {\n background: #000000;\n}\n.x-utu-video-btn-stop-icon-dark {\n background: #000000;\n}\n.x-utu-video-screen-recording {\n width: 100%;\n position: relative;\n z-index: 1;\n justify-content: center;\n min-height: 60%;\n max-height: 60%;\n background-color: #fcf8e5;\n border-bottom-left-radius: 2%;\n border-bottom-right-radius: 2%;\n}\n.x-utu-video-recorder {\n padding-top: 0;\n padding-bottom: 4rem;\n height: fit-content;\n}\n.x-utu-video-container {\n display: flex;\n justify-content: center;\n padding-top: 2rem;\n padding-bottom: 2rem;\n}\n.x-utu-video-response-message {\n height: 3rem;\n line-height: 3rem;\n width: 100%;\n}\n.x-utu-video-wrapper {\n display: flex;\n align-items: center;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-video-recorder {\n padding-bottom: 4rem;\n height: fit-content;\n background-color: rgb(253, 253, 253) !important;\n }\n .x-utu-video-btn-round-stop {\n bottom: 2.5rem;\n }\n .x-utu-video-container {\n padding-top: 2rem;\n padding-bottom: 2rem;\n }\n .x-utu-video-screen-recording {\n background-color: #fcf8e5;\n width: 65%;\n margin: 0% auto 0;\n border-bottom-left-radius: 2%;\n border-bottom-right-radius: 2%;\n }\n}\n@media only screen and (max-width: 768px) {\n .x-utu-video-screen-recording {\n background-color: #fcf8e5;\n height: 100%;\n }\n}";
|
|
47156
|
-
styleInject(css_248z$
|
|
47148
|
+
var css_248z$g = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\n.x-utu-video {\n display: flex;\n justify-content: center;\n}\n.x-utu-video-btn-round {\n border: none;\n margin: 5px 0;\n width: 4rem;\n height: 4rem;\n font-size: 9px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n z-index: 1;\n border-radius: 50px;\n}\n.x-utu-video-btn-round-light {\n background-color: rgb(252, 229, 70);\n}\n.x-utu-video-btn-round-dark {\n background-color: rgb(252, 229, 70);\n}\n.x-utu-video-btn-round-loading {\n position: absolute;\n bottom: 5.5rem;\n margin-top: 0.25;\n}\n.x-utu-video-btn-round-spinner-light {\n fill: #000000;\n}\n.x-utu-video-btn-round-spinner-dark {\n fill: #000000;\n}\n.x-utu-video-btn-round-play {\n width: 4rem;\n margin-left: 0.5rem;\n}\n.x-utu-video-btn-round-play-light {\n fill: #000000;\n}\n.x-utu-video-btn-round-play-dark {\n fill: #000000;\n}\n.x-utu-video-btn-round-stop {\n position: absolute;\n bottom: 10%;\n margin-top: 0.25;\n background-color: rgb(252, 229, 70);\n}\n.x-utu-video-btn-round-stop-light {\n fill: #000000;\n}\n.x-utu-video-btn-round-stop-dark {\n fill: #000000;\n}\n.x-utu-video-btn-round-text-light {\n color: #000000;\n}\n.x-utu-video-btn-round-text-dark {\n color: #000000;\n}\n.x-utu-video-btn-container {\n display: flex;\n z-index: 0;\n justify-content: center;\n}\n.x-utu-video-btn-stop-icon {\n width: 20px;\n height: 20px;\n border-radius: 5px;\n}\n.x-utu-video-btn-stop-icon-light {\n background: #000000;\n}\n.x-utu-video-btn-stop-icon-dark {\n background: #000000;\n}\n.x-utu-video-screen-recording {\n width: 100%;\n position: relative;\n z-index: 1;\n justify-content: center;\n min-height: 60%;\n max-height: 60%;\n background-color: #fcf8e5;\n border-bottom-left-radius: 2%;\n border-bottom-right-radius: 2%;\n}\n.x-utu-video-recorder {\n padding-top: 0;\n padding-bottom: 4rem;\n height: fit-content;\n}\n.x-utu-video-container {\n display: flex;\n justify-content: center;\n padding-top: 2rem;\n padding-bottom: 2rem;\n}\n.x-utu-video-response-message {\n height: 3rem;\n line-height: 3rem;\n width: 100%;\n}\n.x-utu-video-wrapper {\n display: flex;\n align-items: center;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-video-recorder {\n padding-bottom: 4rem;\n height: fit-content;\n background-color: rgb(253, 253, 253) !important;\n }\n .x-utu-video-btn-round-stop {\n bottom: 2.5rem;\n }\n .x-utu-video-container {\n padding-top: 2rem;\n padding-bottom: 2rem;\n }\n .x-utu-video-screen-recording {\n background-color: #fcf8e5;\n width: 65%;\n margin: 0% auto 0;\n border-bottom-left-radius: 2%;\n border-bottom-right-radius: 2%;\n }\n}\n@media only screen and (max-width: 768px) {\n .x-utu-video-screen-recording {\n background-color: #fcf8e5;\n height: 100%;\n }\n}";
|
|
47149
|
+
styleInject(css_248z$g);
|
|
47157
47150
|
|
|
47158
47151
|
/* eslint max-len: 0 */
|
|
47159
47152
|
function videoIcon$1() {
|
|
@@ -47170,147 +47163,12 @@
|
|
|
47170
47163
|
}));
|
|
47171
47164
|
}
|
|
47172
47165
|
|
|
47173
|
-
/* eslint-disable no-nested-ternary */
|
|
47174
|
-
function RecordVideo(props) {
|
|
47175
|
-
/**
|
|
47176
|
-
* Holds the active reader retrieved from ReadableStorage.getReader() while a video is recording, or null while no
|
|
47177
|
-
* video is recording.
|
|
47178
|
-
*/
|
|
47179
|
-
// environments
|
|
47180
|
-
var _a = p(false),
|
|
47181
|
-
isDark = _a[0],
|
|
47182
|
-
setIsDark = _a[1];
|
|
47183
|
-
if (props[ATTR_THEME_COLOR] === "dark") {
|
|
47184
|
-
setIsDark(true);
|
|
47185
|
-
}
|
|
47186
|
-
// environment conditionals
|
|
47187
|
-
var envCondition = isDark ? "dark" : "light";
|
|
47188
|
-
return v$2(BaseComponent, {
|
|
47189
|
-
style: css_248z$f,
|
|
47190
|
-
className: "x-utu-video-container x-utu-section x-utu-section-" + envCondition
|
|
47191
|
-
}, v$2("div", {
|
|
47192
|
-
className: "x-utu-video-wrapper"
|
|
47193
|
-
}, v$2("button", {
|
|
47194
|
-
type: "button",
|
|
47195
|
-
style: {
|
|
47196
|
-
backgroundColor: props[ATTR_BTN_COLOR] === undefined ? null : "" + props[ATTR_BTN_COLOR]
|
|
47197
|
-
},
|
|
47198
|
-
className: "x-utu-video-btn-round x-utu-video-btn-round-" + envCondition,
|
|
47199
|
-
onClick: function onClick() {
|
|
47200
|
-
props.setVideoVisibility();
|
|
47201
|
-
}
|
|
47202
|
-
}, v$2(videoIcon$1, null)), v$2("p", {
|
|
47203
|
-
className: "mx-3 mt-3 x-utu-video-btn-round-text-" + envCondition
|
|
47204
|
-
}, " ", v$2("b", null, "RECORD YOUR STORY"), " ")));
|
|
47205
|
-
}
|
|
47206
|
-
|
|
47207
|
-
function FeedbackForm(props) {
|
|
47208
|
-
var targetType = props[ATTR_TARGET_TYPE];
|
|
47209
|
-
var targetUuid = props[ATTR_TARGET_UUID];
|
|
47210
|
-
var targetHumanReadable = props[ATTR_TARGET_HUMAN_READABLE];
|
|
47211
|
-
var getTargetHumanReadableToDisplay = function getTargetHumanReadableToDisplay() {
|
|
47212
|
-
var targetHumanReadableToReturn;
|
|
47213
|
-
switch (targetType) {
|
|
47214
|
-
case "address":
|
|
47215
|
-
targetHumanReadableToReturn = targetUuid;
|
|
47216
|
-
break;
|
|
47217
|
-
default:
|
|
47218
|
-
targetHumanReadableToReturn = targetHumanReadable;
|
|
47219
|
-
}
|
|
47220
|
-
return targetHumanReadableToReturn;
|
|
47221
|
-
};
|
|
47222
|
-
var targetHumanReadableToDisplay = getTargetHumanReadableToDisplay();
|
|
47223
|
-
// environments
|
|
47224
|
-
var _a = p(false),
|
|
47225
|
-
isDark = _a[0],
|
|
47226
|
-
setIsDark = _a[1];
|
|
47227
|
-
if (props[ATTR_THEME_COLOR] === "dark") {
|
|
47228
|
-
setIsDark(true);
|
|
47229
|
-
}
|
|
47230
|
-
/* eslint-disable react/jsx-props-no-spreading */
|
|
47231
|
-
return v$2(BaseComponent, {
|
|
47232
|
-
style: css_248z$n,
|
|
47233
|
-
className: "utu-feedback-form"
|
|
47234
|
-
}, v$2("div", {
|
|
47235
|
-
className: "mobile-view"
|
|
47236
|
-
}, targetType ? v$2("div", {
|
|
47237
|
-
className: "target-human-readable"
|
|
47238
|
-
}, "Give feedback for: ", targetType, " ( ", targetHumanReadableToDisplay, " )") : "", v$2(RecordVideo, __assign({}, props, {
|
|
47239
|
-
setVideoVisibility: props.setVideoVisibility
|
|
47240
|
-
})), v$2(StarRatingInput, __assign({}, props)), v$2(Badges, __assign({}, props)), v$2(FeedbackTextInput, __assign({}, props)), v$2(EndorsementForm, __assign({}, props)), v$2("section", {
|
|
47241
|
-
className: "logo-section-mobile"
|
|
47242
|
-
}, v$2("div", {
|
|
47243
|
-
className: "logo-position-mobile"
|
|
47244
|
-
}, v$2(Logo, null)))), v$2("div", {
|
|
47245
|
-
className: "desktop-view"
|
|
47246
|
-
}, v$2("div", {
|
|
47247
|
-
className: "desktop-view-block-1 desktop-view-block-1-" + (isDark ? "dark" : "light")
|
|
47248
|
-
}, targetType ? v$2("div", {
|
|
47249
|
-
className: "target-human-readable"
|
|
47250
|
-
}, v$2("p", null, " Give feedback for: ( ", targetHumanReadableToDisplay, " )"), v$2("p", {
|
|
47251
|
-
style: {
|
|
47252
|
-
textAlign: "center"
|
|
47253
|
-
}
|
|
47254
|
-
}, "Signal type: ", targetType)) : "", v$2("div", {
|
|
47255
|
-
className: "x-utu-feedback-form-video-stars"
|
|
47256
|
-
}, v$2(RecordVideo, __assign({}, props, {
|
|
47257
|
-
setVideoVisibility: props.setVideoVisibility
|
|
47258
|
-
})), v$2("div", {
|
|
47259
|
-
className: "x-utu-divider"
|
|
47260
|
-
}), v$2(StarRatingInput, __assign({}, props))), v$2("div", {
|
|
47261
|
-
className: "x-utu-feedback-form-Badges"
|
|
47262
|
-
}, v$2(Badges, __assign({}, props)))), v$2("div", {
|
|
47263
|
-
className: "desktop-view-block-2 desktop-view-block-2-" + (isDark ? "dark" : "light")
|
|
47264
|
-
}, v$2(FeedbackTextInput, __assign({}, props))), v$2("div", {
|
|
47265
|
-
className: "desktop-view-block-3 desktop-view-block-3-" + (isDark ? "dark" : "light")
|
|
47266
|
-
}, v$2(EndorsementForm, __assign({}, props))), v$2("section", {
|
|
47267
|
-
className: "logo-section"
|
|
47268
|
-
}, v$2("div", {
|
|
47269
|
-
className: "logo-position-form"
|
|
47270
|
-
}, v$2(Logo, null)))));
|
|
47271
|
-
}
|
|
47272
|
-
|
|
47273
|
-
var css_248z$e = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-popup {\n display: flex;\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n z-index: 2;\n overflow: scroll;\n}\n.x-utu-popup-container {\n z-index: 1001;\n width: 100%;\n}\n.x-utu-popup-container-dark {\n background: transparent;\n}\n.x-utu-popup-container-light {\n background: transparent;\n}\n.x-utu-popup-icon-btn {\n padding: 10px;\n margin-right: 3%;\n font-size: 2.8em;\n border: none;\n background: none;\n transition: all ease-out 0.3s;\n}\n.x-utu-popup-icon-btn:hover {\n transform: scale(1.3);\n opacity: 0.6;\n}\n.x-utu-popup-icon-btn-overlay {\n z-index: 1001;\n}\n.x-utu-popup-icon-btn-light {\n color: #000000;\n}\n.x-utu-popup-icon-btn-dark {\n color: #ffffff;\n}\n.x-utu-popup-container {\n z-index: 1001;\n}\n.x-utu-popup-container-content {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: flex-end;\n border-radius: 10px 10px 0 0;\n background-color: #fcf8e5;\n}\n.x-utu-popup-container-dark {\n background: transparent;\n}\n.x-utu-popup-container-light {\n background: transparent;\n}\n.x-utu-popup-background {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background-color: rgba(0, 0, 0, 0.5);\n min-width: 100%;\n min-height: 100%;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-popup {\n min-width: 100%;\n min-height: 100%;\n }\n .x-utu-popup-container {\n align-items: center;\n min-width: 100%;\n min-height: 120%;\n }\n .x-utu-popup-container-content {\n align-items: center;\n margin-top: 2%;\n }\n}\n@media only screen and (max-width: 768px) {\n .x-utu-popup-container-content {\n width: 100%;\n background-color: #ffffff;\n justify-content: center;\n }\n}";
|
|
47274
|
-
styleInject(css_248z$e);
|
|
47275
|
-
|
|
47276
|
-
/* eslint-disable no-nested-ternary */
|
|
47277
|
-
function PopUp(_a) {
|
|
47278
|
-
var onClose = _a.onClose,
|
|
47279
|
-
children = _a.children,
|
|
47280
|
-
closeButtonOverlay = _a.closeButtonOverlay,
|
|
47281
|
-
themeColor = _a.themeColor;
|
|
47282
|
-
// environments
|
|
47283
|
-
var _b = p(false),
|
|
47284
|
-
isDark = _b[0],
|
|
47285
|
-
setIsDark = _b[1];
|
|
47286
|
-
if (themeColor === "dark") {
|
|
47287
|
-
setIsDark(true);
|
|
47288
|
-
}
|
|
47289
|
-
// environment conditionals
|
|
47290
|
-
var envCondition = isDark ? "dark" : "light";
|
|
47291
|
-
return v$2(BaseComponent, {
|
|
47292
|
-
style: css_248z$e,
|
|
47293
|
-
className: "x-utu-popup"
|
|
47294
|
-
}, v$2("div", {
|
|
47295
|
-
className: "x-utu-popup-container x-utu-popup-container-" + envCondition
|
|
47296
|
-
}, v$2("div", {
|
|
47297
|
-
className: "x-utu-popup-container-content"
|
|
47298
|
-
}, v$2("button", {
|
|
47299
|
-
type: "button",
|
|
47300
|
-
className: "x-utu-popup-icon-btn x-utu-popup-icon-btn-" + envCondition + " " + (closeButtonOverlay && "x-utu-popup-icon-btn-overlay"),
|
|
47301
|
-
onClick: onClose
|
|
47302
|
-
}, "\xD7")), children), v$2("div", {
|
|
47303
|
-
onClick: onClose,
|
|
47304
|
-
className: "x-utu-popup-background"
|
|
47305
|
-
}));
|
|
47306
|
-
}
|
|
47307
|
-
|
|
47308
47166
|
var o$1;!function(e){e.AbortError="media_aborted",e.NotAllowedError="permission_denied",e.NotFoundError="no_specified_media_found",e.NotReadableError="media_in_use",e.OverconstrainedError="invalid_media_constraints",e.TypeError="no_constraints",e.NONE="",e.NO_RECORDER="recorder_error";}(o$1||(o$1={}));var i$1=function(){function e(){this.url=null,this.blob=new Blob,this.mediaChunks=[];}var r=e.prototype;return r.setBlobProperties=function(e){this.blobProperties=e;},r.storeChunk=function(e){this.mediaChunks.push(e);},r.stop=function(){var e=new Blob(this.mediaChunks,this.blobProperties),r=URL.createObjectURL(e);this.blob=e,this.url=r;},r.getUrl=function(){return this.url},r.getBlob=function(){return this.blob},e}();function u$1(u){var c=u.audio,a=void 0===c||c,s=u.video,d=void 0!==s&&s,l=u.onStop,f=void 0===l?function(){return null}:l,p$1=u.blobPropertyBag,v=u.screen,h=void 0!==v&&v,m=u.mediaRecorderOptions,b=void 0===m?null:m,g=u.videoStorageFactory,w=void 0===g?function(){return new i$1}:g,y=u.timeslice,R=void 0===y?void 0:y,E=_(null),P=_(null),M=_(null),_$1=p("idle"),k=_$1[0],T=_$1[1],O=p(!1),N=O[0],B=O[1],D=p(null),U=D[0],j=D[1],C=p("NONE"),A=C[0],S=C[1],F=!1,L=T$1(function(){try{T("acquiring_media");var e={audio:"boolean"==typeof a?!!a:a,video:"boolean"==typeof d?!!d:d},r=function(r,n){try{var t=function(){function r(){T("idle");}var n=h?Promise.resolve(window.navigator.mediaDevices.getDisplayMedia({video:d||!0})).then(function(e){function r(){M.current=e;}var n=function(){if(a)return Promise.resolve(window.navigator.mediaDevices.getUserMedia({audio:a})).then(function(r){r.getAudioTracks().forEach(function(r){return e.addTrack(r)});})}();return n&&n.then?n.then(r):r()}):Promise.resolve(window.navigator.mediaDevices.getUserMedia(e)).then(function(e){M.current=e;});return n&&n.then?n.then(r):r()}();}catch(e){return n(e)}return t&&t.then?t.then(void 0,n):t}(0,function(e){S(e.name),T("idle");});return Promise.resolve(r&&r.then?r.then(function(){}):void 0)}catch(e){return Promise.reject(e)}},[a,d,h]);h$1(function(){if(!window.MediaRecorder)throw new Error("Unsupported Browser");if(h&&!window.navigator.mediaDevices.getDisplayMedia)throw new Error("This browser doesn't support screen capturing");var e=function(e){var r=navigator.mediaDevices.getSupportedConstraints(),n=Object.keys(e).filter(function(e){return !r[e]});n.length>0&&console.error("The constraints "+n.join(",")+" doesn't support on this browser. Please check your ReactMediaRecorder component.");};"object"==typeof a&&e(a),"object"==typeof d&&e(d),b&&b.mimeType&&(MediaRecorder.isTypeSupported(b.mimeType)||console.error("The specified MIME type you supplied for MediaRecorder doesn't support this browser")),M.current||L();},[a,h,d,L,b]);var q=function(e){var r,n=e.data;if(!F){var t,o=Object.assign({type:n.type},p$1||(d?{type:"video/mp4"}:{type:"audio/wav"}));null==(t=E.current)||t.setBlobProperties(o),F=!0;}null==(r=E.current)||r.storeChunk(n);},x=function(){var e,r,n,t;null==(e=E.current)||e.stop();var o=null!=(r=null==(n=E.current)?void 0:n.getUrl())?r:null;T("stopped"),j(o),f(o,null==(t=E.current)?void 0:t.getBlob());},I=function(e){B(e),M.current&&M.current.getAudioTracks().forEach(function(r){return r.enabled=!e});};return {error:o$1[A],muteAudio:function(){return I(!0)},unMuteAudio:function(){return I(!1)},startRecording:function(){try{var e=function(){var e=function(){if(M.current){var e=function(){E.current=w(),F=!1,P.current=new MediaRecorder(M.current),P.current.ondataavailable=q,P.current.onstop=x,P.current.onerror=function(){S("NO_RECORDER"),T("idle");},P.current.start(R),T("recording");},r=M.current.getTracks().some(function(e){return "ended"===e.readyState}),n=function(){if(r)return Promise.resolve(L()).then(function(){})}();return n&&n.then?n.then(e):e()}}();if(e&&e.then)return e.then(function(){})};S("NONE");var r=function(){if(!M.current)return Promise.resolve(L()).then(function(){})}();return Promise.resolve(r&&r.then?r.then(e):e())}catch(e){return Promise.reject(e)}},pauseRecording:function(){P.current&&"recording"===P.current.state&&P.current.pause();},resumeRecording:function(){P.current&&"paused"===P.current.state&&P.current.resume();},stopRecording:function(){P.current&&"inactive"!==P.current.state&&(T("stopping"),P.current.stop(),M.current&&M.current.getTracks().forEach(function(e){return e.stop()}));},mediaBlobUrl:U,status:k,isAudioMuted:N,previewStream:M.current?new MediaStream(M.current.getVideoTracks()):null,clearBlobUrl:function(){return j(null)}}}
|
|
47309
47167
|
|
|
47310
47168
|
var e=0;function t(t){return "__private_"+e+++"_"+t}function i(e,t){if(!Object.prototype.hasOwnProperty.call(e,t))throw new TypeError("attempted to use private field on non-instance");return e}var r=function(e){this.value=e;},n=t("head"),o=t("end"),u=function(){function e(){Object.defineProperty(this,n,{writable:!0,value:void 0}),Object.defineProperty(this,o,{writable:!0,value:void 0});}var t=e.prototype;return t.enqueue=function(e){var t=new r(e);i(this,o)[o]?(i(this,o)[o].next=t,i(this,o)[o]=t):i(this,n)[n]=i(this,o)[o]=t;},t.dequeue=function(){var e=i(this,n)[n];return i(this,n)[n]=null==e?void 0:e.next,i(this,n)[n]||(i(this,o)[o]=void 0),null==e?void 0:e.value},e}();function s(e){return {done:!1,value:e}}var h={done:!0},a=t("chunkQueue"),l=t("resolveQueue"),v=t("isInProgress"),c=t("isLocked"),d=function(){function e(){Object.defineProperty(this,a,{writable:!0,value:void 0}),Object.defineProperty(this,l,{writable:!0,value:void 0}),Object.defineProperty(this,v,{writable:!0,value:void 0}),Object.defineProperty(this,c,{writable:!0,value:void 0}),this.url=null,i(this,a)[a]=new u,i(this,l)[l]=new u,i(this,v)[v]=!0,i(this,c)[c]=!1;}var t=e.prototype;return t.setUrl=function(e){this.url=e;},t.setBlobProperties=function(e){this.blobProperties=e;},t.storeChunk=function(e){i(this,v)[v]=!0;var t=i(this,l)[l].dequeue();t?t(s(e)):i(this,a)[a].enqueue(e);},t.stop=function(){i(this,v)[v]=!1;},t.reset=function(){i(this,v)[v]=!0,i(this,a)[a]=new u,i(this,l)[l]=new u,i(this,c)[c]=!1;},t.getUrl=function(){return this.url},t.getBlob=function(){},t.getReader=function(){if(i(this,c)[c])throw new Error("ReadableStorage is locked.");i(this,c)[c]=!0;var e=this;return {read:function(){var t=i(e,a)[a].dequeue();return t?Promise.resolve(s(t)):i(e,v)[v]?new Promise(function(t){return i(e,l)[l].enqueue(t)}):Promise.resolve(h)}}},e}();
|
|
47311
47169
|
|
|
47312
|
-
var css_248z$d = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}";
|
|
47313
|
-
styleInject(css_248z$
|
|
47170
|
+
var css_248z$f = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}";
|
|
47171
|
+
styleInject(css_248z$f);
|
|
47314
47172
|
|
|
47315
47173
|
/* eslint max-len: 0 */
|
|
47316
47174
|
function play() {
|
|
@@ -47542,7 +47400,7 @@
|
|
|
47542
47400
|
/* eslint max-len: 0 */
|
|
47543
47401
|
function videoIcon() {
|
|
47544
47402
|
return v$2("svg", {
|
|
47545
|
-
style: css_248z$
|
|
47403
|
+
style: css_248z$i,
|
|
47546
47404
|
className: "x-utu-spinner",
|
|
47547
47405
|
id: "goo-loader",
|
|
47548
47406
|
width: "90",
|
|
@@ -47619,11 +47477,42 @@
|
|
|
47619
47477
|
}));
|
|
47620
47478
|
}
|
|
47621
47479
|
|
|
47622
|
-
|
|
47623
|
-
|
|
47624
|
-
|
|
47625
|
-
|
|
47480
|
+
var css_248z$e = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-popup {\n display: flex;\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n z-index: 2;\n overflow: scroll;\n}\n.x-utu-popup-container {\n z-index: 1001;\n width: 100%;\n}\n.x-utu-popup-container-dark {\n background: transparent;\n}\n.x-utu-popup-container-light {\n background: transparent;\n}\n.x-utu-popup-icon-btn {\n padding: 10px;\n margin-right: 3%;\n font-size: 2.8em;\n border: none;\n background: none;\n transition: all ease-out 0.3s;\n}\n.x-utu-popup-icon-btn:hover {\n transform: scale(1.3);\n opacity: 0.6;\n}\n.x-utu-popup-icon-btn-overlay {\n z-index: 1001;\n}\n.x-utu-popup-icon-btn-light {\n color: #000000;\n}\n.x-utu-popup-icon-btn-dark {\n color: #ffffff;\n}\n.x-utu-popup-container {\n z-index: 1001;\n}\n.x-utu-popup-container-content {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: flex-end;\n border-radius: 10px 10px 0 0;\n background-color: #fcf8e5;\n}\n.x-utu-popup-container-dark {\n background: transparent;\n}\n.x-utu-popup-container-light {\n background: transparent;\n}\n.x-utu-popup-background {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background-color: rgba(0, 0, 0, 0.5);\n min-width: 100%;\n min-height: 100%;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-popup {\n min-width: 100%;\n min-height: 100%;\n }\n .x-utu-popup-container {\n align-items: center;\n min-width: 100%;\n min-height: 120%;\n }\n .x-utu-popup-container-content {\n align-items: center;\n margin-top: 2%;\n }\n}\n@media only screen and (max-width: 768px) {\n .x-utu-popup-container-content {\n width: 100%;\n background-color: #ffffff;\n justify-content: center;\n }\n}";
|
|
47481
|
+
styleInject(css_248z$e);
|
|
47482
|
+
|
|
47483
|
+
/* eslint-disable no-nested-ternary */
|
|
47484
|
+
function PopUp(_a) {
|
|
47485
|
+
var onClose = _a.onClose,
|
|
47486
|
+
children = _a.children,
|
|
47487
|
+
closeButtonOverlay = _a.closeButtonOverlay,
|
|
47488
|
+
themeColor = _a.themeColor;
|
|
47489
|
+
// environments
|
|
47490
|
+
var _b = p(false),
|
|
47491
|
+
isDark = _b[0],
|
|
47492
|
+
setIsDark = _b[1];
|
|
47493
|
+
if (themeColor === "dark") {
|
|
47494
|
+
setIsDark(true);
|
|
47495
|
+
}
|
|
47496
|
+
// environment conditionals
|
|
47497
|
+
var envCondition = isDark ? "dark" : "light";
|
|
47498
|
+
return v$2(BaseComponent, {
|
|
47499
|
+
className: "x-utu-popup"
|
|
47500
|
+
}, v$2("style", null, css_248z$e), v$2("div", {
|
|
47501
|
+
className: "x-utu-popup-container x-utu-popup-container-" + envCondition
|
|
47502
|
+
}, v$2("div", {
|
|
47503
|
+
className: "x-utu-popup-container-content"
|
|
47504
|
+
}, v$2("button", {
|
|
47505
|
+
type: "button",
|
|
47506
|
+
className: "x-utu-popup-icon-btn x-utu-popup-icon-btn-" + envCondition + " " + (closeButtonOverlay && "x-utu-popup-icon-btn-overlay"),
|
|
47507
|
+
onClick: onClose
|
|
47508
|
+
}, "\xD7")), children), v$2("div", {
|
|
47509
|
+
onClick: onClose,
|
|
47510
|
+
className: "x-utu-popup-background"
|
|
47511
|
+
}));
|
|
47512
|
+
}
|
|
47513
|
+
|
|
47626
47514
|
function Recorder(props) {
|
|
47515
|
+
var _this = this;
|
|
47627
47516
|
/**
|
|
47628
47517
|
* Holds the active reader retrieved from ReadableStorage.getReader() while a video is recording, or null while no
|
|
47629
47518
|
* video is recording.
|
|
@@ -47739,14 +47628,32 @@
|
|
|
47739
47628
|
startRecording();
|
|
47740
47629
|
};
|
|
47741
47630
|
console.log("status_onrecording", status);
|
|
47631
|
+
var onClose = function onClose() {
|
|
47632
|
+
return __awaiter(_this, void 0, void 0, function () {
|
|
47633
|
+
return __generator(this, function (_a) {
|
|
47634
|
+
switch (_a.label) {
|
|
47635
|
+
case 0:
|
|
47636
|
+
return [4 /*yield*/, onStop()];
|
|
47637
|
+
case 1:
|
|
47638
|
+
_a.sent();
|
|
47639
|
+
stopRecording();
|
|
47640
|
+
props.onClose();
|
|
47641
|
+
return [2 /*return*/];
|
|
47642
|
+
}
|
|
47643
|
+
});
|
|
47644
|
+
});
|
|
47645
|
+
};
|
|
47742
47646
|
// useEffect(() => {
|
|
47743
47647
|
// getMediaStream();
|
|
47744
47648
|
// return () => {
|
|
47745
47649
|
// stopStream()
|
|
47746
47650
|
// }
|
|
47747
47651
|
// }, [])
|
|
47748
|
-
return v$2(
|
|
47749
|
-
|
|
47652
|
+
return v$2(PopUp, {
|
|
47653
|
+
closeButtonOverlay: true,
|
|
47654
|
+
onClose: onClose
|
|
47655
|
+
}, v$2(BaseComponent, {
|
|
47656
|
+
style: css_248z$g,
|
|
47750
47657
|
className: "x-utu-video-screen-recording d-flex flex-column align-items-center justify-content-center"
|
|
47751
47658
|
}, VideoSrc(status, previewStream), isRecording && v$2("button", {
|
|
47752
47659
|
type: "button",
|
|
@@ -47771,13 +47678,17 @@
|
|
|
47771
47678
|
className: "x-utu-video-response-message my-4 text-white bg-danger"
|
|
47772
47679
|
}, " ", errorMessage, " ")), v$2("section", {
|
|
47773
47680
|
className: "logo-position-video"
|
|
47774
|
-
}, v$2(Logo, null)));
|
|
47681
|
+
}, v$2(Logo, null))));
|
|
47775
47682
|
}
|
|
47776
47683
|
|
|
47777
|
-
function
|
|
47684
|
+
function RecordVideo(props) {
|
|
47685
|
+
/**
|
|
47686
|
+
* Holds the active reader retrieved from ReadableStorage.getReader() while a video is recording, or null while no
|
|
47687
|
+
* video is recording.
|
|
47688
|
+
*/
|
|
47778
47689
|
var _a = p(false),
|
|
47779
|
-
|
|
47780
|
-
|
|
47690
|
+
videoVisible = _a[0],
|
|
47691
|
+
setVideoVisible = _a[1];
|
|
47781
47692
|
// environments
|
|
47782
47693
|
var _b = p(false),
|
|
47783
47694
|
isDark = _b[0],
|
|
@@ -47787,28 +47698,69 @@
|
|
|
47787
47698
|
}
|
|
47788
47699
|
// environment conditionals
|
|
47789
47700
|
var envCondition = isDark ? "dark" : "light";
|
|
47790
|
-
// const [isRecording, setIsRecording] = useState(false)
|
|
47791
|
-
// const { stopRecording } = useReactMediaRecorder({
|
|
47792
|
-
// audio: true,
|
|
47793
|
-
// timeslice: 1000,
|
|
47794
|
-
// video: false
|
|
47795
|
-
// })
|
|
47796
|
-
var setVideoVisibility = function setVideoVisibility() {
|
|
47797
|
-
setVideoVisible(!videoVisible);
|
|
47798
|
-
setPopUpVisible(!popUpVisible);
|
|
47799
|
-
};
|
|
47800
|
-
var _c = p(false),
|
|
47801
|
-
videoVisible = _c[0],
|
|
47802
|
-
setVideoVisible = _c[1];
|
|
47803
47701
|
return v$2(BaseComponent, {
|
|
47804
|
-
|
|
47805
|
-
|
|
47702
|
+
className: "x-utu-video-container x-utu-section x-utu-section-" + envCondition
|
|
47703
|
+
}, v$2("style", null, css_248z$g), v$2("div", {
|
|
47704
|
+
className: "x-utu-video-wrapper"
|
|
47806
47705
|
}, v$2("button", {
|
|
47807
47706
|
type: "button",
|
|
47808
47707
|
style: {
|
|
47809
47708
|
backgroundColor: props[ATTR_BTN_COLOR] === undefined ? null : "" + props[ATTR_BTN_COLOR]
|
|
47810
47709
|
},
|
|
47811
|
-
className: "x-utu-btn x-utu-btn-" + envCondition
|
|
47710
|
+
className: "x-utu-video-btn-round x-utu-video-btn-round-" + envCondition,
|
|
47711
|
+
onClick: function onClick() {
|
|
47712
|
+
setVideoVisible(true);
|
|
47713
|
+
}
|
|
47714
|
+
}, v$2(videoIcon$1, null)), v$2("p", {
|
|
47715
|
+
className: "mx-3 mt-3 x-utu-video-btn-round-text-" + envCondition
|
|
47716
|
+
}, v$2("b", null, "RECORD YOUR STORY")), videoVisible && v$2(Recorder, __assign({}, props, {
|
|
47717
|
+
onClose: function onClose() {
|
|
47718
|
+
setVideoVisible(false);
|
|
47719
|
+
}
|
|
47720
|
+
}))));
|
|
47721
|
+
}
|
|
47722
|
+
|
|
47723
|
+
function FeedbackForm(props) {
|
|
47724
|
+
var targetType = props[ATTR_TARGET_TYPE];
|
|
47725
|
+
var targetUuid = props[ATTR_TARGET_UUID];
|
|
47726
|
+
var targetHumanReadable = props[ATTR_TARGET_HUMAN_READABLE];
|
|
47727
|
+
var getTargetHumanReadableToDisplay = function getTargetHumanReadableToDisplay() {
|
|
47728
|
+
var targetHumanReadableToReturn;
|
|
47729
|
+
switch (targetType) {
|
|
47730
|
+
case "address":
|
|
47731
|
+
targetHumanReadableToReturn = targetUuid;
|
|
47732
|
+
break;
|
|
47733
|
+
default:
|
|
47734
|
+
targetHumanReadableToReturn = targetHumanReadable;
|
|
47735
|
+
}
|
|
47736
|
+
return targetHumanReadableToReturn;
|
|
47737
|
+
};
|
|
47738
|
+
var targetHumanReadableToDisplay = getTargetHumanReadableToDisplay();
|
|
47739
|
+
return v$2(BaseComponent, {
|
|
47740
|
+
className: "utu-feedback-form"
|
|
47741
|
+
}, v$2("style", null, " ", css_248z$o, " "), targetType ? v$2("div", {
|
|
47742
|
+
className: "utu-feedback-form_title"
|
|
47743
|
+
}, " Signal Type: ", targetType, " ( ", targetHumanReadableToDisplay, " ) ") : "", v$2("div", {
|
|
47744
|
+
className: "x-utu-feedback-form_body_1"
|
|
47745
|
+
}, v$2(RecordVideo, __assign({}, props)), v$2("div", {
|
|
47746
|
+
className: "x-utu-feedback-details_divider"
|
|
47747
|
+
}), v$2(StarRatingInput, __assign({}, props))), v$2("div", {
|
|
47748
|
+
className: "x-utu-feedback-form_body_2"
|
|
47749
|
+
}, v$2(Badges, __assign({}, props)), v$2(FeedbackTextInput, __assign({}, props)), v$2(EndorsementForm, __assign({}, props))));
|
|
47750
|
+
}
|
|
47751
|
+
|
|
47752
|
+
var css_248z$d = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-feedback-form-popup {\n width: 100%;\n padding: 0.5rem;\n border-radius: 10px;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n justify-content: center;\n}\n\n.x-utu-feedback-form-popup_btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n background-color: rgb(252, 229, 70);\n}";
|
|
47753
|
+
styleInject(css_248z$d);
|
|
47754
|
+
|
|
47755
|
+
function FeedbackFormPopup(props) {
|
|
47756
|
+
var _a = p(false),
|
|
47757
|
+
popUpVisible = _a[0],
|
|
47758
|
+
setPopUpVisible = _a[1];
|
|
47759
|
+
return v$2(BaseComponent, {
|
|
47760
|
+
className: "x-utu-feedback-form-popup"
|
|
47761
|
+
}, v$2("style", null, " ", css_248z$d, " "), v$2("button", {
|
|
47762
|
+
type: "button",
|
|
47763
|
+
className: "x-utu-feedback-form-popup_btn",
|
|
47812
47764
|
onClick: function onClick() {
|
|
47813
47765
|
return setPopUpVisible(true);
|
|
47814
47766
|
}
|
|
@@ -47816,28 +47768,21 @@
|
|
|
47816
47768
|
onClose: function onClose() {
|
|
47817
47769
|
return setPopUpVisible(false);
|
|
47818
47770
|
}
|
|
47819
|
-
}, props), v$2(FeedbackForm, __assign({}, props
|
|
47820
|
-
setVideoVisibility: setVideoVisibility
|
|
47821
|
-
}))), videoVisible && v$2(PopUp, {
|
|
47822
|
-
closeButtonOverlay: true,
|
|
47823
|
-
onClose: setVideoVisibility
|
|
47824
|
-
}, v$2(Recorder, __assign({}, props))));
|
|
47771
|
+
}, props), v$2(FeedbackForm, __assign({}, props))));
|
|
47825
47772
|
}
|
|
47826
47773
|
|
|
47827
|
-
var css_248z$c = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size:
|
|
47774
|
+
var css_248z$c = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-header {\n width: 100%;\n padding: 2rem 3rem;\n background-color: #fcf8e5;\n display: flex;\n justify-content: center;\n border-radius: 10px;\n}";
|
|
47828
47775
|
styleInject(css_248z$c);
|
|
47829
47776
|
|
|
47830
47777
|
function Header() {
|
|
47831
|
-
return v$2(BaseComponent, {
|
|
47832
|
-
style: css_248z$c
|
|
47833
|
-
}, v$2("section", {
|
|
47778
|
+
return v$2(BaseComponent, null, v$2("style", null, css_248z$c), v$2("section", {
|
|
47834
47779
|
className: "x-utu-header x-utu-section"
|
|
47835
47780
|
}, v$2("h3", {
|
|
47836
47781
|
className: "x-utu-h3"
|
|
47837
47782
|
}, " Feedback From Your Network ")));
|
|
47838
47783
|
}
|
|
47839
47784
|
|
|
47840
|
-
var css_248z$b = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size:
|
|
47785
|
+
var css_248z$b = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-app-link {\n width: 100%;\n text-align: center;\n justify-content: center;\n border-radius: 10px;\n padding: 0.5rem;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n background-color: #fcf8e5;\n}\n.x-utu-app-link-btn {\n background-color: rgb(252, 229, 70);\n width: 100%;\n}\n.x-utu-app-link-text {\n margin-top: 0.25rem;\n}\n\nx-utu-app-a {\n text-decoration: none;\n color: #000000;\n}\n\nx-utu-app-a :hover {\n color: #000000;\n}";
|
|
47841
47786
|
styleInject(css_248z$b);
|
|
47842
47787
|
|
|
47843
47788
|
function UtuAppSocialLink(props) {
|
|
@@ -47852,9 +47797,8 @@
|
|
|
47852
47797
|
setIsDark(true);
|
|
47853
47798
|
}
|
|
47854
47799
|
return v$2(BaseComponent, {
|
|
47855
|
-
style: css_248z$b,
|
|
47856
47800
|
className: "x-utu-app-link x-utu-section x-utu-section-no-border-" + envCondition
|
|
47857
|
-
}, v$2("button", {
|
|
47801
|
+
}, v$2("style", null, css_248z$b), v$2("button", {
|
|
47858
47802
|
className: "x-utu-app-link-btn x-utu-btn utu-btn-light",
|
|
47859
47803
|
type: "button",
|
|
47860
47804
|
style: {
|
|
@@ -47870,7 +47814,7 @@
|
|
|
47870
47814
|
}, "Connect to earn"))));
|
|
47871
47815
|
}
|
|
47872
47816
|
|
|
47873
|
-
var css_248z$a = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size:
|
|
47817
|
+
var css_248z$a = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-wallet-connect {\n width: 100%;\n align-items: center;\n text-align: center;\n justify-content: center;\n background-color: #fcf8e5;\n border-radius: 5px;\n}\n.x-utu-wallet-connect-section {\n padding: 0.5rem;\n}\n.x-utu-wallet-text-input-btn {\n width: 100%;\n background-color: rgb(252, 229, 70);\n margin-top: 1rem;\n}";
|
|
47874
47818
|
styleInject(css_248z$a);
|
|
47875
47819
|
|
|
47876
47820
|
function WalletConnect() {
|
|
@@ -47900,9 +47844,8 @@
|
|
|
47900
47844
|
}
|
|
47901
47845
|
|
|
47902
47846
|
return v$2(BaseComponent, {
|
|
47903
|
-
style: css_248z$a,
|
|
47904
47847
|
className: "x-utu-wallet-connect"
|
|
47905
|
-
}, v$2("section", {
|
|
47848
|
+
}, v$2("style", null, css_248z$a), v$2("section", {
|
|
47906
47849
|
className: "x-utu-wallet-connect-section"
|
|
47907
47850
|
}, v$2("p", {
|
|
47908
47851
|
className: "x-utu-wallet-connect-text"
|
|
@@ -47913,7 +47856,7 @@
|
|
|
47913
47856
|
}, "Connect Wallet"))));
|
|
47914
47857
|
}
|
|
47915
47858
|
|
|
47916
|
-
var css_248z$9 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size:
|
|
47859
|
+
var css_248z$9 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-disconnect-wallet-btn {\n width: 100%;\n align-items: center;\n text-align: center;\n justify-content: center;\n background-color: #fcf8e5;\n border-radius: 5px;\n padding: 0.5rem;\n}\n.x-utu-disconnect-text-input-btn {\n width: 100%;\n background-color: rgb(252, 229, 70);\n}";
|
|
47917
47860
|
styleInject(css_248z$9);
|
|
47918
47861
|
|
|
47919
47862
|
function DisconnectWallet() {
|
|
@@ -47952,9 +47895,7 @@
|
|
|
47952
47895
|
});
|
|
47953
47896
|
}
|
|
47954
47897
|
|
|
47955
|
-
return v$2(BaseComponent, {
|
|
47956
|
-
style: css_248z$9
|
|
47957
|
-
}, v$2("section", {
|
|
47898
|
+
return v$2(BaseComponent, null, v$2("style", null, css_248z$9), v$2("section", {
|
|
47958
47899
|
className: "x-utu-disconnect-wallet-btn"
|
|
47959
47900
|
}, v$2("div", null, v$2("button", {
|
|
47960
47901
|
onClick: disconnectWallet,
|
|
@@ -47963,7 +47904,7 @@
|
|
|
47963
47904
|
}, "Disconnect Wallet"))));
|
|
47964
47905
|
}
|
|
47965
47906
|
|
|
47966
|
-
var css_248z$8 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-feedback-details {\n width: 65%;\n margin: auto;\n}\n\n.x-utu-feedback-details_title {\n text-align: center;\n height: 3rem;\n background-color: #fcf8e5;\n font-weight: bold;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n\n.x-utu-feedback-details_body_1 {\n display: flex;\n background-color: #fcf8e5;\n justify-content: space-between;\n}\n\n.x-utu-feedback-details_body_2 {\n margin-bottom: 2%;\n background-color: #fcf8e5;\n}\n\n.x-utu-feedback-details_divider {\n background-color: rgba(189, 195, 199, 0.3);\n height: 90px;\n width: 3px;\n}\n\n/*\n******************************************************** old css\n*/\n.utu-feedback-details {\n min-height: 30rem;\n width: 100%;\n margin: auto;\n background-color: #fcf8e5;\n display: flex;\n flex-direction: column;\n text-align: center;\n position: relative;\n z-index: 1;\n justify-content: start;\n border-bottom: 15px rgb(252, 229, 70) solid;\n}\n.utu-feedback-details-details {\n justify-content: start;\n max-height: 40rem;\n}\n.utu-feedback-details-video-popup {\n justify-content: center;\n max-height: 80rem;\n height: 43rem;\n}\n\n.mobile-view {\n visibility: visible;\n}\n\n.desktop-view {\n display: none;\n}\n\n/* ----------- Transition screen ----------- */\n@media only screen and (min-width: 768px) {\n .utu-feedback-details {\n width: 65%;\n border-bottom: 0;\n z-index: 1;\n align-items: center;\n margin-bottom: 10rem;\n }\n .mobile-view {\n display: none;\n }\n .desktop-view {\n display: flex;\n width: 100%;\n padding: 0 2rem;\n flex-direction: column;\n margin-bottom: 5rem;\n }\n .desktop-view-video-stars {\n width: 100%;\n display: flex;\n flex-direction: column;\n }\n .desktop-view-block-1 {\n width: 100%;\n margin: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n }\n .desktop-view-block-1-dark {\n background-color: #3d3d3c;\n }\n .desktop-view-block-1-light {\n background-color: #fcf8e5;\n }\n .desktop-view-block-2 {\n width: 100%;\n margin: auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n }\n .desktop-view-block-2-dark {\n background-color: #3d3d3c;\n }\n .desktop-view-block-2-light {\n background-color: #fcf8e5;\n }\n}\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1481px) {\n .utu-feedback-details {\n border-bottom: 0;\n z-index: 1;\n align-items: center;\n width: 65%;\n }\n .mobile-view {\n display: none;\n }\n .desktop-view {\n display: flex;\n width: 100%;\n padding: 0;\n flex-direction: row;\n }\n .desktop-view-video-stars {\n display: flex;\n flex-direction: column;\n }\n .desktop-view-block-1 {\n min-height: 15rem;\n width: 50%;\n margin: auto;\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0 1rem;\n justify-content: start;\n }\n .desktop-view-block-1-dark {\n background-color: #3d3d3c;\n }\n .desktop-view-block-1-light {\n background-color: #fcf8e5;\n }\n .desktop-view-block-2 {\n min-height: 15rem;\n width: 50%;\n margin: 0;\n display: flex;\n flex-direction: column;\n padding: 0 1rem;\n justify-content: start;\n align-items: start;\n }\n .desktop-view-block-2-dark {\n background-color: #3d3d3c;\n }\n .desktop-view-block-2-light {\n background-color: #fcf8e5;\n }\n}";
|
|
47907
|
+
var css_248z$8 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-feedback-details {\n width: 65%;\n margin: auto;\n}\n\n.x-utu-feedback-details_title {\n text-align: center;\n height: 3rem;\n background-color: #fcf8e5;\n font-weight: bold;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n\n.x-utu-feedback-details_body_1 {\n display: flex;\n background-color: #fcf8e5;\n justify-content: space-between;\n}\n\n.x-utu-feedback-details_body_2 {\n margin-bottom: 2%;\n background-color: #fcf8e5;\n}\n\n.x-utu-feedback-details_divider {\n background-color: rgba(189, 195, 199, 0.3);\n height: 160px;\n width: 3px;\n}\n\n@media only screen and (max-width: 1000px) {\n .x-utu-feedback-details_divider {\n display: none;\n }\n .x-utu-feedback-details_body_1 {\n flex-direction: column;\n }\n}";
|
|
47967
47908
|
styleInject(css_248z$8);
|
|
47968
47909
|
|
|
47969
47910
|
var toPropertyKey = toPropertyKey$3;
|
|
@@ -48023,7 +47964,7 @@
|
|
|
48023
47964
|
}
|
|
48024
47965
|
});
|
|
48025
47966
|
|
|
48026
|
-
var css_248z$7 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-feedback-details-endorsements {\n width: 100%;\n padding: 1rem 1.5rem;\n}\n\n.x-utu-feedback-details-endorsements-wrapper {\n width: 100%;\n display: flex;\n margin: 1rem 0;\n justify-content: start;\n white-space: nowrap;\n overflow-x: scroll;\n}\n\n/* width */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar {\n width: 10px;\n height: 8px;\n}\n\n/* Track */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 10px;\n}\n\n/* Handle */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar-thumb {\n background: rgb(252, 229, 70);\n border-radius: 10px;\n}\n\n/* Handle on hover */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n\n.x-utu-feedback-details-endorsements-body {\n display: flex;\n margin-right: 1rem;\n margin-bottom: 1rem;\n border-radius: 10px;\n padding: 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n}\n\n.x-utu-feedback-details-endorsements-body_text {\n margin: 1rem 0.5rem;\n}\n\n/*\n******************************************** old css\n*/\n.endor-text-section {\n width: 50%;\n}\n\n.endor-title {\n display: flex;\n justify-self: center;\n text-align: center;\n}\n.endor-avatar {\n width: 2rem;\n}\n.endor-text {\n justify-content: space-around;\n padding-left: 3rem;\n padding-right: 0;\n font-size: 1rem;\n align-items: center;\n}\n.endor-text-light {\n color: black;\n}\n.endor-text-dark {\n color: white;\n}\n.endor-text-body {\n display: flex;\n}\n.endor-text-section {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 0;\n padding-top: 1rem;\n padding-bottom: 2rem;\n}\n.endor-text-section-no-data {\n display: flex;\n justify-content: flex-start;\n}\n.endor-text-stakes-no-data {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-top: 2rem;\n}\n.endor-text-stakes-item {\n font-size: 1rem;\n}\n.endor-text-stakes-item-light {\n color: black;\n}\n.endor-text-stakes-item-dark {\n color: white;\n}\n.endor-text-stakes-item-2 {\n font-size: 0.8rem;\n}\n.endor-text-stakes-item-2-light {\n color: black;\n}\n.endor-text-stakes-item-2-dark {\n color: white;\n}\n.endor-text-contacts-section {\n padding-left: 1rem;\n padding-right: 0;\n margin-top: 1rem;\n font-size: 0.7rem;\n width: 22rem;\n flex-wrap: wrap;\n text-align: left;\n}\n.endor-text-contacts-section-light {\n color: black;\n}\n.endor-text-contacts-section-dark {\n color: white;\n}\n.endor-text-contacts-body {\n font-size: 0.7rem;\n margin-top: 0.5em;\n}\n.endor-text-truncate {\n display: inline-block;\n max-width: 5rem;\n vertical-align: bottom;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.endor-text-image-item {\n margin-top: 1rem;\n height: 3rem;\n border-radius: 50%;\n}\n.endor-text-image-item-light {\n border: 2px solid rgb(252, 229, 70);\n}\n.endor-text-image-item-dark {\n border: 2px solid rgb(252, 229, 70);\n}\n\n@media only screen and (min-width: 768px) {\n .endor-title {\n display: flex;\n justify-self: center;\n text-align: center;\n }\n .endor-text {\n padding-left: 0;\n }\n .endor-text-section {\n padding-bottom: 1rem;\n margin-top: 0;\n }\n .endor-text-body {\n padding-left: 0rem;\n padding-right: 0rem;\n }\n .endor-text-contacts-body {\n font-size: 1rem;\n }\n .endor-text-stakes-item {\n font-size: 1.5rem;\n }\n .endor-text-stakes-item-2 {\n font-size: 1rem;\n }\n}\n@media only screen and (min-width: 768px) {\n .endor-section {\n margin-top: 4rem;\n }\n}\n@media only screen and (min-width: 1481px) {\n .endor-text-section {\n align-items: flex-start;\n justify-content: flex-start;\n }\n}";
|
|
47967
|
+
var css_248z$7 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.x-utu-feedback-details-endorsements {\n width: 100%;\n padding: 1rem 1.5rem;\n}\n\n.x-utu-feedback-details-endorsements-wrapper {\n width: 100%;\n display: flex;\n margin: 1rem 0;\n justify-content: start;\n white-space: nowrap;\n overflow-x: scroll;\n}\n\n/* width */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar {\n width: 10px;\n height: 8px;\n}\n\n/* Track */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 10px;\n}\n\n/* Handle */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar-thumb {\n background: rgb(252, 229, 70);\n border-radius: 10px;\n}\n\n/* Handle on hover */\n.x-utu-feedback-details-endorsements-wrapper::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n\n.x-utu-feedback-details-endorsements-body {\n display: flex;\n margin-right: 1rem;\n margin-bottom: 1rem;\n border-radius: 10px;\n padding: 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n}\n\n.x-utu-feedback-details-endorsements-body_text {\n margin: 1rem 0.5rem;\n}\n\n/*\n******************************************** old css\n*/\n.endor-text-section {\n width: 50%;\n}\n\n.endor-title {\n display: flex;\n justify-self: center;\n text-align: center;\n}\n.endor-avatar {\n width: 2rem;\n}\n.endor-text {\n justify-content: space-around;\n padding-left: 3rem;\n padding-right: 0;\n font-size: 1rem;\n align-items: center;\n}\n.endor-text-light {\n color: black;\n}\n.endor-text-dark {\n color: white;\n}\n.endor-text-body {\n display: flex;\n}\n.endor-text-section {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-top: 0;\n padding-top: 1rem;\n padding-bottom: 2rem;\n}\n.endor-text-section-no-data {\n display: flex;\n justify-content: flex-start;\n}\n.endor-text-stakes-no-data {\n display: flex;\n flex-direction: row;\n align-items: center;\n margin-top: 2rem;\n}\n.endor-text-stakes-item {\n font-size: 1rem;\n}\n.endor-text-stakes-item-light {\n color: black;\n}\n.endor-text-stakes-item-dark {\n color: white;\n}\n.endor-text-stakes-item-2 {\n font-size: 0.8rem;\n}\n.endor-text-stakes-item-2-light {\n color: black;\n}\n.endor-text-stakes-item-2-dark {\n color: white;\n}\n.endor-text-contacts-section {\n padding-left: 1rem;\n padding-right: 0;\n margin-top: 1rem;\n font-size: 0.7rem;\n width: 22rem;\n flex-wrap: wrap;\n text-align: left;\n}\n.endor-text-contacts-section-light {\n color: black;\n}\n.endor-text-contacts-section-dark {\n color: white;\n}\n.endor-text-contacts-body {\n font-size: 0.7rem;\n margin-top: 0.5em;\n}\n.endor-text-truncate {\n display: inline-block;\n max-width: 5rem;\n vertical-align: bottom;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.endor-text-image-item {\n margin-top: 1rem;\n height: 3rem;\n border-radius: 50%;\n}\n.endor-text-image-item-light {\n border: 2px solid rgb(252, 229, 70);\n}\n.endor-text-image-item-dark {\n border: 2px solid rgb(252, 229, 70);\n}\n\n@media only screen and (min-width: 768px) {\n .endor-title {\n display: flex;\n justify-self: center;\n text-align: center;\n }\n .endor-text {\n padding-left: 0;\n }\n .endor-text-section {\n padding-bottom: 1rem;\n margin-top: 0;\n }\n .endor-text-body {\n padding-left: 0rem;\n padding-right: 0rem;\n }\n .endor-text-contacts-body {\n font-size: 1rem;\n }\n .endor-text-stakes-item {\n font-size: 1.5rem;\n }\n .endor-text-stakes-item-2 {\n font-size: 1rem;\n }\n}\n@media only screen and (min-width: 768px) {\n .endor-section {\n margin-top: 4rem;\n }\n}\n@media only screen and (min-width: 1481px) {\n .endor-text-section {\n align-items: flex-start;\n justify-content: flex-start;\n }\n}";
|
|
48027
47968
|
styleInject(css_248z$7);
|
|
48028
47969
|
|
|
48029
47970
|
var css_248z$6 = "";
|
|
@@ -48051,16 +47992,16 @@
|
|
|
48051
47992
|
return v$2("div", {
|
|
48052
47993
|
className: "placeholder-card_wrapper"
|
|
48053
47994
|
}, v$2("div", {
|
|
48054
|
-
className: "
|
|
47995
|
+
className: "x-utu-description"
|
|
48055
47996
|
}, v$2("div", {
|
|
48056
|
-
className: "
|
|
48057
|
-
}
|
|
48058
|
-
className: "
|
|
47997
|
+
className: "x-utu-icon x-utu-skeleton"
|
|
47998
|
+
}), v$2("div", {
|
|
47999
|
+
className: "x-utu-details"
|
|
48059
48000
|
}, v$2("div", {
|
|
48060
|
-
className: "
|
|
48061
|
-
}
|
|
48062
|
-
className: "
|
|
48063
|
-
}
|
|
48001
|
+
className: "x-utu-title x-utu-skeleton"
|
|
48002
|
+
}), v$2("div", {
|
|
48003
|
+
className: "x-utu-information x-utu-skeleton"
|
|
48004
|
+
}))));
|
|
48064
48005
|
case SubmitStatus.success:
|
|
48065
48006
|
return children;
|
|
48066
48007
|
default:
|
|
@@ -48157,11 +48098,10 @@
|
|
|
48157
48098
|
return v$2(FeedbackDetailsShimmerAnimation, {
|
|
48158
48099
|
submitStatus: props.submitStatus
|
|
48159
48100
|
}, v$2(BaseComponent, {
|
|
48160
|
-
style: css_248z$7,
|
|
48161
48101
|
className: "x-utu-feedback-details-endorsements",
|
|
48162
48102
|
excludeBootstrap: true,
|
|
48163
48103
|
excludeFonts: true
|
|
48164
|
-
}, v$2("
|
|
48104
|
+
}, v$2("style", null, css_248z$7), v$2("p", null, v$2("b", null, " endorsements from people in your network ")), v$2("section", {
|
|
48165
48105
|
className: "x-utu-feedback-details-endorsements-wrapper"
|
|
48166
48106
|
}, !endorsements || false ? v$2("div", {
|
|
48167
48107
|
className: "placeholder-card"
|
|
@@ -48199,9 +48139,7 @@
|
|
|
48199
48139
|
summaryText = _e.summaryText;
|
|
48200
48140
|
return v$2(FeedbackDetailsShimmerAnimation, {
|
|
48201
48141
|
submitStatus: props.submitStatus
|
|
48202
|
-
}, v$2(BaseComponent, {
|
|
48203
|
-
style: css_248z$5
|
|
48204
|
-
}, !((_c = props.feedbackSummary) === null || _c === void 0 ? void 0 : _c.stars) || false ? v$2("div", {
|
|
48142
|
+
}, v$2(BaseComponent, null, v$2("style", null, css_248z$5), !((_c = props.feedbackSummary) === null || _c === void 0 ? void 0 : _c.stars) || false ? v$2("div", {
|
|
48205
48143
|
className: "placeholder-card"
|
|
48206
48144
|
}, v$2("div", {
|
|
48207
48145
|
className: "placeholder-icon"
|
|
@@ -48213,7 +48151,7 @@
|
|
|
48213
48151
|
className: "placeholder-text-body"
|
|
48214
48152
|
}, "When people in your network leave star ratings for this entity they will appear here."))) : v$2("section", {
|
|
48215
48153
|
className: "stars-section"
|
|
48216
|
-
}, v$2("p", null, v$2("b", null, "
|
|
48154
|
+
}, v$2("p", null, v$2("b", null, "star ratings from people in your network")), v$2("div", {
|
|
48217
48155
|
className: "stars-section-align"
|
|
48218
48156
|
}, v$2(_default, {
|
|
48219
48157
|
count: 5,
|
|
@@ -57730,7 +57668,7 @@
|
|
|
57730
57668
|
root._=_;}}).call(commonjsGlobal);
|
|
57731
57669
|
} (lodash, lodashExports));
|
|
57732
57670
|
|
|
57733
|
-
var css_248z$4 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.placeholder-avatar {\n width: 4rem;\n}\n\n.review-card-no-data {\n display: flex;\n overflow-x: scroll;\n}\n\n.badge-spacing {\n display: flex;\n flex-direction: column;\n padding: 1rem 0.5rem 0 1rem;\n background-color: rgba(255, 221, 51, 0.1);\n border-radius: 10px;\n margin: 0.5rem 0;\n}\n.badge-spacing-no-data {\n display: flex;\n flex-direction: row;\n}\n.badge-section {\n display: flex;\n justify-content: start;\n padding: 2rem 1rem;\n width: 100%;\n flex-direction: column;\n}\n.badge-section-title {\n text-transform: none;\n}\n.badge-section-content {\n display: flex;\n flex-direction: column;\n justify-content: start;\n padding-right: 0;\n padding-top: 1rem;\n}\n.badge-section-badges {\n display: flex;\n justify-content: center;\n white-space: nowrap;\n overflow-x: scroll;\n /* width */\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.badge-section-badges::-webkit-scrollbar {\n width: 10px;\n height: 8px;\n}\n.badge-section-badges::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 10px;\n}\n.badge-section-badges::-webkit-scrollbar-thumb {\n background: rgb(252, 229, 70);\n border-radius: 10px;\n}\n.badge-section-badges::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n.badge-section-text {\n display: flex;\n justify-content: center;\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.badge-section-text-content {\n text-align: justify;\n max-width: 100%;\n}\n.badge-container {\n position: relative;\n margin-right: 1rem;\n box-sizing: border-box;\n display: flex;\n}\n.badge-container-no-data {\n position: relative;\n width: 5rem;\n box-sizing: border-box;\n}\n.badge-container-no-data-container {\n position: relative;\n box-sizing: border-box;\n display: flex;\n padding-bottom: 2rem;\n justify-content: start;\n flex-wrap: wrap;\n}\n.badge-container-thumb {\n border-radius: 50%;\n border: 1px rgb(235, 232, 232) solid;\n height: 1.5rem;\n width: 1.5rem;\n font-size: 0.6rem;\n justify-self: center;\n}\n.badge-container-thumb-light {\n background-color: rgb(253, 253, 253);\n color: #000000;\n}\n.badge-container-thumb-dark {\n background-color: rgb(36, 35, 35);\n color: #ffffff;\n}\n.badge-container-img {\n height: 4rem;\n width: 4rem;\n margin-bottom: 4rem;\n}\n.badge-container-img-no-data {\n opacity: 0.5;\n}\n.badge-container-profile {\n border-radius: 50%;\n border: 1px rgb(235, 232, 232) solid;\n height: 1.5rem;\n width: 1.5rem;\n font-size: 0.6rem;\n justify-self: center;\n margin-left: -0.5rem;\n}\n.badge-container-profile-light {\n background-color: rgb(253, 253, 253);\n color: #000000;\n}\n.badge-container-profile-dark {\n background-color: rgb(36, 35, 35);\n color: #ffffff;\n}\n.badge-container-profile-container {\n display: flex;\n justify-content: center;\n position: absolute;\n bottom: 5.5rem;\n right: 3.5rem;\n}\n.badge-container-title {\n padding-bottom: 0.5rem;\n font-size: 0.7rem;\n position: absolute;\n top: 5.5rem;\n left: 0.5rem;\n}\n.badge-container-title-dark {\n color: #ffffff;\n}\n.badge-container-title-light {\n color: #000000;\n}\n.badge-container-position-child-thumb {\n position: absolute;\n top: 1.3rem;\n right: -1rem;\n}\n.badge-container-position-child-profile {\n position: relative;\n top: 2.5rem;\n right: -3.3rem;\n}\n\n/* ----------- Transition screens ----------- */\n@media only screen and (min-width: 768px) {\n .badge-section {\n width: 100%;\n }\n .badge-section-badges {\n justify-content: space-evenly;\n }\n}\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1481px) {\n .badge-container-no-data-container {\n flex-wrap: unset;\n }\n .badge-section {\n width: 100%;\n }\n .badge-section-content {\n padding-top: 0;\n }\n .badge-section-badges {\n justify-content: start;\n }\n .badge-section-text {\n justify-content: center;\n }\n .badge-badges {\n justify-content: start;\n }\n .badge-spacing {\n padding: 1rem 1.5rem 0.5rem 2rem;\n margin-right: 1rem;\n }\n}";
|
|
57671
|
+
var css_248z$4 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.placeholder-avatar {\n width: 4rem;\n}\n\n.review-card-no-data {\n display: flex;\n overflow-x: scroll;\n}\n\n.badge-spacing {\n display: flex;\n flex-direction: column;\n padding: 1rem 0.5rem 0 1rem;\n background-color: rgba(255, 221, 51, 0.1);\n border-radius: 10px;\n margin: 0.5rem 0;\n}\n.badge-spacing-no-data {\n display: flex;\n flex-direction: row;\n}\n.badge-section {\n display: flex;\n justify-content: start;\n padding: 2rem 1rem;\n width: 100%;\n flex-direction: column;\n}\n.badge-section-title {\n text-transform: none;\n}\n.badge-section-content {\n display: flex;\n flex-direction: column;\n justify-content: start;\n padding-right: 0;\n padding-top: 1rem;\n}\n.badge-section-badges {\n display: flex;\n justify-content: center;\n white-space: nowrap;\n overflow-x: scroll;\n /* width */\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.badge-section-badges::-webkit-scrollbar {\n width: 10px;\n height: 8px;\n}\n.badge-section-badges::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 10px;\n}\n.badge-section-badges::-webkit-scrollbar-thumb {\n background: rgb(252, 229, 70);\n border-radius: 10px;\n}\n.badge-section-badges::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n.badge-section-text {\n display: flex;\n justify-content: center;\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.badge-section-text-content {\n text-align: justify;\n max-width: 100%;\n}\n.badge-container {\n position: relative;\n margin-right: 1rem;\n box-sizing: border-box;\n display: flex;\n}\n.badge-container-no-data {\n position: relative;\n width: 5rem;\n box-sizing: border-box;\n}\n.badge-container-no-data-container {\n position: relative;\n box-sizing: border-box;\n display: flex;\n padding-bottom: 2rem;\n justify-content: start;\n flex-wrap: wrap;\n}\n.badge-container-thumb {\n border-radius: 50%;\n border: 1px rgb(235, 232, 232) solid;\n height: 1.5rem;\n width: 1.5rem;\n font-size: 0.6rem;\n justify-self: center;\n}\n.badge-container-thumb-light {\n background-color: rgb(253, 253, 253);\n color: #000000;\n}\n.badge-container-thumb-dark {\n background-color: rgb(36, 35, 35);\n color: #ffffff;\n}\n.badge-container-img {\n height: 4rem;\n width: 4rem;\n margin-bottom: 4rem;\n}\n.badge-container-img-no-data {\n opacity: 0.5;\n}\n.badge-container-profile {\n border-radius: 50%;\n border: 1px rgb(235, 232, 232) solid;\n height: 1.5rem;\n width: 1.5rem;\n font-size: 0.6rem;\n justify-self: center;\n margin-left: -0.5rem;\n}\n.badge-container-profile-light {\n background-color: rgb(253, 253, 253);\n color: #000000;\n}\n.badge-container-profile-dark {\n background-color: rgb(36, 35, 35);\n color: #ffffff;\n}\n.badge-container-profile-container {\n display: flex;\n justify-content: center;\n position: absolute;\n bottom: 5.5rem;\n right: 3.5rem;\n}\n.badge-container-title {\n padding-bottom: 0.5rem;\n font-size: 0.7rem;\n position: absolute;\n top: 5.5rem;\n left: 0.5rem;\n}\n.badge-container-title-dark {\n color: #ffffff;\n}\n.badge-container-title-light {\n color: #000000;\n}\n.badge-container-position-child-thumb {\n position: absolute;\n top: 1.3rem;\n right: -1rem;\n}\n.badge-container-position-child-profile {\n position: relative;\n top: 2.5rem;\n right: -3.3rem;\n}\n\n/* ----------- Transition screens ----------- */\n@media only screen and (min-width: 768px) {\n .badge-section {\n width: 100%;\n }\n .badge-section-badges {\n justify-content: space-evenly;\n }\n}\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1481px) {\n .badge-container-no-data-container {\n flex-wrap: unset;\n }\n .badge-section {\n width: 100%;\n }\n .badge-section-content {\n padding-top: 0;\n }\n .badge-section-badges {\n justify-content: start;\n }\n .badge-section-text {\n justify-content: center;\n }\n .badge-badges {\n justify-content: start;\n }\n .badge-spacing {\n padding: 1rem 1.5rem 0.5rem 2rem;\n margin-right: 1rem;\n }\n}";
|
|
57734
57672
|
styleInject(css_248z$4);
|
|
57735
57673
|
|
|
57736
57674
|
function BadgesShow$1(props) {
|
|
@@ -57815,11 +57753,10 @@
|
|
|
57815
57753
|
return v$2(FeedbackDetailsShimmerAnimation, {
|
|
57816
57754
|
submitStatus: props.submitStatus
|
|
57817
57755
|
}, v$2(BaseComponent, {
|
|
57818
|
-
style: css_248z$4,
|
|
57819
57756
|
className: "badge-section",
|
|
57820
57757
|
excludeBootstrap: true,
|
|
57821
57758
|
excludeFonts: true
|
|
57822
|
-
}, v$2("p", null, v$2("b", null, " Badges from people in your network
|
|
57759
|
+
}, v$2("style", null, css_248z$4), v$2("p", null, v$2("b", null, " Badges from people in your network")), (fbBadges === null || fbBadges === void 0 ? void 0 : fbBadges.assignments) === undefined || Object.keys(fbBadges === null || fbBadges === void 0 ? void 0 : fbBadges.assignments).length === 0 ? v$2("section", {
|
|
57823
57760
|
className: "badge-section-content x-utu-section x-utu-section-" + envCondition
|
|
57824
57761
|
}, v$2("div", {
|
|
57825
57762
|
className: "badge-section-badges-no-data"
|
|
@@ -57866,7 +57803,7 @@
|
|
|
57866
57803
|
}))));
|
|
57867
57804
|
}
|
|
57868
57805
|
|
|
57869
|
-
var css_248z$2 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.utu-feedback {\n position: relative;\n width: 30%;\n margin: auto;\n}\n\n.video-section {\n display: flex;\n background-color: rgba(255, 221, 51, 0.1);\n margin-left: 2rem;\n border-radius: 10px;\n padding: 1rem 1rem 0 1rem;\n height: 10rem;\n list-style-type: none;\n}\n\n.no-data-avatar {\n display: flex;\n min-width: 4rem;\n height: 4rem;\n border-radius: 50%;\n border: 2px solid rgb(155, 152, 152);\n align-items: center;\n justify-content: center;\n margin-left: -0.5rem;\n}\n\n.no-data-avatar > * {\n width: 2.5rem;\n height: 2.5rem;\n padding: 0.35rem;\n}\n\n.avatar {\n cursor: pointer;\n display: flex;\n justify-content: center;\n}\n.avatar-img {\n border-radius: 50%;\n height: 2rem;\n border: 1px rgb(155, 152, 152) solid;\n}\n.avatar-img-top {\n height: 4rem;\n border-radius: 50%;\n border: 4px solid rgb(252, 229, 70);\n}\n.avatar-img-top:not(:first-child) {\n margin-left: -15px;\n}\n.avatar-img-top-video {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.avatar-img-top-video-profile {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.avatar-img-top-video-text {\n margin-top: 1rem;\n}\n.avatar-img-top-video-container {\n display: flex;\n align-items: flex-start;\n padding-top: 0;\n padding-bottom: 1rem;\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n flex-direction: column;\n}\n.avatar-img-top-details {\n display: flex;\n height: 4rem;\n border-radius: 50%;\n border: 4px solid rgb(252, 229, 70);\n margin-left: -0.6rem;\n align-items: center;\n padding-bottom: 0;\n}\n.avatar-img-top-details:not(:first-child) {\n margin-left: -15px;\n}\n.avatar-img-top-list-item {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n}\n.avatar-img-top-text {\n font-size: 0.8rem;\n text-align: left;\n width: 19rem;\n}\n.avatar-img-no-img {\n width: 6rem;\n border-radius: 50%;\n padding: 1.5rem;\n}\n.avatar-img-no-img-no-vid {\n padding: 5px !important;\n}\n.avatar-img-no-img-light {\n background-color: rgb(252, 229, 70);\n border: 4px solid rgb(252, 229, 70);\n}\n.avatar-img-no-img-dark {\n background-color: rgb(252, 229, 70);\n border: 4px solid rgb(252, 229, 70);\n}\n.avatar-img-no-video-dark {\n fill: #000000;\n}\n.avatar-img-no-video-light {\n fill: #000000;\n}\n\n.x-utu-profile-video-placeholder {\n display: flex;\n}\n\n/* ----------- Transition screens ----------- */\n@media only screen and (min-width: 768px) {\n .utu-feedback {\n width: 25%;\n }\n .avatar-img-top-video {\n justify-content: center;\n }\n .avatar-img-top-video-profile {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n .avatar-img-top-video-container {\n width: 100%;\n flex-direction: column;\n align-items: center;\n }\n}\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1481px) {\n .utu-feedback {\n width: 20%;\n }\n .avatar {\n justify-content: start;\n }\n .avatar-img-top-video {\n padding-left: 0;\n align-items: start;\n justify-content: start;\n }\n .avatar-img-top-video-profile {\n display: flex;\n align-items: start;\n justify-content: start;\n width: 100%;\n }\n .avatar-img-top-video-container {\n flex-direction: column;\n }\n .avatar-img-top-video-text {\n text-align: start;\n }\n .avatar-no-img {\n margin-bottom: 1rem;\n margin-top: 0.5rem;\n }\n}";
|
|
57806
|
+
var css_248z$2 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.utu-feedback {\n position: relative;\n width: 30%;\n margin: auto;\n}\n\n.video-section {\n display: flex;\n background-color: rgba(255, 221, 51, 0.1);\n margin-left: 2rem;\n border-radius: 10px;\n padding: 1rem 1rem 0 1rem;\n height: 10rem;\n list-style-type: none;\n}\n\n.no-data-avatar {\n display: flex;\n min-width: 4rem;\n height: 4rem;\n border-radius: 50%;\n border: 2px solid rgb(155, 152, 152);\n align-items: center;\n justify-content: center;\n margin-left: -0.5rem;\n}\n\n.no-data-avatar > * {\n width: 2.5rem;\n height: 2.5rem;\n padding: 0.35rem;\n}\n\n.avatar {\n cursor: pointer;\n display: flex;\n justify-content: center;\n}\n.avatar-img {\n border-radius: 50%;\n height: 2rem;\n border: 1px rgb(155, 152, 152) solid;\n}\n.avatar-img-top {\n height: 4rem;\n border-radius: 50%;\n border: 4px solid rgb(252, 229, 70);\n}\n.avatar-img-top:not(:first-child) {\n margin-left: -15px;\n}\n.avatar-img-top-video {\n width: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.avatar-img-top-video-profile {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.avatar-img-top-video-text {\n margin-top: 1rem;\n}\n.avatar-img-top-video-container {\n display: flex;\n align-items: flex-start;\n padding-top: 0;\n padding-bottom: 1rem;\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n flex-direction: column;\n}\n.avatar-img-top-details {\n display: flex;\n height: 4rem;\n border-radius: 50%;\n border: 4px solid rgb(252, 229, 70);\n margin-left: -0.6rem;\n align-items: center;\n padding-bottom: 0;\n}\n.avatar-img-top-details:not(:first-child) {\n margin-left: -15px;\n}\n.avatar-img-top-list-item {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n}\n.avatar-img-top-text {\n font-size: 0.8rem;\n text-align: left;\n width: 19rem;\n}\n.avatar-img-no-img {\n width: 6rem;\n border-radius: 50%;\n padding: 1.5rem;\n}\n.avatar-img-no-img-no-vid {\n padding: 5px !important;\n}\n.avatar-img-no-img-light {\n background-color: rgb(252, 229, 70);\n border: 4px solid rgb(252, 229, 70);\n}\n.avatar-img-no-img-dark {\n background-color: rgb(252, 229, 70);\n border: 4px solid rgb(252, 229, 70);\n}\n.avatar-img-no-video-dark {\n fill: #000000;\n}\n.avatar-img-no-video-light {\n fill: #000000;\n}\n\n.x-utu-profile-video-placeholder {\n display: flex;\n}\n\n/* ----------- Transition screens ----------- */\n@media only screen and (min-width: 768px) {\n .utu-feedback {\n width: 25%;\n }\n .avatar-img-top-video {\n justify-content: center;\n }\n .avatar-img-top-video-profile {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n .avatar-img-top-video-container {\n width: 100%;\n flex-direction: column;\n align-items: center;\n }\n}\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1481px) {\n .utu-feedback {\n width: 20%;\n }\n .avatar {\n justify-content: start;\n }\n .avatar-img-top-video {\n padding-left: 0;\n align-items: start;\n justify-content: start;\n }\n .avatar-img-top-video-profile {\n display: flex;\n align-items: start;\n justify-content: start;\n width: 100%;\n }\n .avatar-img-top-video-container {\n flex-direction: column;\n }\n .avatar-img-top-video-text {\n text-align: start;\n }\n .avatar-no-img {\n margin-bottom: 1rem;\n margin-top: 0.5rem;\n }\n}";
|
|
57870
57807
|
styleInject(css_248z$2);
|
|
57871
57808
|
|
|
57872
57809
|
// component for everything inclusing profile images, video or undefined
|
|
@@ -57957,7 +57894,7 @@
|
|
|
57957
57894
|
className: "video-section"
|
|
57958
57895
|
}, v$2("section", {
|
|
57959
57896
|
className: "avatar-img-top-video"
|
|
57960
|
-
}, v$2("p", null, " ", v$2("b", null, "
|
|
57897
|
+
}, v$2("p", null, " ", v$2("b", null, "video from people in your network ")), v$2("div", {
|
|
57961
57898
|
className: "avatar-img-top-video-container"
|
|
57962
57899
|
}, v$2("div", null, v$2("div", {
|
|
57963
57900
|
className: "avatar-img-top-video-profile"
|
|
@@ -57978,7 +57915,7 @@
|
|
|
57978
57915
|
}, profileText || "no video reviews available", " "))))))));
|
|
57979
57916
|
}
|
|
57980
57917
|
|
|
57981
|
-
var css_248z$1 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size:
|
|
57918
|
+
var css_248z$1 = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-avatar {\n width: 3rem;\n}\n\n.video-placeholder {\n height: 2rem;\n}\n\n.review-section {\n width: 100%;\n margin-bottom: 0.5rem;\n white-space: nowrap;\n}\n.review-section-no-data {\n justify-content: center;\n}\n.review-text {\n display: flex;\n flex-direction: column;\n}\n.review-text-sum {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n.review-text-cont {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n.review-text-dark {\n color: #ffffff;\n}\n.review-text-light {\n color: #000000;\n}\n.review-card {\n font-size: 0.7rem;\n display: flex;\n margin-right: 1rem;\n justify-content: space-around;\n}\n.review-card-group {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n align-items: center;\n min-height: 10rem;\n border-radius: 10px;\n}\n.review-card-section {\n display: flex;\n overflow-x: scroll;\n padding: 1rem 0;\n /* width */\n /* Track */\n /* Handle */\n /* Handle on hover */\n}\n.review-card-section::-webkit-scrollbar {\n width: 10px;\n height: 8px;\n}\n.review-card-section::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 10px;\n}\n.review-card-section::-webkit-scrollbar-thumb {\n background: rgb(252, 229, 70);\n border-radius: 10px;\n}\n.review-card-section::-webkit-scrollbar-thumb:hover {\n background: #555;\n}\n.review-img {\n border-radius: 50%;\n height: 3rem;\n border: 1px rgb(155, 152, 152) solid;\n}\n\n.onerror-review-img {\n border-radius: 50%;\n height: 3rem;\n border: 1px rgb(155, 152, 152) solid;\n}\n\n/* ----------- Transition screen ----------- */\n@media only screen and (min-width: 768px) {\n .review-section {\n width: 100%;\n }\n}\n@media only screen and (min-width: 1481px) {\n .review-section {\n width: 100%;\n padding: 2rem 1rem;\n white-space: nowrap;\n }\n .review-text-cont {\n inline-size: 100%;\n }\n .review-text-dark {\n color: rgb(36, 35, 35);\n }\n .review-text-light {\n color: #000000;\n }\n .review-card {\n padding-top: 0;\n padding-bottom: 0;\n display: flex;\n justify-content: center;\n max-width: 100%;\n word-wrap: break-word !important;\n }\n}";
|
|
57982
57919
|
styleInject(css_248z$1);
|
|
57983
57920
|
|
|
57984
57921
|
function BadgesShow(props) {
|
|
@@ -57996,11 +57933,10 @@
|
|
|
57996
57933
|
return v$2(FeedbackDetailsShimmerAnimation, {
|
|
57997
57934
|
submitStatus: props.submitStatus
|
|
57998
57935
|
}, v$2(BaseComponent, {
|
|
57999
|
-
style: css_248z$1,
|
|
58000
57936
|
className: "review-section",
|
|
58001
57937
|
excludeBootstrap: true,
|
|
58002
57938
|
excludeFonts: true
|
|
58003
|
-
}, v$2("p", null, v$2("b", null, "
|
|
57939
|
+
}, v$2("style", null, css_248z$1), v$2("p", null, v$2("b", null, " text from people in your network")), !textReview || false || textReview.length <= 0 ? v$2("div", {
|
|
58004
57940
|
className: "placeholder-card"
|
|
58005
57941
|
}, v$2("div", {
|
|
58006
57942
|
className: "placeholder-icon"
|
|
@@ -58063,13 +57999,11 @@
|
|
|
58063
57999
|
var _a = useFeedbackSummaryApi(apiUrl, sourceUuid, targetUuid),
|
|
58064
58000
|
feedbackSummary = _a.feedbackSummary,
|
|
58065
58001
|
submitStatus = _a.submitStatus;
|
|
58066
|
-
return v$2(BaseComponent, {
|
|
58067
|
-
style: css_248z$8
|
|
58068
|
-
}, v$2("div", {
|
|
58002
|
+
return v$2(BaseComponent, null, v$2("style", null, css_248z$8), v$2("div", {
|
|
58069
58003
|
className: "x-utu-feedback-details"
|
|
58070
58004
|
}, v$2("div", {
|
|
58071
58005
|
className: "x-utu-feedback-details_title"
|
|
58072
|
-
}, v$2("p", null, "
|
|
58006
|
+
}, v$2("p", null, "Show Feedback For ( ", targetHumanReadableToDisplay, " )", targetType ? v$2("p", null, " Signal Type: ", targetType, " ") : "")), v$2("div", {
|
|
58073
58007
|
className: "x-utu-feedback-details_body_1"
|
|
58074
58008
|
}, v$2(VideoShow, __assign({}, props, {
|
|
58075
58009
|
feedbackSummary: feedbackSummary,
|
|
@@ -58094,26 +58028,19 @@
|
|
|
58094
58028
|
})))));
|
|
58095
58029
|
}
|
|
58096
58030
|
|
|
58097
|
-
var css_248z = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 12px;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\n.x-utu-feedback-details-popup {\n padding: 0.5rem;\n border-radius: 10px;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n justify-content: center;\n}\n\n.utu-feedback {\n position: relative;\n width: 100%;\n margin: auto;\n}\n\n/* ----------- Transition screens ----------- */\n@media only screen and (min-width: 768px) {\n .utu-feedback {\n width: 65%;\n }\n}\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1481px) {\n .utu-feedback {\n width: 65%;\n }\n}";
|
|
58031
|
+
var css_248z = "p {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-error, .submit-success {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\np {\n margin-bottom: 0;\n}\n\n.x-utu-h3 {\n text-transform: capitalize;\n font-weight: 500;\n font-size: 0.9rem;\n}\n\n.x-utu-h3-balance {\n text-transform: capitalize;\n font-weight: bold;\n font-size: 0.9rem;\n}\n\n.x-utu-error {\n color: #e80054;\n}\n\n:host {\n margin: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-size: 14px;\n font-weight: 300;\n line-height: 1.5;\n color: #000000;\n -webkit-text-size-adjust: 100%;\n -webkit-tap-highlight-color: #000000;\n}\n\n@keyframes spin {\n 0% {\n transform: rotate(0);\n }\n 50% {\n transform: rotate(180deg);\n border-top-color: rgb(252, 229, 70);\n border-bottom-color: rgb(155, 152, 152);\n border-right-color: transparent;\n border-left-color: transparent;\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n.x-utu-spinner {\n margin: 5px;\n display: inline-block;\n border: 3px solid rgb(252, 229, 70);\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-radius: 50%;\n animation: spin 1s infinite;\n}\n\n.x-utu-spinner-default-size {\n width: 21px;\n height: 21px;\n}\n\n.x-utu-section {\n width: 100%;\n}\n.x-utu-section-light {\n border-bottom: 1px solid rgb(155, 152, 152);\n background: rgb(253, 253, 253);\n}\n.x-utu-section-dark {\n border-bottom: 1px solid rgb(235, 232, 232);\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-dark {\n background: rgb(36, 35, 35);\n}\n.x-utu-section-no-border-mid-light {\n background: rgb(253, 253, 253);\n}\n.x-utu-section-no-border-mid-dark {\n background: #494949;\n}\n\n.x-utu-btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n}\n.x-utu-btn-light {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-dark {\n background-color: rgb(252, 229, 70);\n color: #000000 !important;\n}\n.x-utu-btn-round {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-round-text {\n color: rgb(253, 253, 253) !important;\n}\n.x-utu-btn-icon {\n border: none;\n background: none;\n padding: 0;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n font-weight: 500;\n font-size: 14px;\n}\n\nbutton.p {\n color: white;\n}\n\n.submit-result, .submit-success, .submit-error {\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-content: center;\n text-align: center;\n}\n.logo-position-form {\n position: absolute;\n bottom: 0.3rem;\n right: 22%;\n z-index: 0;\n}\n.logo-position-details {\n position: absolute;\n top: 1rem;\n left: 0;\n z-index: 0;\n width: 0.5rem;\n}\n.logo-position-player {\n position: absolute;\n bottom: -0.5rem;\n left: 22rem;\n z-index: 0;\n display: none;\n width: 0.5rem;\n}\n.logo-position-mobile {\n position: absolute;\n top: -1.5rem;\n right: 4rem;\n z-index: 2;\n width: 0.5rem;\n}\n.logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 3%;\n}\n.logo-section {\n position: relative;\n}\n.logo-section-mobile {\n position: relative;\n}\n.logo-size {\n width: 5rem;\n}\n.logo-video-section {\n position: relative;\n}\n.logo-video-position {\n position: absolute;\n z-index: 0;\n display: none;\n width: 5rem;\n left: 21rem;\n top: 35.6rem;\n}\n\n.x-utu-text-area {\n resize: vertical;\n min-height: 8rem;\n border-radius: 10px;\n border: none;\n padding: 16px;\n font-weight: 300;\n font-size: 0.9rem;\n background-color: rgba(255, 221, 51, 0.1);\n}\n\n.x-utu-video-icon {\n width: 2rem;\n height: 1.4rem;\n}\n.x-utu-video-icon-dark {\n fill: #000000;\n}\n.x-utu-video-icon-light {\n fill: #000000;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 768px) {\n .x-utu-section {\n width: 100%;\n }\n .x-utu-section-light {\n border-bottom: 0;\n background-color: #fcf8e5;\n }\n .x-utu-section-dark {\n border-bottom: 0;\n background: rgb(36, 35, 35);\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-dark {\n background-color: #3d3d3c;\n }\n .x-utu-section-no-border-mid-light {\n background-color: #fcf8e5;\n }\n .x-utu-section-no-border-mid-dark {\n background-color: #3d3d3c;\n }\n .x-utu-text-area {\n background-color: rgba(255, 221, 51, 0.1);\n }\n .logo-section {\n position: relative;\n }\n .logo-section-mobile .logo-position-video {\n position: absolute;\n left: 5%;\n bottom: 5%;\n }\n .logo-section-mobile .logo-section {\n position: relative;\n }\n}\n.x-utu-border-radius {\n border-radius: 5px;\n}\n\n/*\nshimmer effect animation\n*/\n.x-utu-skeleton {\n background-color: #e2e5e7;\n background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));\n background-size: 40px 100%;\n background-repeat: no-repeat;\n background-position: left -40px top 0;\n animation: shine 1s ease infinite;\n}\n\n@keyframes shine {\n to {\n background-position: right -40px top 0;\n }\n}\n.x-utu-description {\n background-color: #fcf8e5;\n padding: 5px;\n margin-bottom: 10px;\n width: 100%;\n display: flex;\n flex-direction: row;\n flex-basis: content;\n}\n\n.x-utu-details {\n width: 70%;\n display: flex;\n flex-direction: column;\n margin: 5px 5px;\n}\n\n.x-utu-icon {\n width: 20%;\n min-height: 70px;\n border-radius: 4px;\n margin: auto;\n}\n\n.x-utu-title {\n width: 100%;\n min-height: 28px;\n border-radius: 4px;\n margin-bottom: 5px;\n line-height: 28px;\n}\n\n.x-utu-information {\n min-height: 42px;\n border-radius: 4px;\n width: 100%;\n}\n\n.placeholder-card_wrapper {\n margin-bottom: 0.5rem;\n}\n\n.placeholder-card {\n width: 100%;\n display: flex;\n padding: 2rem 2.5rem 2rem 1.5rem;\n background-color: rgba(255, 221, 51, 0.15);\n min-height: 10rem;\n border-radius: 10px;\n}\n\n.placeholder-icon {\n width: 3rem;\n}\n\n.placeholder-text-title {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 0.9rem;\n align-items: center;\n margin: 0 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n font-style: italic;\n font-weight: 500;\n}\n\n.placeholder-text-body {\n display: flex;\n text-align: left;\n padding-left: 1rem;\n font-size: 1rem;\n align-items: center;\n margin: 0.5rem 8px;\n white-space: pre-line;\n width: 50px;\n inline-size: 100%;\n}\n\n.target-human-readable {\n padding: 0.5rem;\n text-align: left;\n font-size: 17px;\n text-align: left;\n color: black;\n font-family: sans-serif;\n font-weight: bold;\n}\n\n.video-msg {\n position: absolute;\n}\n\n.trust-video {\n border: none;\n position: absolute;\n object-fit: cover;\n width: 100%;\n height: 100%;\n transform: rotateY(180deg);\n -webkit-transform: rotateY(180deg); /* Safari and Chrome */\n -moz-transform: rotateY(180deg); /* Firefox */\n}\n.trust-video-container {\n width: 25rem;\n height: 40rem;\n position: relative;\n}\n.trust-video-btn {\n padding: 0 !important;\n border: none !important;\n background: none !important;\n}\n.trust-video-wrapper {\n width: 65%;\n margin: auto;\n display: flex;\n justify-content: center;\n background-color: #fcf8e5;\n overflow: hidden;\n align-items: center;\n padding: 2rem;\n}\n.trust-video-wrapper:hover .trust-video-controls {\n visibility: visible;\n opacity: 1;\n}\n.trust-video-msg {\n display: flex;\n align-items: center;\n}\n.trust-video-controls {\n position: absolute;\n bottom: 0;\n margin-top: 35%;\n transform: translate(0, -30%);\n border-radius: 10px;\n align-items: center;\n justify-content: space-between;\n visibility: hidden;\n opacity: 0;\n transition: all 0.25s ease-out;\n display: none;\n}\n.trust-video-controls.show {\n display: flex;\n}\n.trust-video-play {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.3rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-play:before {\n content: \"\\f04b\";\n}\n.trust-video-play.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-play-btn {\n border-color: transparent;\n}\n.trust-video-pause {\n border-color: transparent;\n transition: 0.3s;\n margin: auto;\n margin-left: 3rem;\n margin-right: 3rem;\n line-height: 1.5em;\n width: 4em;\n height: 4em;\n padding: 0.6rem;\n padding-right: 0.4rem;\n cursor: pointer;\n opacity: 1;\n background-color: #ffdd33;\n font-size: 0.9rem;\n border-radius: 50%;\n font: normal normal normal 18px/1;\n}\n.trust-video-pause:before {\n content: \"\\f04b\";\n}\n.trust-video-pause.paused:before {\n content: \"\\f04c\";\n}\n.trust-video-pause-btn {\n border-color: transparent;\n}\n.trust-video-volume {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 1em;\n padding: 0.6rem;\n border-radius: 20%;\n line-height: 1.5em;\n width: 3em;\n height: 3em;\n background-color: rgba(255, 221, 51, 0.7);\n left: 20px;\n}\n.trust-video-fullscreen {\n border-color: transparent;\n color: rgba(43, 51, 63, 0.7);\n font-size: 0.65em;\n line-height: 2.5rem;\n padding: 0.6rem;\n width: 5em;\n border-radius: 20%;\n margin-right: 5%;\n background-color: rgba(255, 221, 51, 0.7);\n right: 20px;\n}\n\n/* ----------- Large screens ----------- */\n@media only screen and (min-width: 1280px) {\n .trust-video-play {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-pause {\n margin-left: 5rem;\n margin-right: 5rem;\n }\n .trust-video-controls {\n height: 10em;\n }\n}\n@media only screen and (max-width: 526px) {\n .trust-video-play {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-pause {\n width: 3em;\n height: 3em;\n padding: 0.5rem;\n padding-right: 0.3rem;\n }\n .trust-video-volume {\n width: 2em;\n height: 2em;\n padding: 0.4rem;\n }\n .trust-video-fullscreen {\n width: 3em;\n padding: 0.4rem;\n }\n .trust-video-controls {\n transform: translate(0, -100%);\n }\n}\n.x-utu-feedback-details-popup {\n width: 100%;\n padding: 0.5rem;\n border-radius: 10px;\n display: flex;\n flex-direction: column;\n align-items: stretch;\n justify-content: center;\n}\n\n.x-utu-feedback-details-popup_btn {\n padding: 12px;\n border: none;\n border-radius: 10px;\n font-size: 14px;\n font-weight: 500;\n font-family: Roboto, system-ui, -apple-system, \"Segoe UI\", \"Helvetica Neue\", Arial, \"Noto Sans\", \"Liberation Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n background-color: rgb(252, 229, 70);\n}";
|
|
58098
58032
|
styleInject(css_248z);
|
|
58099
58033
|
|
|
58100
|
-
// import Avatar from "../../screens/FeedbackDetails/Avatar";
|
|
58101
58034
|
function FeedbackDetailsPopup(props) {
|
|
58102
58035
|
var _a = p(false),
|
|
58103
58036
|
popUpVisible = _a[0],
|
|
58104
58037
|
setPopUpVisible = _a[1];
|
|
58105
|
-
|
|
58106
|
-
|
|
58107
|
-
|
|
58108
|
-
|
|
58109
|
-
|
|
58110
|
-
|
|
58111
|
-
if (props[ATTR_THEME_COLOR] === "dark") {
|
|
58112
|
-
setIsDark(true);
|
|
58113
|
-
}
|
|
58114
|
-
var _c = p(""),
|
|
58115
|
-
videoUrl = _c[0],
|
|
58116
|
-
setVideoUrl = _c[1];
|
|
58038
|
+
var _b = p(""),
|
|
58039
|
+
videoUrl = _b[0],
|
|
58040
|
+
setVideoUrl = _b[1];
|
|
58041
|
+
var _c = p(false),
|
|
58042
|
+
videoVisible = _c[0],
|
|
58043
|
+
setVideoVisible = _c[1];
|
|
58117
58044
|
var showVideo = function showVideo(url) {
|
|
58118
58045
|
setVideoUrl(url);
|
|
58119
58046
|
setVideoVisibility();
|
|
@@ -58122,18 +58049,11 @@
|
|
|
58122
58049
|
setVideoVisible(!videoVisible);
|
|
58123
58050
|
setPopUpVisible(!popUpVisible);
|
|
58124
58051
|
};
|
|
58125
|
-
var _d = p(false),
|
|
58126
|
-
videoVisible = _d[0],
|
|
58127
|
-
setVideoVisible = _d[1];
|
|
58128
58052
|
return v$2(BaseComponent, {
|
|
58129
|
-
|
|
58130
|
-
|
|
58131
|
-
}, v$2("button", {
|
|
58053
|
+
className: "x-utu-feedback-details-popup"
|
|
58054
|
+
}, v$2("style", null, " ", css_248z, " "), v$2("button", {
|
|
58132
58055
|
type: "button",
|
|
58133
|
-
|
|
58134
|
-
backgroundColor: props[ATTR_BTN_COLOR] === undefined ? null : "" + props[ATTR_BTN_COLOR]
|
|
58135
|
-
},
|
|
58136
|
-
className: "x-utu-btn x-utu-btn-" + envCondition + " border-radius",
|
|
58056
|
+
className: "x-utu-feedback-details-popup_btn",
|
|
58137
58057
|
onClick: function onClick() {
|
|
58138
58058
|
return setPopUpVisible(true);
|
|
58139
58059
|
}
|
|
@@ -58150,10 +58070,8 @@
|
|
|
58150
58070
|
}
|
|
58151
58071
|
}, v$2(BaseComponent, {
|
|
58152
58072
|
style: css_248z,
|
|
58153
|
-
className: "
|
|
58154
|
-
},
|
|
58155
|
-
// videoUrl, preview, previewStream, showControls
|
|
58156
|
-
Player(videoUrl, false, null, true), v$2("div", {
|
|
58073
|
+
className: "x-utu-feedback-details-popup-video-popup"
|
|
58074
|
+
}, Player(videoUrl, false, null, true), v$2("div", {
|
|
58157
58075
|
className: "logo-position-player"
|
|
58158
58076
|
}, v$2(Logo, null)))));
|
|
58159
58077
|
}
|