From 284a8256d49e11847b27e827f20630ed6877b07c Mon Sep 17 00:00:00 2001 From: Alf Eaton Date: Tue, 3 Sep 2024 11:24:29 +0100 Subject: [PATCH] Fix tag name overflow in projects list (#20120) GitOrigin-RevId: 9fc317dbebd8115ab8af97f4753350f5ee79c1cd --- .../features/project-list/components/tags-list.tsx | 9 +++------ .../stylesheets/app/project-list-react.less | 14 ++++++++++++++ 2 files changed, 17 insertions(+), 6 deletions(-) diff --git a/services/web/frontend/js/features/project-list/components/tags-list.tsx b/services/web/frontend/js/features/project-list/components/tags-list.tsx index 8e5333d0fa..49a840f6e2 100644 --- a/services/web/frontend/js/features/project-list/components/tags-list.tsx +++ b/services/web/frontend/js/features/project-list/components/tags-list.tsx @@ -78,12 +78,9 @@ function TagsList({ onTagClick, onEditClick }: TagsListProps) { style={{ verticalAlign: 'sub' }} /> - - {tag.name}{' '} - - {' '} - ({tag.project_ids?.length}) - + + {tag.name} + ({tag.project_ids?.length}) diff --git a/services/web/frontend/stylesheets/app/project-list-react.less b/services/web/frontend/stylesheets/app/project-list-react.less index a49b4cd612..aa70b2ac8c 100644 --- a/services/web/frontend/stylesheets/app/project-list-react.less +++ b/services/web/frontend/stylesheets/app/project-list-react.less @@ -714,6 +714,7 @@ & + .projects-dropdown-menu { min-width: 226px; + max-width: 92vw; } } @@ -814,6 +815,7 @@ .menu-item-button { position: relative; width: 100%; + overflow: hidden; border: none; box-shadow: none; background: inherit; @@ -822,6 +824,18 @@ .menu-item-button-text { padding-left: 14px; + overflow: hidden; + + .tag-name-and-size { + overflow: hidden; + display: flex; + gap: 1ex; + } + + .tag-name { + overflow: hidden; + text-overflow: ellipsis; + } } .menu-item-button-icon {