From a926fd020bff85c3fb2e20899b4e70134fc7bb2f Mon Sep 17 00:00:00 2001 From: George Kalpakas Date: Tue, 9 Mar 2021 14:15:48 +0200 Subject: [PATCH] fix(docs-infra): show ellipsis when text overflows in API list items (#41051) Previously, when an API list item's text overflowed its container, it was just hidden. This made it often difficult to realize that there was more text. This commit fixes this by ensuring an ellipsis (`...`) is shown when the text overflows. Before: ![api-list truncated before][1] After: ![api-list truncated after][2] [1]: https://user-images.githubusercontent.com/8604205/109396186-0cd03300-7939-11eb-921c-00621a3889a4.png [2]: https://user-images.githubusercontent.com/8604205/109396187-0e016000-7939-11eb-9f3b-4535be083417.png PR Close #41051 --- aio/src/styles/2-modules/_api-list.scss | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/aio/src/styles/2-modules/_api-list.scss b/aio/src/styles/2-modules/_api-list.scss index ed60612515..9b519d33e5 100644 --- a/aio/src/styles/2-modules/_api-list.scss +++ b/aio/src/styles/2-modules/_api-list.scss @@ -130,13 +130,10 @@ aio-api-list { a { color: $blue-grey-600; - display: inline-block; @include line-height(16); - padding: 0 16px 0; + padding: 0 16px; text-decoration: none; transition: all .3s; - overflow: hidden; - text-overflow: ellipsis; &:hover { background: $blue-grey-50;