mirror
/
Lidarr
mirror of https://github.com/lidarr/Lidarr
1
0
Fork 0
Code Issues Releases Wiki Activity

Fixed: (UI) Improve displaying long album titles

This commit is contained in:
Bogdan 2023-07-13 04:05:28 +03:00
parent 911c147090
commit ddea4eaff9
4 changed files with 17 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/Album/Details/AlbumDetails.js
View File

@ -35,7 +35,7 @@ import AlbumDetailsLinks from './AlbumDetailsLinks';
import AlbumDetailsMediumConnector from './AlbumDetailsMediumConnector';
import styles from './AlbumDetails.css';
const defaultFontSize = parseInt(fonts.defaultFontSize);
const intermediateFontSize = parseInt(fonts.intermediateFontSize);
const lineHeight = parseFloat(fonts.lineHeight);
function getFanartUrl(images) {
@ -358,8 +358,14 @@ class AlbumDetails extends Component {
/>
</div>
<div className={styles.title}>
{title}{disambiguation ? ` (${disambiguation})` : ''}
<div
className={styles.title}
title={disambiguation ? `${title} (${disambiguation})` : title}
>
<TextTruncate
line={2}
text={disambiguation ? `${title} (${disambiguation})` : title}
/>
</div>
</div>
@ -512,9 +518,9 @@ class AlbumDetails extends Component {
/>
</div>
<div className={styles.overview}>
<div className={styles.overview} title={overview}>
<TextTruncate
line={Math.floor(125 / (defaultFontSize * lineHeight))}
line={Math.floor(125 / (intermediateFontSize * lineHeight))}
text={overview}
/>
</div>

2
frontend/src/Artist/Details/AlbumRow.css
View File

@ -1,7 +1,7 @@
.title {
composes: cell from '~Components/Table/Cells/TableRowCell.css';
white-space: nowrap;
word-break: break-word;
}
.monitored {

2
package.json
View File

@ -75,7 +75,7 @@
"react-router-dom": "5.2.0",
"react-slider": "1.1.4",
"react-tabs": "3.2.2",
"react-text-truncate": "0.18.0",
"react-text-truncate": "0.19.0",
"react-virtualized": "9.21.1",
"redux": "4.1.0",
"redux-actions": "2.6.5",

8
yarn.lock
View File

@ -5330,10 +5330,10 @@ react-tabs@3.2.2:
clsx "^1.1.0"
prop-types "^15.5.0"
react-text-truncate@0.18.0:
version "0.18.0"
resolved "https://registry.yarnpkg.com/react-text-truncate/-/react-text-truncate-0.18.0.tgz#c65f4be660d24734badb903a4832467eddcf8058"
integrity sha512-0cc07CRPRPm3cTloVbPicVTSosJNauwVcmJb5FPa71u4KtDVgrRPJoxVvLBubl3gLyx1pVUozgREYMHpHM16jg==
react-text-truncate@0.19.0:
version "0.19.0"
resolved "https://registry.yarnpkg.com/react-text-truncate/-/react-text-truncate-0.19.0.tgz#60bc5ecf29a03ebc256f31f90a2d8402176aac91"
integrity sha512-QxHpZABfGG0Z3WEYbRTZ+rXdZn50Zvp+sWZXgVAd7FCKAMzv/kcwctTpNmWgXDTpAoHhMjOVwmgRtX3x5yeF4w==
dependencies:
prop-types "^15.5.7"