diff --git a/src/components/EntityList.scss b/src/components/EntityList.scss index 10e8b1b..e371e86 100644 --- a/src/components/EntityList.scss +++ b/src/components/EntityList.scss @@ -77,7 +77,7 @@ ul.entity-list { justify-content: space-between; .entity-item { - padding-bottom: .5em; + padding-bottom: .75em; a { .cover { width: 250px; @@ -88,16 +88,14 @@ ul.entity-list { display: flex; flex-direction: column; - .title { + .title, .subtitle { max-width: 250px; + width: max-content; display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } - - .subtitle { - } } } } @@ -129,13 +127,15 @@ ul.entity-list { // Highligth Grid .entity-list.grid{ .entity-item { - .body .title:after { - display: block; - content: ''; - border-bottom: solid var(--line-width) var(--accent); - transition: width 300ms ease-in; - width: 0; - margin-top: -5px; + .body{ + .title:after, .subtitle:after { + display: block; + content: ''; + border-bottom: solid var(--line-width) var(--accent); + transition: width 300ms ease-in; + width: 0; + margin-top: -5px; + } } .cover { @@ -148,8 +148,10 @@ ul.entity-list { outline: 6px var(--accent) solid; outline-offset: -6px; } - .body .title:after { - width: 100%; + .body{ + .title:after, .subtitle:after { + width: 100%; + } } } }