mirror/Lidarr
1
0
Fork 0
mirror of https://github.com/Lidarr/Lidarr.git synced 2026-02-11 08:18:58 -06:00
Code Issues Packages Projects Releases Wiki Activity

Fixed: Scroll long overviews for artists and albums

Browse Source
This commit is contained in:
Bogdan
2025-08-03 15:48:24 +03:00
committed by bakerboy448
parent 6ac1b4ce38
commit c8a3833e2b
4 changed files with 23 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/Album/Details/AlbumDetails.css
View File

@@ -5,7 +5,6 @@
.header {
position: relative;
width: 100%;
height: 310px;
}
.backdrop {
@@ -30,20 +29,18 @@
width: 100%;
height: 100%;
color: var(--white);
gap: 35px;
}
.cover {
flex-shrink: 0;
margin-right: 35px;
width: 250px;
height: 250px;
}
.info {
display: flex;
flex-direction: column;
flex-grow: 1;
overflow: hidden;
width: 100%;
}
.titleRow {
@@ -59,6 +56,8 @@
}
.title {
overflow: hidden;
max-height: calc(2 * 50px);
font-weight: 300;
font-size: 50px;
line-height: 50px;
@@ -133,8 +132,12 @@
.overview {
flex: 1 0 auto;
overflow-x: auto;
margin-top: 8px;
min-height: 0;
max-height: 150px;
text-wrap: balance;
white-space: pre-wrap;
font-size: $intermediateFontSize;
}
@@ -152,6 +155,7 @@
}
.title {
max-height: calc(3 * 30px);
font-weight: 300;
font-size: 30px;
line-height: 30px;

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

@@ -26,7 +26,6 @@ import Tooltip from 'Components/Tooltip/Tooltip';
import { align, icons, kinds, sizes, tooltipPositions } from 'Helpers/Props';
import OrganizePreviewModalConnector from 'Organize/OrganizePreviewModalConnector';
import RetagPreviewModalConnector from 'Retag/RetagPreviewModalConnector';
import fonts from 'Styles/Variables/fonts';
import TrackFileEditorModal from 'TrackFile/Editor/TrackFileEditorModal';
import formatBytes from 'Utilities/Number/formatBytes';
import translate from 'Utilities/String/translate';
@@ -36,9 +35,6 @@ import AlbumDetailsLinks from './AlbumDetailsLinks';
import AlbumDetailsMediumConnector from './AlbumDetailsMediumConnector';
import styles from './AlbumDetails.css';
const intermediateFontSize = parseInt(fonts.intermediateFontSize);
const lineHeight = parseFloat(fonts.lineHeight);
function getFanartUrl(images) {
return _.find(images, { coverType: 'fanart' })?.url;
}
@@ -544,12 +540,8 @@ class AlbumDetails extends Component {
/>
</div>
<div className={styles.overview} title={overview}>
<TextTruncate
line={Math.floor(125 / (intermediateFontSize * lineHeight))}
text={overview}
/>
</div>
<div className={styles.overview}>{overview}</div>
</div>
</div>
</div>

14
frontend/src/Artist/Details/ArtistDetails.css
View File

@@ -5,7 +5,6 @@
.header {
position: relative;
width: 100%;
height: 310px;
}
.errorMessage {
@@ -36,20 +35,18 @@
width: 100%;
height: 100%;
color: var(--white);
gap: 35px;
}
.poster {
flex-shrink: 0;
margin-right: 35px;
width: 250px;
height: 250px;
}
.info {
display: flex;
flex-direction: column;
flex-grow: 1;
overflow: hidden;
width: 100%;
}
.metadataMessage {
@@ -72,6 +69,8 @@
}
.title {
overflow: hidden;
max-height: calc(2 * 50px);
font-weight: 300;
font-size: 50px;
line-height: 50px;
@@ -144,8 +143,12 @@
.overview {
flex: 1 0 auto;
overflow-x: auto;
margin-top: 8px;
min-height: 0;
max-height: 150px;
text-wrap: balance;
white-space: pre-wrap;
font-size: $intermediateFontSize;
}
@@ -163,6 +166,7 @@
}
.title {
max-height: calc(3 * 30px);
font-weight: 300;
font-size: 30px;
line-height: 30px;

15
frontend/src/Artist/Details/ArtistDetails.js
View File

@@ -1,7 +1,6 @@
import _ from 'lodash';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import TextTruncate from 'react-text-truncate';
import ArtistPoster from 'Artist/ArtistPoster';
import DeleteArtistModal from 'Artist/Delete/DeleteArtistModal';
import EditArtistModalConnector from 'Artist/Edit/EditArtistModalConnector';
@@ -28,7 +27,6 @@ import { align, icons, kinds, sizes, tooltipPositions } from 'Helpers/Props';
import OrganizePreviewModalConnector from 'Organize/OrganizePreviewModalConnector';
import RetagPreviewModalConnector from 'Retag/RetagPreviewModalConnector';
import QualityProfileNameConnector from 'Settings/Profiles/Quality/QualityProfileNameConnector';
import fonts from 'Styles/Variables/fonts';
import TrackFileEditorModal from 'TrackFile/Editor/TrackFileEditorModal';
import formatBytes from 'Utilities/Number/formatBytes';
import translate from 'Utilities/String/translate';
@@ -42,9 +40,6 @@ import ArtistGenres from './ArtistGenres';
import ArtistTagsConnector from './ArtistTagsConnector';
import styles from './ArtistDetails.css';
const defaultFontSize = parseInt(fonts.defaultFontSize);
const lineHeight = parseFloat(fonts.lineHeight);
function getFanartUrl(images) {
return _.find(images, { coverType: 'fanart' })?.url;
}
@@ -394,7 +389,7 @@ class ArtistDetails extends Component {
/>
</div>
<div className={styles.title}>
<div className={styles.title} title={artistName}>
{artistName}
</div>
@@ -595,12 +590,8 @@ class ArtistDetails extends Component {
}
</div>
<div className={styles.overview}>
<TextTruncate
line={Math.floor(125 / (defaultFontSize * lineHeight))}
text={overview}
/>
</div>
<div className={styles.overview}>{overview}</div>
</div>
</div>
</div>