@media-quest/builder 0.0.31 → 0.0.33

package/dist/public-api.js

@@ -1423,7 +1423,7 @@ var BuilderOptionTheme;
   const FONT_SIZE = 50;
   const BTN_PADDING_LEFT = 40;
   const BTN_PADDING_TOP = 40;
-  const buttonBaseCss2 = () => ({
+  const buttonBaseCss = () => ({
     css: {
       fontWeight: FONT_WEIGHT,
       fontSize: { _unit: "px", value: FONT_SIZE },
@@ -1443,7 +1443,7 @@ var BuilderOptionTheme;
     cssEnabled: { opacity: 1, cursor: "pointer" }
   });
   BuilderOptionTheme2.blueButton = () => {
-    const base = buttonBaseCss2();
+    const base = buttonBaseCss();
     const { css, cssEnabled, cssDisabled } = base;
     const optionTheme = {
       name: "blue-button-theme",
@@ -1672,9 +1672,9 @@ var Colors = {
   text: "#0D1E45",
   white: "#ffffff",
   backgroundGray: "#F0F0F0",
-  backgroundWhite: "white",
-  progressBackGround: "#164AC4",
-  progressForGround: "#F5F5F5"
+  backgroundWhite: "white"
+  // progressBackGround: "#164AC4",
+  // progressForGround: "#F5F5F5",
   // red: "red",
   // yellow: "yellow",
 };
@@ -1723,7 +1723,8 @@ var btnTextBase = {
   zIndex: LAYER_5,
   width: VIDEO_CONTROLS_WIDTH / 2,
   textAlign: "center",
-  visibility: "hidden"
+  visibility: "hidden",
+  margin: { _unit: "px", value: 0 }
   // backgroundColor: Colors.yellow,
 };
 var muteUnmuteText = { ...btnTextBase, right: VIDEO_CONTROLS_RIGHT };
@@ -1771,14 +1772,16 @@ var muteUnMuteStyles = {
   cssDisabled: { opacity: 0.3, cursor: "not-allowed" },
   cssEnabled: { opacity: 0.8, cursor: "pointer" }
 };
-var buttonBaseCss = () => ({
+var responseButtonBaseCss = () => ({
   css: {
     backgroundColor: Colors.primary,
     borderColor: Colors.primary,
     textColor: Colors.white,
     fontWeight: 600,
-    fontSize: { _unit: "px", value: 45 },
-    letterSpacing: { _unit: "px", value: 2 },
+    fontSize: { _unit: "px", value: 30 },
+    lineHeight: 1,
+    maxWidth: 30,
+    // flex: "0 0 auto",
     paddingLeft: { _unit: "px", value: 30 },
     paddingTop: { _unit: "px", value: 10 },
     paddingBottom: { _unit: "px", value: 10 },
@@ -1789,12 +1792,13 @@ var buttonBaseCss = () => ({
     position: "relative",
     display: "block",
     cursor: "pointer"
+    // maxWidth: { _unit: "percent", value: 10 },
   },
   cssDisabled: { opacity: 0.3, cursor: "not-allowed" },
   cssEnabled: { opacity: 1, cursor: "pointer" }
 });
 var primaryButton = (overridesCss) => {
-  const base = buttonBaseCss();
+  const base = responseButtonBaseCss();
   const optionTheme = {
     name: "primary-button",
     normal: {
@@ -1817,6 +1821,7 @@ var primaryButton = (overridesCss) => {
       btn: {
         css: {
           ...base.css,
+          ...overridesCss,
           backgroundColor: Colors.secondary,
           borderColor: Colors.secondary,
           textColor: Colors.primary
@@ -1939,7 +1944,8 @@ var Theme2 = {
         backgroundColor: Colors.white,
         textAlign: "left",
         textColor: "black",
-        fontSize: { _unit: "px", value: 40 }
+        fontSize: { _unit: "px", value: 35 },
+        lineHeight: 1.2
       },
       audio: {
         iconUrl: THEME_2_ICONS.audioPlay.dataUrl,
@@ -1977,18 +1983,19 @@ var Theme2 = {
     container: {
       base: {
         display: "flex",
-        justifyContent: "space-evenly",
+        justifyContent: "flex-start",
         width: BUTTON_BAR_WIDTH,
+        height: 8,
         bottom: Q_AREA_BOTTOM + H_M3,
         left: Q_AREA_LEFT + W_M3,
         // backgroundColor: "green",
         gap: { _unit: "px", value: 20 },
-        alignItems: "center"
+        alignItems: "stretch"
       },
-      whenSingle: { justifyContent: "space-evenly" },
+      whenSingle: { justifyContent: "center" },
       whenMany: { justifyContent: "flex-start" }
     },
-    nextButtonTheme: primaryButton({}),
+    nextButtonTheme: primaryButton({ height: 100 }),
     responseButtons: primaryButton({})
   }
 };