@eturnity/eturnity_reusable_components 7.30.3-EPDM-10647.0 → 7.30.3-EPDM-8441.0

package/src/components/addNewButton/index.vue

@@ -1,64 +1,64 @@
-<template>
-  <page-container :shouldPosition="shouldPosition">
-    <button-container :data-id="dataId">
-      <PlusButtonSvg />
-    </button-container>
-  </page-container>
-</template>
-
-<script>
-// import AddNewButton from "@eturnity/eturnity_reusable_components/src/components/addNewButton"
-import styled from 'vue3-styled-components'
-import PlusButtonSvg from '../../assets/icons/plus_button.svg'
-
-const pageAttrs = { shouldPosition: Boolean }
-const PageContainer = styled('div', pageAttrs)`
-  position: ${(props) => (props.shouldPosition ? 'fixed' : 'unset')};
-  bottom: 30px;
-  right: 30px;
-`
-
-const ButtonContainer = styled.div`
-  height: 60px;
-  width: 60px;
-  background-color: ${(props) => props.theme.colors.green};
-  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
-  border-radius: 100%;
-  cursor: pointer;
-  display: grid;
-  align-items: center;
-  justify-items: center;
-
-  &:hover {
-    background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
-      ${(props) => props.theme.colors.green};
-  }
-
-  &:active,
-  &:focus {
-    background: ${(props) => props.theme.colors.green};
-  }
-`
-
-const PlusButton = styled.img``
-
-export default {
-  name: 'add-new-button',
-  components: {
-    PageContainer,
-    ButtonContainer,
-    PlusButton,
-    PlusButtonSvg
-  },
-  props: {
-    shouldPosition: {
-      required: false,
-      default: true
-    },
-    dataId: {
-      type: String,
-      default: ''
-    }
-  }
-}
-</script>
+<template>
+  <page-container :shouldPosition="shouldPosition">
+    <button-container :data-id="dataId">
+      <PlusButtonSvg />
+    </button-container>
+  </page-container>
+</template>
+
+<script>
+// import AddNewButton from "@eturnity/eturnity_reusable_components/src/components/addNewButton"
+import styled from 'vue3-styled-components'
+import PlusButtonSvg from '../../assets/icons/plus_button.svg'
+
+const pageAttrs = { shouldPosition: Boolean }
+const PageContainer = styled('div', pageAttrs)`
+  position: ${(props) => (props.shouldPosition ? 'fixed' : 'unset')};
+  bottom: 30px;
+  right: 30px;
+`
+
+const ButtonContainer = styled.div`
+  height: 60px;
+  width: 60px;
+  background-color: ${(props) => props.theme.colors.green};
+  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
+  border-radius: 100%;
+  cursor: pointer;
+  display: grid;
+  align-items: center;
+  justify-items: center;
+
+  &:hover {
+    background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),
+      ${(props) => props.theme.colors.green};
+  }
+
+  &:active,
+  &:focus {
+    background: ${(props) => props.theme.colors.green};
+  }
+`
+
+const PlusButton = styled.img``
+
+export default {
+  name: 'add-new-button',
+  components: {
+    PageContainer,
+    ButtonContainer,
+    PlusButton,
+    PlusButtonSvg
+  },
+  props: {
+    shouldPosition: {
+      required: false,
+      default: true
+    },
+    dataId: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>

package/src/components/banner/actionBanner/index.vue

@@ -1,65 +1,65 @@
-<template>
-  <Modal :is-open="isOpen" @on-close="closeModal">
-    <modalContainer>
-      <modalTitle v-if="$slots.title">
-        <slot name="title"></slot>
-      </modalTitle>
-      <textContainer v-if="$slots.body">
-        <slot name="body"></slot>
-      </textContainer>
-      <buttonContainer v-if="$slots.buttons">
-        <slot name="buttons"></slot>
-      </buttonContainer>
-    </modalContainer>
-  </Modal>
-</template>
-<script>
-import styled from 'vue3-styled-components'
-import { mapActions, mapState } from 'vuex'
-import Modal from '../modal'
-const modalContainer = styled.div`
-  width: 450px;
-  min-height: 205px;
-  padding: 40px 40px 30px 40px;
-`
-const modalTitle = styled.div`
-  color: ${(props) => props.theme.colors.black};
-  font-family: ${(props) => props.theme.fonts.mainFont};
-  font-size: 18px;
-  font-style: normal;
-  font-weight: 700;
-  line-height: 120%;
-  text-transform: uppercase;
-`
-const buttonContainer = styled.div`
-  display: inline-flex;
-  align-items: flex-start;
-  gap: 20px;
-`
-const textContainer = styled.div`
-  color: ${(props) => props.theme.colors.black};
-  font-family: ${(props) => props.theme.fonts.mainFont};
-  font-size: 13px;
-  font-style: normal;
-  font-weight: 400;
-  line-height: normal;
-  padding: 30px 0px;
-  white-space: pre-wrap;
-`
-export default {
-  name: 'actionModal',
-  props: ['isOpen'],
-  components: {
-    Modal,
-    modalContainer,
-    modalTitle,
-    buttonContainer,
-    textContainer
-  },
-  methods: {
-    closeModal() {
-      this.$emit('on-close')
-    }
-  }
-}
-</script>
+<template>
+  <Modal :is-open="isOpen" @on-close="closeModal">
+    <modalContainer>
+      <modalTitle v-if="$slots.title">
+        <slot name="title"></slot>
+      </modalTitle>
+      <textContainer v-if="$slots.body">
+        <slot name="body"></slot>
+      </textContainer>
+      <buttonContainer v-if="$slots.buttons">
+        <slot name="buttons"></slot>
+      </buttonContainer>
+    </modalContainer>
+  </Modal>
+</template>
+<script>
+import styled from 'vue3-styled-components'
+import { mapActions, mapState } from 'vuex'
+import Modal from '../modal'
+const modalContainer = styled.div`
+  width: 450px;
+  min-height: 205px;
+  padding: 40px 40px 30px 40px;
+`
+const modalTitle = styled.div`
+  color: ${(props) => props.theme.colors.black};
+  font-family: ${(props) => props.theme.fonts.mainFont};
+  font-size: 18px;
+  font-style: normal;
+  font-weight: 700;
+  line-height: 120%;
+  text-transform: uppercase;
+`
+const buttonContainer = styled.div`
+  display: inline-flex;
+  align-items: flex-start;
+  gap: 20px;
+`
+const textContainer = styled.div`
+  color: ${(props) => props.theme.colors.black};
+  font-family: ${(props) => props.theme.fonts.mainFont};
+  font-size: 13px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+  padding: 30px 0px;
+  white-space: pre-wrap;
+`
+export default {
+  name: 'actionModal',
+  props: ['isOpen'],
+  components: {
+    Modal,
+    modalContainer,
+    modalTitle,
+    buttonContainer,
+    textContainer
+  },
+  methods: {
+    closeModal() {
+      this.$emit('on-close')
+    }
+  }
+}
+</script>

package/src/components/banner/banner/banner.stories.js

@@ -1,31 +1,31 @@
-import Modal from "./index.vue";
-
-export default {
-  title: "Modal",
-  component: Modal,
-  // argTypes: {},
-};
-
-const Template = (args, { argTypes }) => ({
-  // Components used in your story `template` are defined in the `components` object
-  components: { Modal },
-  // The story's `args` need to be mapped into the template through the `setup()` method
-  props: Object.keys(argTypes),
-  template: '<modal v-bind="$props" />',
-
-  // import Modal from "@eturnity/eturnity_reusable_components/src/components/modals/modal"
-  // This is a more flexible modal box, where the parent can decide how the body of the modal looks
-  // To use:
-  // <modal :isOpen="isOpen" @on-close="$emit('on-close-summary')" :preventOutsideClose="true" :isLoading="true" :hideClose="true">
-  //   <div>Data....</div>
-  // </modal>
-});
-
-export const Default = Template.bind({
-  isOpen: true,
-  preventOutsideClose: true,
-  isLoading: false,
-  hideClose: false,
-  backdrop: 'dark',
-})
-Default.args = {};
+import Modal from "./index.vue";
+
+export default {
+  title: "Modal",
+  component: Modal,
+  // argTypes: {},
+};
+
+const Template = (args, { argTypes }) => ({
+  // Components used in your story `template` are defined in the `components` object
+  components: { Modal },
+  // The story's `args` need to be mapped into the template through the `setup()` method
+  props: Object.keys(argTypes),
+  template: '<modal v-bind="$props" />',
+
+  // import Modal from "@eturnity/eturnity_reusable_components/src/components/modals/modal"
+  // This is a more flexible modal box, where the parent can decide how the body of the modal looks
+  // To use:
+  // <modal :isOpen="isOpen" @on-close="$emit('on-close-summary')" :preventOutsideClose="true" :isLoading="true" :hideClose="true">
+  //   <div>Data....</div>
+  // </modal>
+});
+
+export const Default = Template.bind({
+  isOpen: true,
+  preventOutsideClose: true,
+  isLoading: false,
+  hideClose: false,
+  backdrop: 'dark',
+})
+Default.args = {};