|
|
@ -1,6 +1,8 @@
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import React from 'react';
|
|
|
|
import React from 'react';
|
|
|
|
|
|
|
|
import classNames from 'classnames';
|
|
|
|
import formatBytes from 'Utilities/Number/formatBytes';
|
|
|
|
import formatBytes from 'Utilities/Number/formatBytes';
|
|
|
|
|
|
|
|
import { ColorImpairedConsumer } from 'App/ColorImpairedContext';
|
|
|
|
import DescriptionList from 'Components/DescriptionList/DescriptionList';
|
|
|
|
import DescriptionList from 'Components/DescriptionList/DescriptionList';
|
|
|
|
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
|
|
|
|
import DescriptionListItem from 'Components/DescriptionList/DescriptionListItem';
|
|
|
|
import styles from './SeriesIndexFooter.css';
|
|
|
|
import styles from './SeriesIndexFooter.css';
|
|
|
@ -39,26 +41,49 @@ function SeriesIndexFooter({ series }) {
|
|
|
|
totalFileSize += sizeOnDisk;
|
|
|
|
totalFileSize += sizeOnDisk;
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
|
|
<ColorImpairedConsumer>
|
|
|
|
|
|
|
|
{(enableColorImpairedMode) => {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<div className={styles.footer}>
|
|
|
|
<div className={styles.footer}>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.continuing} />
|
|
|
|
<div
|
|
|
|
|
|
|
|
className={classNames(
|
|
|
|
|
|
|
|
styles.continuing,
|
|
|
|
|
|
|
|
enableColorImpairedMode && 'colorImpaired'
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
/>
|
|
|
|
<div>Continuing (All episodes downloaded)</div>
|
|
|
|
<div>Continuing (All episodes downloaded)</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.ended} />
|
|
|
|
<div
|
|
|
|
|
|
|
|
className={classNames(
|
|
|
|
|
|
|
|
styles.ended,
|
|
|
|
|
|
|
|
enableColorImpairedMode && 'colorImpaired'
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
/>
|
|
|
|
<div>Ended (All episodes downloaded)</div>
|
|
|
|
<div>Ended (All episodes downloaded)</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.missingMonitored} />
|
|
|
|
<div
|
|
|
|
|
|
|
|
className={classNames(
|
|
|
|
|
|
|
|
styles.missingMonitored,
|
|
|
|
|
|
|
|
enableColorImpairedMode && 'colorImpaired'
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
/>
|
|
|
|
<div>Missing Episodes (Series monitored)</div>
|
|
|
|
<div>Missing Episodes (Series monitored)</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.legendItem}>
|
|
|
|
<div className={styles.missingUnmonitored} />
|
|
|
|
<div
|
|
|
|
|
|
|
|
className={classNames(
|
|
|
|
|
|
|
|
styles.missingUnmonitored,
|
|
|
|
|
|
|
|
enableColorImpairedMode && 'colorImpaired'
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
/>
|
|
|
|
<div>Missing Episodes (Series not monitored)</div>
|
|
|
|
<div>Missing Episodes (Series not monitored)</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
@ -114,6 +139,9 @@ function SeriesIndexFooter({ series }) {
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
);
|
|
|
|
|
|
|
|
}}
|
|
|
|
|
|
|
|
</ColorImpairedConsumer>
|
|
|
|
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
SeriesIndexFooter.propTypes = {
|
|
|
|
SeriesIndexFooter.propTypes = {
|
|
|
|