mirror of
https://github.com/Radarr/Radarr.git
synced 2024-09-11 20:12:41 +02:00
Fixed: Managing display profiles on mobile
Fixes #5761 (cherry picked from commit c2fcdb445776d3898be7938216cf8ace65a1a236)
This commit is contained in:
parent
4dc67c027b
commit
2b7a383886
@ -1,3 +1,7 @@
|
|||||||
|
.horizontalScroll {
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
.delayProfiles {
|
.delayProfiles {
|
||||||
user-select: none;
|
user-select: none;
|
||||||
}
|
}
|
||||||
@ -25,3 +29,10 @@
|
|||||||
width: $dragHandleWidth;
|
width: $dragHandleWidth;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: $breakpointSmall) {
|
||||||
|
.horizontalScroll {
|
||||||
|
overflow-y: hidden;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -5,7 +5,8 @@ import Icon from 'Components/Icon';
|
|||||||
import Link from 'Components/Link/Link';
|
import Link from 'Components/Link/Link';
|
||||||
import Measure from 'Components/Measure';
|
import Measure from 'Components/Measure';
|
||||||
import PageSectionContent from 'Components/Page/PageSectionContent';
|
import PageSectionContent from 'Components/Page/PageSectionContent';
|
||||||
import { icons } from 'Helpers/Props';
|
import Scroller from 'Components/Scroller/Scroller';
|
||||||
|
import { icons, scrollDirections } from 'Helpers/Props';
|
||||||
import translate from 'Utilities/String/translate';
|
import translate from 'Utilities/String/translate';
|
||||||
import DelayProfile from './DelayProfile';
|
import DelayProfile from './DelayProfile';
|
||||||
import DelayProfileDragPreview from './DelayProfileDragPreview';
|
import DelayProfileDragPreview from './DelayProfileDragPreview';
|
||||||
@ -72,48 +73,59 @@ class DelayProfiles extends Component {
|
|||||||
errorMessage={translate('UnableToLoadDelayProfiles')}
|
errorMessage={translate('UnableToLoadDelayProfiles')}
|
||||||
{...otherProps}
|
{...otherProps}
|
||||||
>
|
>
|
||||||
<div className={styles.delayProfilesHeader}>
|
<Scroller
|
||||||
<div className={styles.column}>Protocol</div>
|
className={styles.horizontalScroll}
|
||||||
<div className={styles.column}>Usenet Delay</div>
|
scrollDirection={
|
||||||
<div className={styles.column}>Torrent Delay</div>
|
scrollDirections.HORIZONTAL
|
||||||
<div className={styles.tags}>Tags</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className={styles.delayProfiles}>
|
|
||||||
{
|
|
||||||
items.map((item, index) => {
|
|
||||||
return (
|
|
||||||
<DelayProfileDragSource
|
|
||||||
key={item.id}
|
|
||||||
tagList={tagList}
|
|
||||||
{...item}
|
|
||||||
{...otherProps}
|
|
||||||
index={index}
|
|
||||||
isDragging={isDragging}
|
|
||||||
isDraggingUp={isDraggingUp}
|
|
||||||
isDraggingDown={isDraggingDown}
|
|
||||||
onConfirmDeleteDelayProfile={onConfirmDeleteDelayProfile}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
autoFocus={false}
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<div className={styles.delayProfilesHeader}>
|
||||||
|
<div className={styles.column}>Protocol</div>
|
||||||
|
<div className={styles.column}>Usenet Delay</div>
|
||||||
|
<div className={styles.column}>Torrent Delay</div>
|
||||||
|
<div className={styles.tags}>Tags</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<DelayProfileDragPreview
|
<div className={styles.delayProfiles}>
|
||||||
width={width}
|
{
|
||||||
/>
|
items.map((item, index) => {
|
||||||
</div>
|
return (
|
||||||
|
<DelayProfileDragSource
|
||||||
|
key={item.id}
|
||||||
|
tagList={tagList}
|
||||||
|
{...item}
|
||||||
|
{...otherProps}
|
||||||
|
index={index}
|
||||||
|
isDragging={isDragging}
|
||||||
|
isDraggingUp={isDraggingUp}
|
||||||
|
isDraggingDown={isDraggingDown}
|
||||||
|
onConfirmDeleteDelayProfile={onConfirmDeleteDelayProfile}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
{
|
<DelayProfileDragPreview
|
||||||
defaultProfile &&
|
width={width}
|
||||||
<div>
|
|
||||||
<DelayProfile
|
|
||||||
tagList={tagList}
|
|
||||||
isDragging={false}
|
|
||||||
onConfirmDeleteDelayProfile={onConfirmDeleteDelayProfile}
|
|
||||||
{...defaultProfile}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
}
|
|
||||||
|
{
|
||||||
|
defaultProfile ?
|
||||||
|
<div>
|
||||||
|
<DelayProfile
|
||||||
|
tagList={tagList}
|
||||||
|
isDragging={false}
|
||||||
|
onConfirmDeleteDelayProfile={onConfirmDeleteDelayProfile}
|
||||||
|
{...defaultProfile}
|
||||||
|
/>
|
||||||
|
</div> :
|
||||||
|
null
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</Scroller>
|
||||||
|
|
||||||
<div className={styles.addDelayProfile}>
|
<div className={styles.addDelayProfile}>
|
||||||
<Link
|
<Link
|
||||||
|
Loading…
Reference in New Issue
Block a user