This commit is contained in:
Sean Yesmunt 2019-03-19 13:11:28 -04:00
parent 483a97a694
commit 26d9539e82
3 changed files with 31 additions and 31 deletions

View file

@ -50,21 +50,21 @@ class ChannelTile extends React.PureComponent<Props> {
return ( return (
<section <section
onClick={onClick} onClick={onClick}
role='button' role="button"
className={classnames('media-tile card--link', { className={classnames('media-tile card--link', {
'media-tile--small': size === 'small', 'media-tile--small': size === 'small',
'media-tile--large': size === 'large', 'media-tile--large': size === 'large',
})} })}
> >
<CardMedia title={channelName} thumbnail={null} /> <CardMedia title={channelName} thumbnail={null} />
<div className='media__info'> <div className="media__info">
{isResolvingUri && <div className='media__title'>{__('Loading...')}</div>} {isResolvingUri && <div className="media__title">{__('Loading...')}</div>}
{!isResolvingUri && ( {!isResolvingUri && (
<React.Fragment> <React.Fragment>
<div className='media__title'> <div className="media__title">
<TruncatedText text={channelName || uri} lines={1} /> <TruncatedText text={channelName || uri} lines={1} />
</div> </div>
<div className='media__subtitle'> <div className="media__subtitle">
{totalItems > 0 && ( {totalItems > 0 && (
<span> <span>
{totalItems} {totalItems === 1 ? 'publish' : 'publishes'} {totalItems} {totalItems === 1 ? 'publish' : 'publishes'}
@ -75,8 +75,8 @@ class ChannelTile extends React.PureComponent<Props> {
</React.Fragment> </React.Fragment>
)} )}
{subscriptionUri && ( {subscriptionUri && (
<div className='media__actions'> <div className="media__actions">
<SubscribeButton buttonStyle='inverse' uri={subscriptionUri} /> <SubscribeButton buttonStyle="inverse" uri={subscriptionUri} />
</div> </div>
)} )}
</div> </div>

View file

@ -11,14 +11,14 @@ const WalletBalance = (props: Props) => {
const { balance } = props; const { balance } = props;
return ( return (
<section <section
className='card card--section card--wallet-balance' className="card card--section card--wallet-balance"
style={{ backgroundImage: `url(${BalanceBackground})` }} style={{ backgroundImage: `url(${BalanceBackground})` }}
> >
<header className='card__header'> <header className="card__header">
<h2 className='card__title'>{__('Balance')}</h2> <h2 className="card__title">{__('Balance')}</h2>
<p className='card__subtitle'>{__('You currently have')}</p> <p className="card__subtitle">{__('You currently have')}</p>
</header> </header>
<div className='card__content'> <div className="card__content">
{(balance || balance === 0) && ( {(balance || balance === 0) && (
<CreditAmount large badge={false} amount={balance} precision={8} /> <CreditAmount large badge={false} amount={balance} precision={8} />
)} )}

View file

@ -80,21 +80,21 @@ class ChannelPage extends React.PureComponent<Props> {
claimsInChannel && claimsInChannel.length ? ( claimsInChannel && claimsInChannel.length ? (
<FileList sortByHeight hideFilter fileInfos={claimsInChannel} /> <FileList sortByHeight hideFilter fileInfos={claimsInChannel} />
) : ( ) : (
!fetching && <span className='empty'>{__('No content found.')}</span> !fetching && <span className="empty">{__('No content found.')}</span>
); );
return ( return (
<Page notContained> <Page notContained>
<header className='channel-info'> <header className="channel-info">
<h1 className='media__title media__title--large'> <h1 className="media__title media__title--large">
{name} {name}
{fetching && <BusyIndicator />} {fetching && <BusyIndicator />}
</h1> </h1>
<div className='channel-info__actions__group'> <div className="channel-info__actions__group">
<SubscribeButton uri={`lbry://${permanentUrl}`} channelName={name} /> <SubscribeButton uri={`lbry://${permanentUrl}`} channelName={name} />
<Button <Button
button='alt' button="alt"
icon={icons.SHARE} icon={icons.SHARE}
label={__('Share Channel')} label={__('Share Channel')}
onClick={() => onClick={() =>
@ -104,42 +104,42 @@ class ChannelPage extends React.PureComponent<Props> {
</div> </div>
</header> </header>
<section className='media-group--list'>{contentList}</section> <section className="media-group--list">{contentList}</section>
{(!fetching || (claimsInChannel && claimsInChannel.length)) && totalPages > 1 && ( {(!fetching || (claimsInChannel && claimsInChannel.length)) && totalPages > 1 && (
<Form> <Form>
<fieldset-group class='fieldset-group--smushed fieldgroup--paginate'> <fieldset-group class="fieldset-group--smushed fieldgroup--paginate">
<fieldset-section> <fieldset-section>
<ReactPaginate <ReactPaginate
pageCount={totalPages} pageCount={totalPages}
pageRangeDisplayed={2} pageRangeDisplayed={2}
previousLabel='' previousLabel=""
nextLabel='' nextLabel=""
activeClassName='pagination__item--selected' activeClassName="pagination__item--selected"
pageClassName='pagination__item' pageClassName="pagination__item"
previousClassName='pagination__item pagination__item--previous' previousClassName="pagination__item pagination__item--previous"
nextClassName='pagination__item pagination__item--next' nextClassName="pagination__item pagination__item--next"
breakClassName='pagination__item pagination__item--break' breakClassName="pagination__item pagination__item--break"
marginPagesDisplayed={2} marginPagesDisplayed={2}
onPageChange={e => this.changePage(e.selected + 1)} onPageChange={e => this.changePage(e.selected + 1)}
forcePage={currentPage} forcePage={currentPage}
initialPage={currentPage} initialPage={currentPage}
containerClassName='pagination' containerClassName="pagination"
/> />
</fieldset-section> </fieldset-section>
<FormField <FormField
className='paginate-channel' className="paginate-channel"
onKeyUp={e => this.paginate(e, totalPages)} onKeyUp={e => this.paginate(e, totalPages)}
label={__('Go to page:')} label={__('Go to page:')}
type='text' type="text"
name='paginate-file' name="paginate-file"
/> />
</fieldset-group> </fieldset-group>
</Form> </Form>
)} )}
{!channelIsMine && <HiddenNsfwClaims className='card__content help' uri={uri} />} {!channelIsMine && <HiddenNsfwClaims className="card__content help" uri={uri} />}
</Page> </Page>
); );
} }