Merge pull request #49 from jesusantguerrero/v1.11.0

fix tailwind build styles

package.json

@@ -24,7 +24,7 @@
     "vue-draggable-next": "^2.0.1",
     "vue-final-modal": "^1.8.5",
     "vue-router": "^4.0.3",
-    "vue-temporal-components": "^0.1.3"
+    "vue-temporal-components": "^0.1.5"
   },
   "devDependencies": {
     "@tailwindcss/typography": "^0.4.0",

src/components/organisms/MatrixBoard.vue

@@ -97,7 +97,19 @@
         @task-clicked="setTaskToEdit"
         focused-text-class="text-green-500"
         marker-bg-class="bg-green-400"
-      /> 
+      >
+        <template v-slot:description="{focusedTextClass, item: task, differenceInCalendarDays: days}">
+           <div class="mx-2 text-left h-full flex items-center">
+            <span class="capitalize text-gray-400" :class="state.quadrants[task.matrix].color">
+              {{ task.matrix}}:
+            </span>
+               {{ task.title }} 
+              <span class="text-sm font-bold ml-2" :class="focusedTextClass">
+                {{ days }} days
+              </span>
+            </div>
+        </template>
+      </roadmap-view> 
     </div>
 
     <task-modal 
@@ -114,7 +126,6 @@
 import { computed, defineProps, reactive, watch, ref, onUnmounted } from 'vue'
 import { ElMessageBox, ElNotification } from 'element-plus';
 import { RoadmapView } from "vue-temporal-components";
-import "vue-temporal-components/dist/vue-temporal-components.css";
 import { useTaskFirestore } from "../../utils/useTaskFirestore"
 import { useDateTime } from "../../utils/useDateTime"
 import TaskGroup from "../organisms/TaskGroup.vue"

src/main.js

@@ -1,5 +1,6 @@
 import { createApp } from 'vue'
 import App from './App.vue'
+import "vue-temporal-components/dist/vue-temporal-components.css";
 import "./assets/scss/main.scss";
 import ElementPlus from 'element-plus'
 import 'element-plus/lib/theme-chalk/index.css'