LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

fix publish modal style

Browse source
This commit is contained in:
Sean Yesmunt 2020-02-11 13:19:09 -05:00
parent 82c038b354
commit 7eb340167a
3 changed files with 62 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
ui/component/claimPreview/view.jsx
View file

@ -266,25 +266,27 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
</div> </div>
<ClaimPreviewSubtitle uri={uri} type={type} /> <ClaimPreviewSubtitle uri={uri} type={type} />
</div> </div>
<div className="claim-preview__actions"> {type !== 'small' && (
{!pending && ( <div className="claim-preview__actions">
<React.Fragment> {!pending && (
{hideActions ? null : actions !== undefined ? ( <React.Fragment>
actions {hideActions ? null : actions !== undefined ? (
) : ( actions
<div className="card__actions--inline"> ) : (
{isChannel && !channelIsBlocked && !claimIsMine && ( <div className="card__actions--inline">
<SubscribeButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} /> {isChannel && !channelIsBlocked && !claimIsMine && (
)} <SubscribeButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} />
{!hideBlock && isChannel && !isSubscribed && !claimIsMine && ( )}
<BlockButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} /> {!hideBlock && isChannel && !isSubscribed && !claimIsMine && (
)} <BlockButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} />
</div> )}
)} </div>
</React.Fragment> )}
)} </React.Fragment>
{properties !== undefined ? properties : <ClaimTags uri={uri} type={type} />} )}
</div> {properties !== undefined ? properties : <ClaimTags uri={uri} type={type} />}
</div>
)}
</div> </div>
</div> </div>
</li> </li>

70
ui/modal/modalPublish/view.jsx
View file

@ -3,6 +3,7 @@ import React from 'react';
import { Modal } from 'modal/modal'; import { Modal } from 'modal/modal';
import ClaimPreview from 'component/claimPreview'; import ClaimPreview from 'component/claimPreview';
import Button from 'component/button'; import Button from 'component/button';
import Card from 'component/common/card';
type Props = { type Props = {
closeModal: () => void, closeModal: () => void,
@ -19,41 +20,50 @@ class ModalPublishSuccess extends React.PureComponent<Props> {
const contentLabel = isEdit ? 'Update published' : 'File published'; const contentLabel = isEdit ? 'Update published' : 'File published';
const publishMessage = isEdit ? 'update is now' : 'file is now'; const publishMessage = isEdit ? 'update is now' : 'file is now';
function handleClose() {
clearPublish();
closeModal();
}
return ( return (
<Modal <Modal isOpen type="card" contentLabel={__(contentLabel)} onAborted={handleClose}>
isOpen <Card
title={__('Success')} title={__('Success')}
contentLabel={__(contentLabel)} subtitle={__(`Your %publishMessage% pending on LBRY. It will take a few minutes to appear for other users.`, {
onConfirmed={() => {
clearPublish();
navigate('/$/published');
closeModal();
}}
confirmButtonLabel={__('View My Publishes')}
abortButtonLabel={__('Close')}
onAborted={() => {
clearPublish();
closeModal();
}}
>
<p className="section__subtitle">
{__(`Your %publishMessage% pending on LBRY. It will take a few minutes to appear for other users.`, {
publishMessage, publishMessage,
})} })}
</p> body={
<div className="card--inline">
<ClaimPreview type="small" uri={uri} />
</div>
<p className="help">
{filePath && !IS_WEB && (
<React.Fragment> <React.Fragment>
{__( <div className="card--inline">
`Upload will continue in the background, please do not shut down immediately. Leaving the app running helps the network, thank you!` <ClaimPreview type="small" uri={uri} />
)}{' '} </div>
<Button button="link" href="https://lbry.com/faq/host-content" label={__('Learn More')} /> {filePath && !IS_WEB && (
<p className="help">
<React.Fragment>
{__(
`Upload will continue in the background, please do not shut down immediately. Leaving the app running helps the network, thank you!`
)}{' '}
<Button button="link" href="https://lbry.com/faq/host-content" label={__('Learn More')} />
</React.Fragment>
</p>
)}
</React.Fragment> </React.Fragment>
)} }
</p> actions={
<React.Fragment>
<Button
button="primary"
label={__('View My Publishes')}
onClick={() => {
clearPublish();
navigate('/$/published');
closeModal();
}}
/>
<Button button="link" label={__('Close')} onClick={handleClose} />
</React.Fragment>
}
/>
</Modal> </Modal>
); );
} }

1
ui/scss/component/_file-properties.scss
View file

@ -5,6 +5,7 @@
font-size: var(--font-small); font-size: var(--font-small);
color: var(--color-text-help); color: var(--color-text-help);
margin-left: var(--spacing-small); margin-left: var(--spacing-small);
white-space: nowrap;
& > *:not(:last-child) { & > *:not(:last-child) {
margin-right: var(--spacing-small); margin-right: var(--spacing-small);