From b16e0cf2484e482105f236f5f3155e467cf71a2f Mon Sep 17 00:00:00 2001 From: Ms Kimsible <1877318+kimsible@users.noreply.github.com> Date: Wed, 8 Sep 2021 10:12:38 +0200 Subject: Fix broken delete buttons of admin federation lists (#4378) * Add ellipsis on my-delete button of federation admin * Add ellipsis on button label to define (max-)width on host component Co-authored-by: Ms Kimsible --- client/src/app/shared/shared-main/buttons/button.component.scss | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'client/src/app/shared') diff --git a/client/src/app/shared/shared-main/buttons/button.component.scss b/client/src/app/shared/shared-main/buttons/button.component.scss index e74ba0221..c782ac3ef 100644 --- a/client/src/app/shared/shared-main/buttons/button.component.scss +++ b/client/src/app/shared/shared-main/buttons/button.component.scss @@ -13,6 +13,7 @@ :host { outline: none; + display: inline-block; } my-small-loader ::ng-deep .root { @@ -31,6 +32,8 @@ span[class$=-button] { .action-button { @include peertube-button-link; @include button-with-icon(21px); + + width: 100%; // useful for ellipsis, allow to define a max-width on host component } .orange-button { @@ -53,6 +56,10 @@ span[class$=-button] { @include grey-button; } +.button-label { + @include ellipsis; +} + // In a table, try to minimize the space taken by this button @media screen and (max-width: 1400px) { :host-context(td) { -- cgit v1.2.3