@eturnity/eturnity_reusable_components 6.46.5-EPDM-7690-9162.0 → 6.46.5-EPDM-8599.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eturnity/eturnity_reusable_components",
-  "version": "6.46.5-EPDM-7690-9162.0",
+  "version": "6.46.5-EPDM-8599.0",
   "private": false,
   "scripts": {
     "dev": "vue-cli-service serve",

package/src/App.vue

@@ -114,6 +114,7 @@ import iconCollection from '@/components/icon/iconCollection'
 import dropdownComponent from '@/components/dropdown'
 import videoThumbnail from '@/components/videoThumbnail'
 import icon from '@/components/icon'
+import infoCard from '@/components/infoCard'
 // import TableDropdown from "@/components/tableDropdown"
 
 const PageContainer = styled.div`
@@ -138,7 +139,8 @@ export default {
     iconCollection,
     dropdownComponent,
     videoThumbnail,
-    icon
+    icon,
+    infoCard
   },
   data() {
     return {

package/src/components/infoCard/index.vue

@@ -0,0 +1,38 @@
+<template>
+    <info-container>
+            <icon name="info" size="24px" />
+      <InfoTextContainer>
+        <slot />
+      </InfoTextContainer>
+    </info-container>
+</template>
+    
+<script>
+import styled from 'vue-styled-components'
+import icon from '../icon'
+const InfoContainer = styled('div')`
+  display: flex;
+  align-items: flex-start;
+  gap: 15px;
+  padding: 20px;
+  width: 500px;
+  min-width: 450px;
+  border: 1px dashed #dee2eb;
+  border-radius: 4px;
+  margin:20px 0;
+`
+
+const InfoTextContainer = styled('div')`
+  font-size: 13px;
+`
+
+
+export default {
+    components:{
+        icon,
+        InfoTextContainer,
+        InfoContainer
+    },
+    props:[]
+}
+</script>

package/src/components/projectMarker/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <page-container>
+  <page-container :withDate="!!date">
     <marker-container
       v-if="markerData"
       :backgroundColor="markerData.color"
@@ -19,12 +19,7 @@
         size="10px"
         :cursor="cursor"
       />
-      <span>
-        {{ markerData.translations[activeLanguage].name }}
-        <span v-if="!!date">
-          | {{ date }}
-        </span>
-      </span>
+      <span>{{ markerData.translations[activeLanguage].name }}</span>
       <dot-wrapper
         v-if="editionAllowed"
         class="dotContainer"
@@ -52,6 +47,9 @@
         </edit-item>
       </edit-container>
     </marker-container>
+    <date v-if="!!date">
+      {{ date }}
+    </date>
     <modal
       :isOpen="deleteModalOpened"
       @on-close="closeDeleteModal"
@@ -98,7 +96,10 @@ import DeleteIcon from '../deleteIcon'
 import PageSubtitle from '../pageSubtitle'
 import MainButton from '../buttons/mainButton'
 
-const PageContainer = styled.div`
+const PageContainerAttrs = {
+  withDate: Boolean
+}
+const PageContainer = styled('div', PageContainerAttrs)`
   display: flex;
   align-items: center;
   gap: 10px;
@@ -193,6 +194,8 @@ const IconContainer = styled.div`
   line-height: 0;
 `
 
+const Date = styled.div``
+
 export default {
   name: "project-marker",
   components: {
@@ -210,7 +213,8 @@ export default {
     CtaContainer,
     PageTitle,
     PageSubtitle,
-    MainButton
+    MainButton,
+    Date
   },
   props: {
     markerData: {

package/src/components/threeDots/index.vue

@@ -331,7 +331,7 @@ export default {
     },
     findRelativeParent(element) {
       while (element.parentElement) {
-        if (window.getComputedStyle(element.parentElement).position === 'relative' || window.getComputedStyle(element.parentElement).position === 'absolute') {
+        if (window.getComputedStyle(element.parentElement).position === 'relative') {
           return element.parentElement
         }
         element = element.parentElement