@everymatrix/casino-play-random-game 1.0.69

package/dist/cjs/index.cjs.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-4cc20a8d.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["casino-play-random-game.cjs",[[1,"casino-play-random-game",{"endpoint":[513],"datasource":[513],"language":[513],"specificCategory":[513,"specific-category"],"iconVisible":[513,"icon-visible"],"iconVisibleOnAnim":[513,"icon-visible-on-anim"],"launchByGameCard":[513,"launch-by-game-card"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"gamesToShow":[32],"selectedGame":[32],"animationDone":[32],"animationStarted":[32]},null,{"endpoint":["watchEndpoint"],"datasource":["watchEndpoint"],"language":["watchEndpoint"],"translationUrl":["handleNewTranslations"],"iconVisible":["handleIsIconVisible"]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,12 @@
+{
+  "entries": [
+    "components/casino-play-random-game/casino-play-random-game.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.20.0",
+    "typescriptVersion": "5.5.3"
+  },
+  "collections": [],
+  "bundles": []
+}

package/dist/collection/components/casino-play-random-game/casino-play-random-game.css

@@ -0,0 +1,363 @@
+:host {
+  display: block;
+  font-family: inherit;
+}
+
+.RandomGameWrapper {
+  width: 100%;
+  height: var(--emw--size-4x-medium, 700px);
+  background: transparent;
+  position: relative;
+}
+
+.GameContainerGradient {
+  position: absolute;
+  top: 10%;
+  left: -5px;
+  width: 100vw;
+  height: 80%;
+  background: linear-gradient(90deg, var(--emw--color-background, rgba(0, 0, 0, 0.9)) 0%, rgba(14, 21, 17, 0.5) 25%, rgba(14, 21, 17, 0) 50%, rgba(14, 21, 16, 0.5) 75%, var(--emw--color-background, rgba(10, 0, 0, 0.9)) 100%);
+  pointer-events: none;
+  z-index: 1;
+  filter: blur(10px);
+}
+
+.GamesContainer {
+  display: flex;
+  height: var(--emw--size-4x-medium, 600px);
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+  align-items: center;
+  align-content: flex-start;
+  gap: var(--emw--spacing-large, 20px);
+}
+
+.RandomGameCard {
+  position: relative;
+  width: var(--emw--size-3x-medium, 300px);
+  height: var(--emw--size-4x-medium, 420px);
+  border-radius: var(--emw--border-radius-large, 20px);
+  top: 8%;
+  filter: blur(5px);
+}
+.RandomGameCard .RandomGameVendor {
+  position: absolute;
+  font-size: var(--emw--font-size-x-small, 12px);
+  bottom: var(--emw--spacing-small-minus, 10px);
+  left: var(--emw--spacing-small-minus, 10px);
+  color: var(--emw--color-typography, #FFFFFF);
+}
+
+.TheRandomGame {
+  animation-name: ZoomFadeIn;
+  animation-duration: 0.5s;
+  animation-fill-mode: forwards;
+  -webkit-animation-name: ZoomFadeIn;
+  -webkit-animation-duration: 0.5s;
+  -webkit-animation-fill-mode: forwards;
+  opacity: 1;
+  cursor: pointer;
+  filter: blur(0);
+}
+
+.RandomGameImage {
+  width: inherit;
+  height: inherit;
+  object-fit: cover;
+  border-radius: var(--emw--border-radius-large, 20px);
+}
+
+.RandomGameDetails {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  color: var(--emw--color-typography, #FFFFFF);
+  font-size: var(--emw--font-size-small, 14px);
+  width: 100%;
+}
+.RandomGameDetails .RandomGameTitle {
+  line-height: 18px;
+}
+.RandomGameDetails .RandomGameInfo {
+  border-radius: 50%;
+  width: var(--emw--spacing-medium, 16px);
+  height: var(--emw--spacing-medium, 16px);
+  font-size: var(--emw--font-size-x-small, 12px);
+  font-weight: var(--emw--font-weight-normal, 400);
+  border: solid 1px var(--emw--color-typography, #FFFFFF);
+  text-align: center;
+  margin: var(--emw--spacing-2x-small, 4px) 0;
+  line-height: 14px;
+  cursor: pointer;
+}
+.RandomGameDetails .RandomGamePlay {
+  background: var(--emw--color-primary, #4bd004);
+  color: var(--emw--color-typography, #FFFFFF);
+  border: none;
+  border-radius: var(--emw--border-radius-medium, 5px);
+  width: 200px;
+  height: 40px;
+  font-size: var(--emw--font-size-small, 14px);
+  cursor: pointer;
+}
+
+.ButtonWrapper {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  z-index: 100;
+}
+
+.ButtonContainer {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  position: relative;
+}
+
+.ButtonIcon {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  gap: var(--emw--spacing-2x-small, 5px);
+}
+
+.QustionMark {
+  position: absolute;
+  font-family: sans-serif;
+  font-size: 120px;
+  font-weight: 900;
+  color: color-mix(in srgb, var(--emw--color-primary, #22B04E) 80%, black 10%);
+  text-shadow: 0px 12px 0px color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 50%);
+  left: 50%;
+  top: -20%;
+  transform: translateX(-50%);
+  z-index: 10;
+}
+
+.HexagonMarkShadow {
+  width: 100px;
+  height: 115px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 70%);
+  clip-path: polygon(50% 0, 100% 30%, 100% 70%, 50% 100%, 0% 70%, 0% 30%);
+}
+
+.HexagonMark {
+  position: absolute;
+  width: var(--emw--size-medium, 90px);
+  height: 105px;
+  background: linear-gradient(to bottom, color-mix(in srgb, var(--emw--casino-color-secondary, var(--emw--color-secondary, #eeac4a)), black 20%) 0%, var(--emw--categories-color-secondary, var(--emw--color-secondary, #eeac4a)) 100%);
+  clip-path: polygon(50% 0, 100% 30%, 100% 70%, 50% 100%, 0% 70%, 0% 30%);
+}
+
+.RandomButtons {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  gap: var(--emw--spacing-2x-small, 5px);
+  width: 100%;
+  position: relative;
+  z-index: 10;
+}
+
+.RandomButton {
+  font-size: var(--emw--font-size-large, 20px);
+  text-transform: uppercase;
+  width: max-content;
+  border-radius: var(--emw--button-border-radius, 50px);
+  padding: var(--emw--spacing-large, 20px) var(--emw--spacing-2x-large, 40px);
+  border: solid 3px var(--emw--button-border-color, #063B17);
+  color: var(--emw--button-text-color, #FFFFFF);
+  opacity: 1;
+  animation: ButtonEffect 3s linear infinite;
+  background-image: linear-gradient(to right, var(--emw--color-primary, #22B04E), color-mix(in srgb, var(--emw--color-primary, #22B04E), black 30%), var(--emw--color-primary, #22B04E));
+  background-size: 300% 100%;
+  cursor: pointer;
+  position: relative;
+  z-index: 10;
+}
+.RandomButton:hover {
+  opacity: 0.8;
+}
+
+.HideAnimation {
+  filter: blur(5px);
+  animation: AnimateButton 0.2s forwards;
+}
+
+.Flip {
+  animation-name: Flip, Blur;
+  animation-duration: 0.75s, 3s;
+  animation-iteration-count: infinite, 1;
+  -webkit-animation-name: Flip, Blur;
+  -webkit-animation-duration: 0.75s, 3s;
+  -webkit-animation-iteration-count: infinite, 1;
+}
+
+@keyframes ButtonEffect {
+  0% {
+    background-position: 0% 50%;
+  }
+  33% {
+    background-position: 100% 50%;
+  }
+  66% {
+    background-position: 200% 50%;
+  }
+  100% {
+    background-position: 300% 50%;
+  }
+}
+@keyframes ZoomFadeIn {
+  0% {
+    transform: scale(0.2) translateY(0);
+    filter: blur(5px);
+    opacity: 0.3;
+  }
+  50% {
+    transform: scale(1.1) translateY(-30px);
+    filter: blur(2px);
+    opacity: 0.7;
+  }
+  100% {
+    transform: scale(1) translateY(-30px);
+    filter: blur(0px);
+    opacity: 1;
+  }
+}
+@keyframes AnimateButton {
+  0% {
+    opacity: 0.7;
+  }
+  50% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 0;
+    display: none;
+  }
+}
+@keyframes Flip {
+  0% {
+    transform: rotateY(0deg);
+  }
+  50% {
+    transform: rotateY(180deg);
+  }
+  100% {
+    transform: rotateY(360deg);
+  }
+}
+@keyframes Blur {
+  0% {
+    filter: blur(0);
+  }
+  50% {
+    filter: blur(1px);
+  }
+  100% {
+    filter: blur(3px);
+  }
+}
+@container (max-width: 475px) {
+  .GamesContainer {
+    height: inherit;
+    gap: var(--emw--spacing-2x-small, 5px);
+  }
+  .RandomGameWrapper {
+    width: 100%;
+    height: 300px;
+    overflow: hidden;
+    background: transparent;
+    position: relative;
+  }
+  .GameContainerGradient {
+    position: absolute;
+    top: 10%;
+    left: -5px;
+    width: 100vw;
+    height: 80%;
+    background: linear-gradient(90deg, var(--emw--color-background, rgba(0, 0, 0, 0.9)) 0%, rgba(14, 21, 17, 0.2) 25%, rgba(14, 21, 17, 0) 50%, rgba(14, 21, 16, 0.2) 75%, var(--emw--color-background, rgba(10, 0, 0, 0.9)) 100%);
+    pointer-events: none;
+    z-index: 1;
+    filter: blur(5px);
+  }
+  .RandomGameCard {
+    width: 100px;
+    height: 150px;
+    top: 0%;
+    border-radius: var(--emw--border-radius-medium, 4px);
+    filter: blur(5px);
+  }
+  .RandomGameImage {
+    width: 102px;
+    height: inherit;
+    top: 0%;
+  }
+  .RandomGameDetails {
+    font-size: 14px;
+    width: 100%;
+  }
+  .RandomGameDetails .RandomGameTitle {
+    line-height: 18px;
+    width: 75%;
+  }
+  .RandomGameDetails .RandomGameInfo {
+    border-radius: 50%;
+    width: 16px;
+    height: 16px;
+    font-size: var(--emw--font-size-x-small, 12px);
+    line-height: 14px;
+  }
+  .RandomGameDetails .RandomGamePlay {
+    background: var(--emw--color-primary, #52d004);
+    color: var(--emw--color-typography, #FFFFFF);
+    border: none;
+    border-radius: 5px;
+    width: 200px;
+    height: 40px;
+    font-size: 14px;
+    cursor: pointer;
+  }
+  .RandomGameCard .RandomGameVendor {
+    font-size: var(--emw--font-size-x-small, 12px);
+    bottom: 5px;
+    right: 5px;
+  }
+  .RandomButtons {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    gap: 5px;
+    width: 100%;
+  }
+  .RandomButton {
+    font-size: var(--emw--font-size-x-small, 12px);
+    padding: 10px 15px;
+    border: solid 1px var(--emw--button-border-color, #063B17);
+  }
+  .QustionMark {
+    font-size: 100px;
+    font-weight: 700;
+  }
+  .HexagonMarkShadow {
+    width: 80px;
+    height: 95px;
+  }
+  .HexagonMark {
+    width: 70px;
+    height: 85px;
+  }
+}