From 9d9bd6d5bb9b41b168e3e34008b82634cfa9a6c7 Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Tue, 15 Mar 2022 20:08:10 +1100
Subject: Enable ellipsis for long header names

---
 src/components/Tile.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

(limited to 'src/components')

diff --git a/src/components/Tile.vue b/src/components/Tile.vue
index e636cfc..3cedb3d 100644
--- a/src/components/Tile.vue
+++ b/src/components/Tile.vue
@@ -63,7 +63,8 @@ export default defineComponent({
 			v-if="(layoutNode.showHeader && !layoutNode.sepSweptArea) ||
 				(layoutNode.sepSweptArea && layoutNode.sepSweptArea.sweptLeft)"
 			:style="{height: headerSz+'px'}"
-			class="text-center hover:cursor-pointer bg-stone-300" @click="onHeaderClick">
+			class="text-center overflow-hidden text-ellipsis hover:cursor-pointer bg-stone-300"
+			@click="onHeaderClick">
 			{{layoutNode.tolNode.name}}
 		</div>
 		<div v-if="layoutNode.sepSweptArea"
@@ -76,7 +77,8 @@ export default defineComponent({
 				transitionDuration: transitionDuration+'ms'}"
 			class="transition-[left,top,width,height] ease-out border border-stone-900 bg-white">
 			<div v-if="!layoutNode.sepSweptArea.sweptLeft" :style="{height: headerSz+'px'}"
-				class="text-center hover:cursor-pointer bg-stone-300" @click="onHeaderClick">
+				class="text-center overflow-hidden text-ellipsis hover:cursor-pointer bg-stone-300"
+				@click="onHeaderClick">
 				{{layoutNode.tolNode.name}}
 			</div>
 		</div>
-- 
cgit v1.2.3