1
0
mirror of https://github.com/Radarr/Radarr.git synced 2024-08-18 00:09:37 +02:00

Fixed: Legend and Colors on calendar

Fixed: Streamline Legend in Index and Calendar
Fixed: Broken Translations
This commit is contained in:
bakerboy448 2020-11-25 08:32:39 -06:00 committed by Qstick
parent 6d011cdc48
commit 0366029269
6 changed files with 106 additions and 56 deletions

View File

@ -73,14 +73,14 @@ function AppUpdatedModalContent(props) {
<Button
onPress={onSeeChangesPress}
>
translate('RecentChanges')
{translate('RecentChanges')}
</Button>
<Button
kind={kinds.PRIMARY}
onPress={onModalClose}
>
translate('Reload')
{translate('Reload')}
</Button>
</ModalFooter>
</ModalContent>

View File

@ -29,32 +29,45 @@ function Legend(props) {
<div className={styles.legend}>
<div>
<LegendItem
status={translate('Unreleased')}
tooltip={translate('MovieHasntReleasedYet')}
style='ended'
name={translate('DownloadedAndMonitored')}
colorImpairedMode={colorImpairedMode}
/>
<LegendItem
status={translate('Unmonitored')}
tooltip={translate('MovieIsUnmonitored')}
style='availNotMonitored'
name={translate('DownloadedButNotMonitored')}
colorImpairedMode={colorImpairedMode}
/>
</div>
<div>
<LegendItem
status={translate('Downloading')}
tooltip={translate('MovieIsDownloading')}
style='missingMonitored'
name={translate('MissingMonitoredAndConsideredAvailable')}
colorImpairedMode={colorImpairedMode}
/>
<LegendItem
status={translate('Downloaded')}
tooltip={translate('MovieWasDownloadedAndSorted')}
style='missingUnmonitored'
name={translate('MissingNotMonitored')}
colorImpairedMode={colorImpairedMode}
/>
</div>
<div>
<LegendItem
style='queue'
name={translate('Queued')}
colorImpairedMode={colorImpairedMode}
/>
<LegendItem
style='continuing'
name={translate('Unreleased')}
colorImpairedMode={colorImpairedMode}
/>
</div>
{
iconsToShow.length > 0 &&
<div>

View File

@ -1,8 +1,5 @@
.legendIconItem {
margin: 3px 0;
margin-right: 6px;
width: 150px;
cursor: default;
margin-left: 6px;
}
.icon {

View File

@ -1,33 +1,74 @@
.legendItemContainer {
margin-right: 5px;
width: 220px;
}
.legendItem {
margin: 3px 0;
margin-right: 6px;
padding-left: 5px;
width: 150px;
border-left-width: 4px;
border-left-style: solid;
cursor: default;
display: inline-flex;
margin-top: -1px;
vertical-align: middle;
line-height: 16px;
}
/*
* Status
*/
.downloaded {
composes: downloaded from '~Calendar/Events/CalendarEvent.css';
.legendItemColor {
margin-right: 8px;
width: 30px;
height: 16px;
border-radius: 4px;
}
.downloading {
composes: downloading from '~Calendar/Events/CalendarEvent.css';
.queue {
composes: legendItemColor;
background-color: $queueColor;
}
.unmonitored {
composes: unmonitored from '~Calendar/Events/CalendarEvent.css';
.continuing {
composes: legendItemColor;
background-color: $primaryColor;
}
.missing {
composes: missing from '~Calendar/Events/CalendarEvent.css';
.availNotMonitored {
composes: legendItemColor;
background-color: $darkGray;
}
.unreleased {
composes: unreleased from '~Calendar/Events/CalendarEvent.css';
.ended {
composes: legendItemColor;
background-color: $successColor;
}
.missingMonitored {
composes: legendItemColor;
background-color: $dangerColor;
&:global(.colorImpaired) {
background: repeating-linear-gradient(90deg, color($dangerColor shade(5%)), color($dangerColor shade(5%)) 5px, color($dangerColor shade(15%)) 5px, color($dangerColor shade(15%)) 10px);
}
}
.missingUnmonitored {
composes: legendItemColor;
background-color: $warningColor;
&:global(.colorImpaired) {
background: repeating-linear-gradient(45deg, $warningColor, $warningColor 5px, color($warningColor tint(15%)) 5px, color($warningColor tint(15%)) 10px);
}
}
.missingMonitoredColorImpaired {
background: repeating-linear-gradient(90deg, $colorImpairedGradientDark, $colorImpairedGradientDark 5px, $colorImpairedGradient 5px, $colorImpairedGradient 10px);
}
.missingUnmonitoredColorImpaired {
background: repeating-linear-gradient(45deg, $colorImpairedGradientDark, $colorImpairedGradientDark 5px, $colorImpairedGradient 5px, $colorImpairedGradient 10px);
}
.legendItemText {
display: inline-block;
}

View File

@ -1,35 +1,34 @@
import classNames from 'classnames';
import PropTypes from 'prop-types';
import React from 'react';
import titleCase from 'Utilities/String/titleCase';
import styles from './LegendItem.css';
function LegendItem(props) {
const {
name,
status,
tooltip,
style,
colorImpairedMode
} = props;
return (
<div
className={classNames(
styles.legendItem,
styles[status],
colorImpairedMode && 'colorImpaired'
)}
title={tooltip}
>
{name ? name : titleCase(status)}
<div className={styles.legendItemContainer}>
<div
className={classNames(
styles.legendItem,
styles[style],
colorImpairedMode && 'colorImpaired'
)}
/>
<div className={classNames(styles.legendItemText, colorImpairedMode && styles[`${style}ColorImpaired`])}>
{name}
</div>
</div>
);
}
LegendItem.propTypes = {
name: PropTypes.string,
status: PropTypes.string.isRequired,
tooltip: PropTypes.string.isRequired,
name: PropTypes.string.isRequired,
style: PropTypes.string.isRequired,
colorImpairedMode: PropTypes.bool.isRequired
};

View File

@ -244,8 +244,8 @@
"DownloadClientStatusCheckSingleClientMessage": "Download clients unavailable due to failures: {0}",
"DownloadClientUnavailable": "Download client is unavailable",
"Downloaded": "Downloaded",
"DownloadedAndMonitored": "Downloaded and Monitored",
"DownloadedButNotMonitored": "Downloaded, but not Monitored",
"DownloadedAndMonitored": "Downloaded (Monitored)",
"DownloadedButNotMonitored": "Downloaded (Unmonitored)",
"DownloadFailed": "Download failed",
"DownloadFailedCheckDownloadClientForMoreDetails": "Download failed: check download client for more details",
"DownloadFailedInterp": "Download failed: {0}",
@ -468,7 +468,7 @@
"LookingForReleaseProfiles1": "Looking for Release Profiles? Try",
"LookingForReleaseProfiles2": "instead.",
"LowerCase": "Lower Case",
"MaintenanceRelease": "Maintenance release: bug fixes and other improvements. See Github Commmit History for more details",
"MaintenanceRelease": "Maintenance Release: bug fixes and other improvements. See Github Commit History for more details",
"Manual": "Manual",
"ManualImport": "Manual Import",
"ManualImportSelectLanguage": "Manual Import - Select Language",
@ -511,8 +511,8 @@
"MinutesSixty": "60 Minutes: {0}",
"Missing": "Missing",
"MissingFromDisk": "Radarr was unable to find the file on disk so it was removed",
"MissingMonitoredAndConsideredAvailable": "Missing, Monitored and considered Available",
"MissingNotMonitored": "Missing, not Monitored",
"MissingMonitoredAndConsideredAvailable": "Missing (Monitored)",
"MissingNotMonitored": "Missing (Unmonitored)",
"Mode": "Mode",
"Monday": "Monday",
"Monitor": "Monitor",
@ -1006,7 +1006,7 @@
"UnmappedFolders": "Unmapped Folders",
"Unmonitored": "Unmonitored",
"UnmonitoredHelpText": "Include unmonitored movies in the iCal feed",
"Unreleased": "Unreleased",
"Unreleased": "Unavailable",
"UnsavedChanges": "Unsaved Changes",
"UnselectAll": "Unselect All",
"UpdateAll": "Update All",