teams: smoother list titles (fixes #8028) (#8029)

Co-authored-by: dogi <[email protected]>
open-learning-exchange · Jan 7, 2025 · b8681b7 · b8681b7
1 parent c6797c0
commit b8681b7
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "planet",
   "license": "AGPL-3.0",
-  "version": "0.16.36",
+  "version": "0.16.37",
   "myplanet": {
     "latest": "v0.21.74",
     "min": "v0.20.74"

diff --git a/src/app/teams/teams.component.html b/src/app/teams/teams.component.html
@@ -43,8 +43,8 @@
       <ng-container matColumnDef="doc.name">
         <mat-header-cell *matHeaderCellDef mat-sort-header="doc.name" i18n>Name</mat-header-cell>
         <mat-cell *matCellDef="let element">
-          <h3>
-            {{element.doc.name}}
+          <h3 class="team-name">
+            {{element.doc.name.length > 200 ? element.doc.name.slice(0, 200) + '...': element.doc.name }}
             <mat-icon class="margin-lr-3" i18n-title title="{{ mode === 'enterprise' ? 'Joined Enterprise' : 'Joined Team' }}" [inline]="true" *ngIf="element.userStatus=='member'">check</mat-icon>
           </h3>
         </mat-cell>

diff --git a/src/app/teams/teams.scss b/src/app/teams/teams.scss
@@ -26,6 +26,11 @@
     justify-content: center;
   }
 
+  .team-name{
+    max-width: 95%;
+    overflow: hidden;
+  }
+
   @media screen and (max-width: #{$screen-sm}) {
     mat-cell button {
       min-width: 0;