Mirrors/Radarr
1
0
Fork 0
mirror of https://github.com/Radarr/Radarr.git synced 2024-09-17 15:02:34 +02:00
Code Issues Releases Wiki Activity

Fixed: Issue with link/tags icon to drop a line on movie details mobile (#4667)

Browse Source 
#4523
This commit is contained in:
nitsua 2020-08-01 02:47:34 -04:00 committed by GitHub
parent ff7e929387
commit c07b370569
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 26 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/Components/HeartRating.js
View File

@ -4,14 +4,17 @@ import Icon from 'Components/Icon';
import { icons } from 'Helpers/Props'; import { icons } from 'Helpers/Props';
import styles from './HeartRating.css'; import styles from './HeartRating.css';
function HeartRating({ rating, iconSize }) { function HeartRating({ rating, iconSize, hideHeart }) {
return ( return (
<span> <span>
<Icon {
className={styles.heart} !hideHeart &&
name={icons.HEART} <Icon
size={iconSize} className={styles.heart}
/> name={icons.HEART}
size={iconSize}
/>
}
{rating * 10}% {rating * 10}%
</span> </span>
@ -20,7 +23,8 @@ function HeartRating({ rating, iconSize }) {
HeartRating.propTypes = { HeartRating.propTypes = {
rating: PropTypes.number.isRequired, rating: PropTypes.number.isRequired,
iconSize: PropTypes.number.isRequired iconSize: PropTypes.number.isRequired,
hideHeart: PropTypes.bool
}; };
HeartRating.defaultProps = { HeartRating.defaultProps = {

9
frontend/src/Movie/Details/MovieDetails.css
View File

@ -206,4 +206,13 @@
.movieNavigationButtons { .movieNavigationButtons {
display: none; display: none;
} }
.certification,
.links,
.tags,
.rating,
.year,
.runtime {
margin-right: 10px;
}
} }

5
frontend/src/Movie/Details/MovieDetails.js
View File

@ -1,4 +1,5 @@
import _ from 'lodash'; import _ from 'lodash';
import moment from 'moment';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Tab, TabList, TabPanel, Tabs } from 'react-tabs'; import { Tab, TabList, TabPanel, Tabs } from 'react-tabs';
@ -280,6 +281,7 @@ class MovieDetails extends Component {
} = this.state; } = this.state;
const marqueeWidth = isSmallScreen ? titleWidth : (titleWidth - 150); const marqueeWidth = isSmallScreen ? titleWidth : (titleWidth - 150);
const friendlyRuntime = moment.utc((runtime * 60) * 1000).format('h[h] m[m]');
return ( return (
<PageContent title={title}> <PageContent title={title}>
@ -424,7 +426,7 @@ class MovieDetails extends Component {
{ {
!!runtime && !!runtime &&
<span className={styles.runtime}> <span className={styles.runtime}>
{runtime} Minutes {friendlyRuntime}
</span> </span>
} }
@ -434,6 +436,7 @@ class MovieDetails extends Component {
<HeartRating <HeartRating
rating={ratings.value} rating={ratings.value}
iconSize={20} iconSize={20}
hideHeart={isSmallScreen}
/> />
</span> </span>
} }

2
frontend/src/MovieFile/Editor/MovieFileEditorRow.js
View File

@ -238,7 +238,7 @@ MovieFileEditorRow.propTypes = {
customFormats: PropTypes.arrayOf(PropTypes.object).isRequired, customFormats: PropTypes.arrayOf(PropTypes.object).isRequired,
qualityCutoffNotMet: PropTypes.bool.isRequired, qualityCutoffNotMet: PropTypes.bool.isRequired,
languages: PropTypes.arrayOf(PropTypes.object).isRequired, languages: PropTypes.arrayOf(PropTypes.object).isRequired,
mediaInfo: PropTypes.object.isRequired, mediaInfo: PropTypes.object,
onDeletePress: PropTypes.func.isRequired onDeletePress: PropTypes.func.isRequired
}; };

2
frontend/src/MovieFile/FileDetailsModal.js
View File

@ -47,7 +47,7 @@ function FileDetailsModal(props) {
FileDetailsModal.propTypes = { FileDetailsModal.propTypes = {
isOpen: PropTypes.bool.isRequired, isOpen: PropTypes.bool.isRequired,
onModalClose: PropTypes.func.isRequired, onModalClose: PropTypes.func.isRequired,
mediaInfo: PropTypes.object.isRequired mediaInfo: PropTypes.object
}; };
export default FileDetailsModal; export default FileDetailsModal;