From 490e867e0d3e420afb1a2cf051593f42d0eaa21a Mon Sep 17 00:00:00 2001
From: Kelani Tolulope <kelanik8@gmail.com>
Date: Mon, 3 Apr 2023 13:12:52 +0100
Subject: [PATCH] Fix long page title to truncate text to prevent cut off

---
 lib/vue/src/components/navigation/CTopbar.vue | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/lib/vue/src/components/navigation/CTopbar.vue b/lib/vue/src/components/navigation/CTopbar.vue
index e183b9cf2..da1f4025a 100644
--- a/lib/vue/src/components/navigation/CTopbar.vue
+++ b/lib/vue/src/components/navigation/CTopbar.vue
@@ -8,7 +8,7 @@
     />
 
     <h2
-      class="d-none d-sm-inline-block text-truncate mb-0"
+      class="d-none d-sm-inline-block text-truncate title mb-0"
     >
       <slot name="title" />
     </h2>
@@ -289,6 +289,12 @@ $nav-user-icon-size: 50px;
   padding-left: calc(3.5rem + 6px);
 }
 
+.header-navigation .title > * {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .topbar-dropdown-menu {
   max-height: 80vh;
   overflow-y: auto;