fansunited-frontend-components 0.0.31-RC5 → 0.0.31-RC7

package/packages/event-game-play/src/components/Variants/Split/EventGameSplitVariant.styles.js

@@ -1,149 +0,0 @@
-const t = (e) => ({
-  // Question area
-  questionArea: {
-    flex: e.isMobile ? "1" : "0 0 50%",
-    width: e.isMobile ? "100%" : "50%",
-    minWidth: e.isMobile ? "100%" : "50%",
-    maxWidth: e.isMobile ? "100%" : "50%",
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center"
-  },
-  // Lead content container (filter screen)
-  leadContentContainer: {
-    p: e.spacingScale.md,
-    gap: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    backdropFilter: "blur(4px)",
-    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
-    borderRadius: e.borderRadius.sm
-  },
-  // Question area content wrapper
-  questionAreaContent: {
-    p: e.spacingScale.lg,
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    gap: "16px"
-  },
-  // Main content container
-  mainContentContainer: {
-    p: e.spacingScale.lg,
-    gap: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    backdropFilter: "blur(4px)",
-    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
-    borderRadius: e.borderRadius.sm,
-    position: "relative",
-    zIndex: 2
-  },
-  // Game state container
-  gameStateContainer: {
-    display: "flex",
-    flexDirection: "column",
-    gap: e.spacingScale.xs,
-    textAlign: "center"
-  },
-  // State title
-  stateTitle: {
-    fontFamily: e.fontFamilyPrimary,
-    fontWeight: 700,
-    fontSize: "1.5em",
-    lineHeight: "133%",
-    letterSpacing: "0.15px",
-    color: e.textColor
-  },
-  // State description
-  stateDescription: {
-    fontFamily: e.fontFamilyPrimary,
-    fontWeight: 400,
-    fontSize: "1.25em",
-    lineHeight: "140%",
-    letterSpacing: "0.15px",
-    color: e.secondaryColor,
-    opacity: "60%"
-  },
-  // Live indicator container
-  liveIndicatorContainer: {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: e.spacingScale.xs
-  },
-  // Live indicator
-  liveIndicator: {
-    width: "12px",
-    height: "12px",
-    borderRadius: "50%",
-    backgroundColor: e.dangerColor,
-    animation: "pulse 2s infinite",
-    "@keyframes pulse": {
-      "0%": {
-        opacity: 1,
-        transform: "scale(1)"
-      },
-      "50%": {
-        opacity: 0.7,
-        transform: "scale(1.1)"
-      },
-      "100%": {
-        opacity: 1,
-        transform: "scale(1)"
-      }
-    }
-  },
-  // Live text
-  liveText: {
-    fontFamily: e.fontFamilyPrimary,
-    fontWeight: 600,
-    fontSize: "1em",
-    color: e.dangerColor,
-    textTransform: "uppercase",
-    letterSpacing: "0.5px"
-  },
-  // Pagination container
-  paginationContainer: {
-    display: "flex",
-    justifyContent: "center",
-    px: e.spacingScale.lg
-  },
-  // Navigation container
-  navigationContainer: {
-    display: "flex",
-    gap: e.spacingScale.md,
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  matchResultBadge: {
-    display: "flex",
-    alignItems: "center",
-    alignSelf: "center",
-    gap: e.spacingScale.xs,
-    fontSize: "0.75em",
-    padding: "2px 6px",
-    minHeight: "20px",
-    borderRadius: e.borderRadius.sm,
-    border: `1px solid ${e.textColor}20`,
-    backgroundColor: e.textColor + "10",
-    width: "fit-content"
-  },
-  matchResultTeamLogo: {
-    width: "20px",
-    height: "20px",
-    borderRadius: "50%",
-    overflow: "hidden",
-    flexShrink: 0
-  },
-  matchResultScoreText: {
-    fontFamily: e.fontFamilyPrimary,
-    fontSize: "0.75em",
-    fontWeight: 600,
-    color: e.textColor,
-    lineHeight: 1
-  }
-});
-export {
-  t as createStyles
-};

package/packages/event-game-play/src/components/Variants/Split/FinishedGame/EventGameSplitFinishedGame.js

@@ -1,119 +0,0 @@
-import { j as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as r, Typography as s } from "@mui/joy";
-import { useInternalTheme as D, isMobile as G, useColors as i, useFontFamily as c, useCornerRadius as w, useSpacingScale as B, useImageBackgroundGradient as N } from "../../../../../../common/src/functions/theme.js";
-import { hexToRgb as V, stripHtmlTags as L } from "../../../../../../common/src/functions/helpers.js";
-import "../../../../../../../node_modules/i18next/dist/esm/i18next.js";
-import "../../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
-import { WidgetTemplate as x } from "../../../../../../common/src/enums/enums.js";
-import M from "../../../../../../common/src/components/Rules.js";
-import "react";
-import "../../../../../../common/src/providers/ConstantsProvider.js";
-import { useImageVariant as E } from "../../../../../../common/src/hooks/useImageVariant.js";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-import H from "../../../Shared/MainCard.js";
-import O from "../../../../assets/default-quiz-bg.png.js";
-import U from "../../../../assets/default-quiz-bg-vertical.jpg.js";
-import { createStyles as W } from "./EventGameSplitFinishedGame.styles.js";
-import q from "../../../Shared/FinishedGameWrapper/FinishedGameWrapper.js";
-import A from "../../../Shared/Leaderboard/LeaderboardComponent.js";
-import z from "../../../Shared/Leaderboard/LeaderboardPagination.js";
-import { useEventRankings as J } from "../../../../hooks/useEventRankings.js";
-import { useTranslation as K } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const ue = (t) => {
-  const g = D(), { t: h } = K(), a = G(), u = t.defaultImagePlaceholderUrl ? t.defaultImagePlaceholderUrl : a ? U : O, f = E(
-    {
-      images: t.event.images,
-      imagePlaceholder: u
-    },
-    x.SPLIT
-  ), P = i().palette.danger.plainColor, p = i().textColor, j = i().textColor, C = c().secondary, y = "60%", T = c().primary, b = i().surfaceVariant, v = w(), l = B(), S = N(
-    x.SPLIT
-  ), { rankings: I, pagination: o, loading: k, goToNextPage: F, goToPreviousPage: R } = J(t.event.id, t.sdk), n = W({
-    finalImage: f,
-    spacingScale: l,
-    borderRadius: v,
-    fontFamilyPrimary: T,
-    fontFamilySecondary: C,
-    secondaryColor: j,
-    opacity: y,
-    bgcolor: V(b || ""),
-    textColor: p,
-    darkTextColor: g.colorSchemes.dark.textColor,
-    imageBackgroundGradient: S,
-    isMobile: a,
-    dangerColor: P,
-    isTabulated: t.showPredictionDetails || !1
-  }), m = () => /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsx(r, { sx: n.questionAreaContent, children: /* @__PURE__ */ e.jsxs(r, { sx: n.mainContentContainer, children: [
-    /* @__PURE__ */ e.jsx(
-      A,
-      {
-        leaderboard: I,
-        userRanking: t.prediction,
-        showHeading: !t.showPredictionDetails,
-        isSplitVariant: !0,
-        loading: k
-      }
-    ),
-    o && (o.hasNextPage || o.hasPreviousPage) && /* @__PURE__ */ e.jsx(r, { sx: n.paginationContainer, children: /* @__PURE__ */ e.jsx(
-      z,
-      {
-        hasNextPage: o.hasNextPage,
-        hasPreviousPage: o.hasPreviousPage,
-        onNextPage: F,
-        onPreviousPage: R,
-        isOverlayVariant: !1,
-        justifyContent: "center"
-      }
-    ) })
-  ] }) }) }), d = () => /* @__PURE__ */ e.jsx(r, { sx: n.headlineSection, children: /* @__PURE__ */ e.jsx(r, { sx: n.headlineContent, children: /* @__PURE__ */ e.jsxs(r, { children: [
-    /* @__PURE__ */ e.jsxs(
-      r,
-      {
-        sx: {
-          display: "flex",
-          alignItems: "center",
-          gap: l["3xs"]
-        },
-        children: [
-          /* @__PURE__ */ e.jsx(s, { sx: n.headlineText, children: h("eventGame.headline") }),
-          /* @__PURE__ */ e.jsx(
-            M,
-            {
-              rules: t.event.rules || "",
-              rulesDisplay: t.rulesDisplay,
-              isOverlayVariant: !1
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ e.jsxs(r, { sx: n.contentContainer, children: [
-      /* @__PURE__ */ e.jsx(s, { sx: n.titleText, children: t.event.title }),
-      /* @__PURE__ */ e.jsx(s, { sx: n.descriptionText, children: L(t.event.description) })
-    ] })
-  ] }) }) });
-  return /* @__PURE__ */ e.jsx(H, { brandingBorderColor: null, children: t.showPredictionDetails ? /* @__PURE__ */ e.jsxs(
-    q,
-    {
-      prediction: t.prediction,
-      game: t.event,
-      resultsTabPanelSxProps: {
-        display: "flex",
-        flexDirection: a ? "column" : "row",
-        px: 0,
-        pb: 0,
-        pt: 0
-      },
-      children: [
-        d(),
-        m()
-      ]
-    }
-  ) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    d(),
-    m()
-  ] }) });
-};
-export {
-  ue as default
-};

package/packages/event-game-play/src/components/Variants/Split/FinishedGame/EventGameSplitFinishedGame.styles.js

@@ -1,230 +0,0 @@
-const i = (e) => ({
-  // Main headline section with background image
-  headlineSection: {
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "space-between",
-    gap: "10px",
-    flex: e.isMobile ? "1" : "0 0 50%",
-    width: e.isMobile ? "100%" : "50%",
-    minWidth: e.isMobile ? "100%" : "50%",
-    maxWidth: e.isMobile ? "100%" : "50%",
-    backgroundImage: `url(${e.finalImage})`,
-    backgroundSize: "cover",
-    backgroundPosition: "center",
-    borderTopLeftRadius: e.isTabulated ? 0 : e.borderRadius.md,
-    borderTopRightRadius: e.isMobile ? e.isTabulated ? 0 : e.borderRadius.md : 0,
-    borderBottomLeftRadius: e.isMobile ? 0 : e.borderRadius.md,
-    overflow: "hidden",
-    height: "auto",
-    position: "relative",
-    minHeight: e.isMobile ? "210px" : "430px",
-    "&::before": {
-      content: '""',
-      position: "absolute",
-      width: "100%",
-      height: "100%",
-      background: e.imageBackgroundGradient,
-      borderTopLeftRadius: "5px",
-      borderTopRightRadius: "5px"
-    }
-  },
-  // Headline content wrapper
-  headlineContent: {
-    zIndex: 1,
-    height: "100%",
-    p: e.spacingScale.xl,
-    gap: e.spacingScale.xl,
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "space-between"
-  },
-  // Headline typography
-  headlineText: {
-    fontWeight: 500,
-    lineHeight: "166%",
-    letterSpacing: "1px",
-    fontSize: "0.75em",
-    color: e.darkTextColor,
-    opacity: "70%",
-    textTransform: "uppercase",
-    fontFamily: e.fontFamilySecondary,
-    textAlign: e.isMobile ? "center" : "left"
-  },
-  // Content container
-  contentContainer: {
-    display: "flex",
-    flexDirection: "column",
-    gap: e.spacingScale["3xs"]
-  },
-  // Title typography
-  titleText: {
-    fontWeight: 700,
-    lineHeight: "133%",
-    fontSize: "1.5em",
-    letterSpacing: "0.15px",
-    color: e.darkTextColor,
-    fontFamily: e.fontFamilyPrimary,
-    textAlign: e.isMobile ? "center" : "left"
-  },
-  // Description typography
-  descriptionText: {
-    fontWeight: 400,
-    lineHeight: "140%",
-    fontSize: "1.25em",
-    letterSpacing: "0.15px",
-    color: e.darkTextColor,
-    opacity: "70%",
-    fontFamily: e.fontFamilyPrimary,
-    textAlign: e.isMobile ? "center" : "left"
-  },
-  // Question area
-  questionArea: {
-    flex: e.isMobile ? "1" : "0 0 50%",
-    width: e.isMobile ? "100%" : "50%",
-    minWidth: e.isMobile ? "100%" : "50%",
-    maxWidth: e.isMobile ? "100%" : "50%",
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center"
-  },
-  // Lead content container (filter screen)
-  leadContentContainer: {
-    p: e.spacingScale.md,
-    gap: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    backdropFilter: "blur(4px)",
-    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
-    borderRadius: e.borderRadius.sm
-  },
-  // Question area content wrapper
-  questionAreaContent: {
-    p: e.spacingScale.lg,
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    gap: "16px",
-    width: e.isMobile ? "auto" : "100%"
-  },
-  // Main content container
-  mainContentContainer: {
-    p: e.spacingScale.lg,
-    gap: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    justifyContent: "center",
-    backdropFilter: "blur(4px)",
-    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
-    borderRadius: e.borderRadius.sm,
-    minHeight: "300px"
-  },
-  // Game state container
-  gameStateContainer: {
-    display: "flex",
-    flexDirection: "column",
-    gap: e.spacingScale.xs,
-    textAlign: "center"
-  },
-  // State title
-  stateTitle: {
-    fontFamily: e.fontFamilyPrimary,
-    fontWeight: 700,
-    fontSize: "1.5em",
-    lineHeight: "133%",
-    letterSpacing: "0.15px",
-    color: e.textColor
-  },
-  // State description
-  stateDescription: {
-    fontFamily: e.fontFamilyPrimary,
-    fontWeight: 400,
-    fontSize: "1.25em",
-    lineHeight: "140%",
-    letterSpacing: "0.15px",
-    color: e.secondaryColor,
-    opacity: e.opacity
-  },
-  // Live indicator container
-  liveIndicatorContainer: {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: e.spacingScale.xs
-  },
-  // Live indicator
-  liveIndicator: {
-    width: "12px",
-    height: "12px",
-    borderRadius: "50%",
-    backgroundColor: e.dangerColor,
-    animation: "pulse 2s infinite",
-    "@keyframes pulse": {
-      "0%": {
-        opacity: 1,
-        transform: "scale(1)"
-      },
-      "50%": {
-        opacity: 0.7,
-        transform: "scale(1.1)"
-      },
-      "100%": {
-        opacity: 1,
-        transform: "scale(1)"
-      }
-    }
-  },
-  // Live text
-  liveText: {
-    fontFamily: e.fontFamilyPrimary,
-    fontWeight: 600,
-    fontSize: "1em",
-    color: e.dangerColor,
-    textTransform: "uppercase",
-    letterSpacing: "0.5px"
-  },
-  // Pagination container
-  paginationContainer: {
-    display: "flex",
-    justifyContent: "center",
-    ml: 0
-  },
-  // Navigation container
-  navigationContainer: {
-    display: "flex",
-    gap: e.spacingScale.md,
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  matchResultBadge: {
-    display: "flex",
-    alignItems: "center",
-    alignSelf: "center",
-    gap: e.spacingScale.xs,
-    fontSize: "0.75em",
-    padding: "2px 6px",
-    minHeight: "20px",
-    borderRadius: e.borderRadius.sm,
-    border: `1px solid ${e.textColor}20`,
-    backgroundColor: e.textColor + "10",
-    width: "fit-content"
-  },
-  matchResultTeamLogo: {
-    width: "20px",
-    height: "20px",
-    borderRadius: "50%",
-    overflow: "hidden",
-    flexShrink: 0
-  },
-  matchResultScoreText: {
-    fontFamily: e.fontFamilyPrimary,
-    fontSize: "0.75em",
-    fontWeight: 600,
-    color: e.textColor,
-    lineHeight: 1
-  }
-});
-export {
-  i as createStyles
-};

package/packages/event-game-play/src/components/Variants/Split/ScoreState/EventGameSplitScoreState.js

@@ -1,139 +0,0 @@
-import { j as t } from "../../../../../../../node_modules/react/jsx-runtime.js";
-import { Box as r } from "@mui/joy";
-import { isMobile as v, useColors as m, useFontFamily as T, useCornerRadius as I, useSpacingScale as A, useBorderSize as M } from "../../../../../../common/src/functions/theme.js";
-import { hexToRgb as d } from "../../../../../../common/src/functions/helpers.js";
-import "../../../../../../../node_modules/i18next/dist/esm/i18next.js";
-import "../../../../../../../node_modules/i18next-browser-languagedetector/dist/esm/i18nextBrowserLanguageDetector.js";
-import { WidgetTemplate as R } from "../../../../../../common/src/enums/enums.js";
-import w from "../../../../../../common/src/components/AdditionalCTA.js";
-import "react";
-import "../../../../../../common/src/providers/ConstantsProvider.js";
-import B from "../../../../../../common/src/components/Skeletons/Split/ScoreState/SplitScoreStateSkeleton.js";
-import { useImageVariant as E } from "../../../../../../common/src/hooks/useImageVariant.js";
-import "../../../../../../common/src/providers/ContainerProvider.js";
-import F from "../../../Shared/MainCard.js";
-import G from "../../../../assets/default-quiz-bg.png.js";
-import U from "../../../../assets/default-quiz-bg-vertical.jpg.js";
-import { createStyles as z } from "./EventGameSplitScoreState.styles.js";
-import D from "../../../Shared/AlertMessage.js";
-import $ from "../../../Shared/Summary/PredictionSummary.js";
-import { useTranslation as V } from "../../../../../../../node_modules/react-i18next/dist/es/useTranslation.js";
-const ae = (e) => {
-  const { t: n } = V(), i = v(), u = e.defaultImagePlaceholderUrl ? e.defaultImagePlaceholderUrl : i ? U : G, g = E(
-    {
-      images: e.eventGame.images,
-      imagePlaceholder: u
-    },
-    R.SPLIT
-  ), x = m().textSecondary, a = m().secondaryContainer, f = T().primary, l = m().surfaceVariant, s = I(), o = A(), y = M().size, p = e.eventGame.status === "OPEN" && e.prediction && e.onPredictionUpdate, S = (P) => {
-    console.log(`Edit prediction for fixture at index: ${P}`);
-  }, c = z({
-    spacingScale: o,
-    borderRadius: s,
-    bgcolor: d(l || ""),
-    isMobile: i
-  }), b = {
-    display: "flex",
-    py: i ? o.xs : o.sm,
-    px: i ? o.sm : o.md,
-    flexDirection: "row",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "8px",
-    borderRadius: s.xl,
-    bgcolor: a,
-    border: `${y} solid ${a}`,
-    "&:hover": {
-      bgcolor: a,
-      opacity: 0.9
-    },
-    fontSize: i ? "0.750em" : "0.8125em",
-    textTransform: "uppercase"
-  }, h = {
-    display: "flex",
-    justifyContent: "center",
-    alignItems: "center",
-    gap: "8px"
-  }, C = {
-    color: x,
-    fontFamily: f,
-    fontStyle: "normal",
-    fontWeight: 500,
-    lineHeight: "22px",
-    letterSpacing: "0.46px",
-    textTransform: "uppercase"
-  }, j = () => /* @__PURE__ */ t.jsx(
-    B,
-    {
-      entity: { ...e.eventGame, labels: null },
-      headline: n("eventGame.headline"),
-      finalImage: g,
-      brandingContent: /* @__PURE__ */ t.jsx(t.Fragment, {}),
-      isTabulated: !1,
-      alwaysShowImage: !0,
-      rulesDisplay: e.rulesDisplay,
-      children: e.isUnauthorized ? /* @__PURE__ */ t.jsx(r, { sx: c.alertMessageArea, children: /* @__PURE__ */ t.jsx(r, { sx: c.alertMessageWrapper, children: /* @__PURE__ */ t.jsx(
-        D,
-        {
-          variant: "error",
-          title: n("common.authentication.accessRequired"),
-          message: n("common.authentication.invalidOrMissingAuth")
-        }
-      ) }) }) : /* @__PURE__ */ t.jsxs(r, { sx: c.questionAreaContent, children: [
-        /* @__PURE__ */ t.jsx(
-          r,
-          {
-            sx: {
-              p: o.lg,
-              gap: o.lg,
-              display: "flex",
-              flexDirection: "column",
-              backdropFilter: "blur(4px)",
-              bgcolor: `rgba(${l ? d(l || "").replace(/[^\d,]/g, "") : ""}, 0.5)`,
-              borderRadius: s.sm,
-              position: "relative",
-              overflow: "visible"
-            },
-            children: p ? /* @__PURE__ */ t.jsx(
-              $,
-              {
-                fixtures: e.eventGame.fixtures,
-                prediction: e.prediction,
-                onEditPrediction: S,
-                onPredictionUpdate: e.onPredictionUpdate,
-                play: e.play,
-                view: "score",
-                isSplitVariant: !0,
-                onPlayResult: e.onPlayResult
-              }
-            ) : null
-          }
-        ),
-        e.additionalCTA && /* @__PURE__ */ t.jsx(
-          r,
-          {
-            sx: {
-              display: "flex",
-              justifyContent: "center",
-              alignItems: "center",
-              padding: i ? o.sm : o.md
-            },
-            children: /* @__PURE__ */ t.jsx(
-              w,
-              {
-                additionalCTA: e.additionalCTA,
-                buttonStyle: b,
-                buttonContentStyle: h,
-                textStyle: C
-              }
-            )
-          }
-        )
-      ] })
-    }
-  );
-  return /* @__PURE__ */ t.jsx(F, { brandingBorderColor: null, children: j() });
-};
-export {
-  ae as default
-};

package/packages/event-game-play/src/components/Variants/Split/ScoreState/EventGameSplitScoreState.styles.js

@@ -1,45 +0,0 @@
-const l = (e) => ({
-  // Question area content wrapper
-  questionAreaContent: {
-    p: e.spacingScale.lg,
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    gap: e.spacingScale.lg,
-    flex: 1,
-    height: "100%"
-  },
-  // Lead collection container
-  leadCollectionContainer: {
-    p: e.spacingScale.lg,
-    gap: e.spacingScale.md,
-    display: "flex",
-    flexDirection: "column",
-    backdropFilter: "blur(4px)",
-    bgcolor: `rgba(${e.bgcolor ? e.bgcolor.replace(/[^\d,]/g, "") : ""}, 0.5)`,
-    borderRadius: e.borderRadius.sm
-  },
-  // Lead content wrapper
-  leadContentWrapper: {
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center",
-    alignItems: "center",
-    alignSelf: "stretch"
-  },
-  alertMessageArea: {
-    flex: e.isMobile ? 1 : "0 0 50%",
-    width: e.isMobile ? "100%" : "50%",
-    minWidth: e.isMobile ? "100%" : "50%",
-    maxWidth: e.isMobile ? "100%" : "50%",
-    display: "flex",
-    flexDirection: "column",
-    justifyContent: "center"
-  },
-  alertMessageWrapper: {
-    p: e.spacingScale.lg
-  }
-});
-export {
-  l as createStyles
-};