@everymatrix/general-tutorial-slider 1.32.4 → 1.33.1

package/dist/cjs/index.cjs.js

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

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,21 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-18ec3908.js');
+
+/*
+ Stencil Client Patch Esm v2.15.2 | MIT Licensed | https://stenciljs.com
+ */
+const patchEsm = () => {
+    return index.promiseResolve();
+};
+
+const defineCustomElements = (win, options) => {
+  if (typeof window === 'undefined') return Promise.resolve();
+  return patchEsm().then(() => {
+  return index.bootstrapLazy([["general-tutorial-slider.cjs",[[1,"general-tutorial-slider",{"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"cmsEndpoint":[513,"cms-endpoint"],"userRoles":[513,"user-roles"],"cmsEnv":[513,"cms-env"],"showSliderDots":[516,"show-slider-dots"],"showSliderArrows":[516,"show-slider-arrows"],"showSliderArrowsMobile":[516,"show-slider-arrows-mobile"],"enableAutoScroll":[516,"enable-auto-scroll"],"intervalPeriod":[514,"interval-period"],"scrollItems":[520,"scroll-items"],"itemsPerPage":[514,"items-per-page"],"hasErrors":[32],"limitStylingAppends":[32],"isLoading":[32],"activeIndex":[32],"tutorialElementWidth":[32]}]]]], options);
+  });
+};
+
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,12 @@
+{
+  "entries": [
+    "./components/general-tutorial-slider/general-tutorial-slider.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "2.15.2",
+    "typescriptVersion": "4.5.4"
+  },
+  "collections": [],
+  "bundles": []
+}

package/dist/collection/components/general-tutorial-slider/general-tutorial-slider.css

@@ -0,0 +1,168 @@
+:host {
+  display: block;
+}
+
+.GeneralTutorialSliderError {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+}
+.GeneralTutorialSliderError.TitleError {
+  color: red;
+}
+
+main {
+  width: 100%;
+  overflow: hidden;
+}
+
+.TutorialWrapper {
+  width: 100%;
+  display: flex;
+  flex: 0 0 auto;
+  justify-content: center;
+  flex-direction: column;
+  overflow: auto;
+}
+
+.TutorialContent {
+  display: flex;
+  justify-content: center;
+  flex-direction: row;
+}
+
+.TutorialItems {
+  display: flex;
+  transition: transform 0.4s ease-in-out;
+  transform: translateX(0px);
+}
+
+.TutorialItem {
+  flex: 0 0 auto;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  color: #000;
+  background-color: #f5f5f5;
+  border-radius: 5px;
+  user-select: none;
+}
+.TutorialItem .ItemTitle {
+  padding: 25px 15px;
+  font-size: 18px;
+  font-weight: 600;
+  color: var(--emfe-w-color-secondary, #FD2839);
+}
+.TutorialItem .ItemImage {
+  overflow: hidden;
+}
+.TutorialItem .ItemImage img, .TutorialItem .ItemImage video {
+  height: auto;
+  width: 450px;
+}
+.TutorialItem .ItemDescription {
+  font-size: 14px;
+  padding: 25px 15px;
+  font-weight: 400;
+  color: #000;
+}
+
+.SliderNavButton {
+  border: 0px;
+  width: 25px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.SliderNavButton svg {
+  width: 20px;
+  stroke: var(--emfe-w-color-secondary, #FD2839);
+}
+
+.DisabledArrow svg {
+  opacity: 0.2;
+  stroke: var(--emfe-w-color-secondary, #FD2839);
+  pointer-events: none;
+}
+
+.DotsWrapper {
+  width: 100%;
+  margin: 0 auto;
+  margin-top: 20px;
+  height: 30px;
+}
+.DotsWrapper ul.Dots {
+  display: flex;
+  justify-content: center;
+  padding: 0;
+}
+.DotsWrapper ul.Dots li {
+  height: 10px;
+  width: 10px;
+  background: #ccc;
+  border-radius: 50%;
+  margin-left: 3px;
+  margin-right: 3px;
+  list-style: none;
+  cursor: pointer;
+}
+.DotsWrapper ul.Dots li:hover {
+  background: #bbb;
+}
+.DotsWrapper ul.Dots li.active {
+  border: solid 1px var(--emfe-w-color-secondary, #FD2839);
+  background: var(--emfe-w-color-secondary, #FD2839);
+}
+.DotsWrapper ul.Dots li.default {
+  border: solid 1px var(--emfe-w-color-secondary, #FD2839);
+  background-color: #FFF;
+}
+
+@container (max-width: 475px) {
+  @media screen and (orientation: landscape) {
+    .TutorialItem {
+      width: 100%;
+    }
+  }
+  main {
+    height: 90cqh;
+  }
+
+  .TutorialItems {
+    height: inherit;
+  }
+
+  .TutorialItem {
+    min-width: 100%;
+    max-height: 800px;
+    overflow: auto;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: center;
+    color: #000;
+    background-color: #f5f5f5;
+    border-radius: 5px;
+    user-select: none;
+  }
+  .TutorialItem .ItemTitle {
+    padding: 25px 15px;
+    font-size: 18px;
+    font-weight: 600;
+    color: var(--emfe-w-color-secondary, #FD2839);
+  }
+  .TutorialItem .ItemImage {
+    min-height: 200px;
+  }
+  .TutorialItem .ItemImage img, .TutorialItem .ItemImage video {
+    height: auto;
+    width: 100%;
+  }
+  .TutorialItem .ItemDescription {
+    font-size: 14px;
+    padding: 25px 15px;
+    font-weight: 400;
+    color: #000;
+  }
+}