wip: Provide a new TimeLine component #909

kalisio · Aug 20, 2024 · c4613ff · c4613ff
1 parent 2690c61
commit c4613ff
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/core/client/components/collection/KTimeLine.vue b/core/client/components/collection/KTimeLine.vue
@@ -185,6 +185,10 @@ const props = defineProps({
     type: Function,
     default: undefined
   },
+  sideWidth: {
+    type: Number,
+    default: 20
+  },
   header: {
     type: [Array, Object],
     default: () => null
@@ -221,6 +225,9 @@ const bodyRendererClass = computed(() => {
 const layout = computed(() => {
   return $q.screen.lt.md ? 'dense' : 'comfortable'
 })
+const comfortSize = computed(() => {
+  return `${props.sideWidth}%`
+})
 
 // Watch
 watch(items, onCollectionRefreshed)
@@ -304,10 +311,10 @@ onBeforeUnmount(() => {
   width: 100%;
 }
 .q-timeline--comfortable .q-timeline__subtitle {
-  width: 15%;
+  width: v-bind(comfortSize);
 }
 .q-timeline--comfortable .q-timeline__content {
   padding-bottom: 16px;
-  width: 85%;
+  width: calc(100% - v-bind(comfortSize));
 }
 </style>