From cac767a3b81a25d6d52701aeadc481a8f3628bcb Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 01:45:20 -0500 Subject: [PATCH 01/19] fix: minor color and spacing issues --- src/renderer/component/inviteList/view.jsx | 2 - src/renderer/component/inviteNew/view.jsx | 10 ++-- src/renderer/component/userEmailNew/view.jsx | 4 +- src/renderer/component/userVerify/view.jsx | 49 +++++++------------ .../modal/modalAutoUpdateDownloaded/view.jsx | 2 +- src/renderer/modal/modalUpgrade/view.jsx | 2 +- src/renderer/scss/component/_item-list.scss | 4 ++ 7 files changed, 29 insertions(+), 44 deletions(-) diff --git a/src/renderer/component/inviteList/view.jsx b/src/renderer/component/inviteList/view.jsx index e7ce9bff7..77205bbbb 100644 --- a/src/renderer/component/inviteList/view.jsx +++ b/src/renderer/component/inviteList/view.jsx @@ -66,9 +66,7 @@ class InviteList extends React.PureComponent { )} - -
{__( 'The maximum number of invite rewards is currently limited. Invite reward can only be claimed if the invitee passes the humanness test.' diff --git a/src/renderer/component/inviteNew/view.jsx b/src/renderer/component/inviteNew/view.jsx index b8d5d28c1..c2df79eea 100644 --- a/src/renderer/component/inviteNew/view.jsx +++ b/src/renderer/component/inviteNew/view.jsx @@ -33,7 +33,7 @@ class FormInviteNew extends React.PureComponent { return (
- + -
-
- -
+
+
); @@ -94,9 +92,7 @@ class InviteNew extends React.PureComponent { isPending={isPending} rewardAmount={rewardAmount} /> -
-

{__('Read our')}{' '}

- + ); } } diff --git a/src/renderer/component/userVerify/view.jsx b/src/renderer/component/userVerify/view.jsx index 257eda5c3..ba24effe4 100644 --- a/src/renderer/component/userVerify/view.jsx +++ b/src/renderer/component/userVerify/view.jsx @@ -31,29 +31,25 @@ class UserVerify extends React.PureComponent {

{__('Final Human Proof')}

-
- -
-

+

Finally, please complete one and only one of the options below.

-
+

{__('1) Proof via Credit')}

-
- -
-

+

{`${__( 'If you have a valid credit or debit card, you can use it to instantly prove your humanity.' )} ${__( 'LBRY does not store your credit card information. There is no charge at all for this, now or in the future.' )} `}

+ +
{errorMessage &&

{errorMessage}

} { stripeKey={Lbryio.getStripeToken()} />
-
-
-
+
{__('A $1 authorization may temporarily appear with your provider.')}{' '}
-
-
-
+
{__('Standard messaging rates apply. Having trouble?')}{' '}
@@ -112,21 +103,17 @@ class UserVerify extends React.PureComponent {

{__('3) Proof via Chat')}

-
- -
-

+

{__( 'A moderator capable of approving you is typically available in the #verification channel of our chat room.' - )} -

- -

+ )}{' '} {__( 'This process will likely involve providing proof of a stable and established online or real-life identity.' )}

+ +
+ + +
- -
+
)} {!hasSubscriptions && ( @@ -91,7 +96,7 @@ export default (props: Props) => {
{viewMode === VIEW_ALL && ( -
+
{__('Your subscriptions')} {unreadSubscriptions.length > 0 && }
@@ -118,9 +123,7 @@ export default (props: Props) => {
    - {uris.map(uri => ( - - ))} + {uris.map(uri => )}
diff --git a/src/renderer/scss/component/_card.scss b/src/renderer/scss/component/_card.scss index a0efb94be..e1977918c 100644 --- a/src/renderer/scss/component/_card.scss +++ b/src/renderer/scss/component/_card.scss @@ -181,21 +181,13 @@ .card__title { font-size: 2rem; font-weight: 600; - - &:not(.card__title--flex) { - .btn { - bottom: -0.5rem; - float: right; - font-size: 1rem; - } - } - - .btn { - position: relative; - } } .card__title--flex { - @include between; display: flex; + align-items: center; + + .btn:not(:first-of-type) { + margin-left: var(--spacing-vertical-medium); + } } From bae0534d99c9837cb5ee70b70858791abf753b9a Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 13:03:49 -0500 Subject: [PATCH 04/19] use correct tx price color and fix tx refresh button layout --- .../component/common/credit-amount.jsx | 2 +- .../internal/transaction-list-item.jsx | 27 ++++++++++--------- .../component/transactionList/view.jsx | 12 +-------- .../component/transactionListRecent/view.jsx | 15 ++++++----- src/renderer/page/transactionHistory/view.jsx | 2 +- src/renderer/scss/component/_card.scss | 6 +++++ src/renderer/scss/component/_table.scss | 4 --- src/renderer/types/transaction.js | 11 ++++++++ 8 files changed, 42 insertions(+), 37 deletions(-) create mode 100644 src/renderer/types/transaction.js diff --git a/src/renderer/component/common/credit-amount.jsx b/src/renderer/component/common/credit-amount.jsx index b948018a3..0eee4ec5e 100644 --- a/src/renderer/component/common/credit-amount.jsx +++ b/src/renderer/component/common/credit-amount.jsx @@ -77,7 +77,7 @@ class CreditAmount extends React.PureComponent { title={fullPrice} className={classnames('badge', { badge, - 'badge--cost': (badge && !isFree) || amount > 0, + 'badge--cost': badge && amount > 0, 'badge--free': badge && isFree, 'badge--large': large, })} diff --git a/src/renderer/component/transactionList/internal/transaction-list-item.jsx b/src/renderer/component/transactionList/internal/transaction-list-item.jsx index 375f5db69..997b85af1 100644 --- a/src/renderer/component/transactionList/internal/transaction-list-item.jsx +++ b/src/renderer/component/transactionList/internal/transaction-list-item.jsx @@ -1,5 +1,5 @@ // @flow -import type { Transaction } from '../view'; +import type { Transaction } from 'types/transaction'; import * as ICONS from 'constants/icons'; import React from 'react'; import ButtonTransaction from 'component/common/transaction-link'; @@ -53,12 +53,12 @@ class TransactionListItem extends React.PureComponent { return ( - +
{fee !== 0 && ( - + )} @@ -67,16 +67,17 @@ class TransactionListItem extends React.PureComponent { {reward && {reward.reward_title}} - {name && claimId && ( - - )} + {name && + claimId && ( + + )} diff --git a/src/renderer/component/transactionList/view.jsx b/src/renderer/component/transactionList/view.jsx index a2f80a884..8b2bb45e1 100644 --- a/src/renderer/component/transactionList/view.jsx +++ b/src/renderer/component/transactionList/view.jsx @@ -1,4 +1,5 @@ // @flow +import type { Transaction } from 'types/transaction'; import * as icons from 'constants/icons'; import * as MODALS from 'constants/modal_types'; import * as React from 'react'; @@ -8,17 +9,6 @@ import FileExporter from 'component/common/file-exporter'; import { TRANSACTIONS } from 'lbry-redux'; import TransactionListItem from './internal/transaction-list-item'; -export type Transaction = { - amount: number, - claim_id: string, - claim_name: string, - fee: number, - nout: number, - txid: string, - type: string, - date: Date, -}; - type Props = { emptyMessage: ?string, slim?: boolean, diff --git a/src/renderer/component/transactionListRecent/view.jsx b/src/renderer/component/transactionListRecent/view.jsx index 41312823b..4925b342e 100644 --- a/src/renderer/component/transactionListRecent/view.jsx +++ b/src/renderer/component/transactionListRecent/view.jsx @@ -1,5 +1,5 @@ // @flow -import type { Transaction } from 'component/transactionList/view'; +import type { Transaction } from 'types/transaction'; import * as icons from 'constants/icons'; import React, { Fragment } from 'react'; import BusyIndicator from 'component/common/busy-indicator'; @@ -28,7 +28,7 @@ class TransactionListRecent extends React.PureComponent { return (
-

+

{__('Recent Transactions')}

@@ -39,11 +39,12 @@ class TransactionListRecent extends React.PureComponent {

- {fetchingTransactions && !hasTransactions && ( -
- -
- )} + {fetchingTransactions && + !hasTransactions && ( +
+ +
+ )} {hasTransactions && ( diff --git a/src/renderer/page/transactionHistory/view.jsx b/src/renderer/page/transactionHistory/view.jsx index ef83422d9..06ed0fe83 100644 --- a/src/renderer/page/transactionHistory/view.jsx +++ b/src/renderer/page/transactionHistory/view.jsx @@ -27,7 +27,7 @@ class TransactionHistoryPage extends React.PureComponent {
-

+

{__('Transaction History')}

diff --git a/src/renderer/scss/component/_card.scss b/src/renderer/scss/component/_card.scss index e1977918c..a1b6412da 100644 --- a/src/renderer/scss/component/_card.scss +++ b/src/renderer/scss/component/_card.scss @@ -191,3 +191,9 @@ margin-left: var(--spacing-vertical-medium); } } + +.card__title--flex-between { + display: flex; + @include between; + align-items: center; +} diff --git a/src/renderer/scss/component/_table.scss b/src/renderer/scss/component/_table.scss index 9bb2a2318..3f9ea45b4 100644 --- a/src/renderer/scss/component/_table.scss +++ b/src/renderer/scss/component/_table.scss @@ -109,8 +109,4 @@ td:nth-of-type(5) { width: 15%; } - - .badge { - background-color: transparent !important; - } } diff --git a/src/renderer/types/transaction.js b/src/renderer/types/transaction.js new file mode 100644 index 000000000..37cd5f4b2 --- /dev/null +++ b/src/renderer/types/transaction.js @@ -0,0 +1,11 @@ +// @flow +export type Transaction = { + amount: number, + claim_id: string, + claim_name: string, + fee: number, + nout: number, + txid: string, + type: string, + date: Date, +}; From 7b0ab43bfa202425fd34a5db5c56a3058ec3fabe Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 13:48:09 -0500 Subject: [PATCH 05/19] fix: phone collection layout --- .../component/common/credit-amount.jsx | 1 + .../internal/transaction-list-item.jsx | 4 +- src/renderer/component/userPhoneNew/view.jsx | 93 +++++++++++-------- .../component/userPhoneVerify/view.jsx | 61 ++++++------ src/renderer/modal/modal.jsx | 8 +- .../modal/modalPhoneCollection/view.jsx | 4 +- 6 files changed, 100 insertions(+), 71 deletions(-) diff --git a/src/renderer/component/common/credit-amount.jsx b/src/renderer/component/common/credit-amount.jsx index 0eee4ec5e..ac6538b0e 100644 --- a/src/renderer/component/common/credit-amount.jsx +++ b/src/renderer/component/common/credit-amount.jsx @@ -23,6 +23,7 @@ class CreditAmount extends React.PureComponent { showFullPrice: false, showPlus: false, showLBC: true, + badge: true, }; render() { diff --git a/src/renderer/component/transactionList/internal/transaction-list-item.jsx b/src/renderer/component/transactionList/internal/transaction-list-item.jsx index 997b85af1..fb5960dda 100644 --- a/src/renderer/component/transactionList/internal/transaction-list-item.jsx +++ b/src/renderer/component/transactionList/internal/transaction-list-item.jsx @@ -53,12 +53,12 @@ class TransactionListItem extends React.PureComponent { return ( - +
{fee !== 0 && ( - + )} diff --git a/src/renderer/component/userPhoneNew/view.jsx b/src/renderer/component/userPhoneNew/view.jsx index dff273299..2bc7edc3c 100644 --- a/src/renderer/component/userPhoneNew/view.jsx +++ b/src/renderer/component/userPhoneNew/view.jsx @@ -1,6 +1,5 @@ -// I'll come back to this -/* eslint-disable */ -import React from 'react'; +// @flow +import * as React from 'react'; import { Form, FormRow, FormField, Submit } from 'component/common/form'; const os = require('os').type(); @@ -20,67 +19,86 @@ const countryCodes = require('country-data') return 0; }); -class UserPhoneNew extends React.PureComponent { - constructor(props) { +type Props = { + addUserPhone: (string, string) => void, + cancelButton: React.Node, + phoneErrorMessage: ?string, + isPending: boolean, +}; + +type State = { + phone: string, + countryCode: string, +}; + +class UserPhoneNew extends React.PureComponent { + constructor(props: Props) { super(props); this.state = { phone: '', - country_code: '+1', + countryCode: '+1', }; - this.formatPhone = this.formatPhone.bind(this); + (this: any).formatPhone = this.formatPhone.bind(this); + (this: any).handleSubmit = this.handleSubmit.bind(this); + (this: any).handleSelect = this.handleSelect.bind(this); } - formatPhone(value) { - const { country_code } = this.state; - value = value.replace(/\D/g, ''); - if (country_code === '+1') { - if (!value) { + formatPhone(value: string) { + const { countryCode } = this.state; + const formattedNumber = value.replace(/\D/g, ''); + + if (countryCode === '+1') { + if (!formattedNumber) { return ''; - } else if (value.length < 4) { - return value; - } else if (value.length < 7) { - return `(${value.substring(0, 3)}) ${value.substring(3)}`; + } else if (formattedNumber.length < 4) { + return formattedNumber; + } else if (formattedNumber.length < 7) { + return `(${formattedNumber.substring(0, 3)}) ${formattedNumber.substring(3)}`; } - const fullNumber = `(${value.substring(0, 3)}) ${value.substring(3, 6)}-${value.substring( + const fullNumber = `(${formattedNumber.substring(0, 3)}) ${formattedNumber.substring( + 3, 6 - )}`; + )}-${formattedNumber.substring(6)}`; return fullNumber.length <= 14 ? fullNumber : fullNumber.substring(0, 14); } - return value; + return formattedNumber; } - handleChanged(event) { + handleChanged(event: SyntheticInputEvent<*>) { this.setState({ phone: this.formatPhone(event.target.value), }); } - handleSelect(event) { - this.setState({ country_code: event.target.value }); + handleSelect(event: SyntheticInputEvent<*>) { + this.setState({ countryCode: event.target.value }); } handleSubmit() { - const { phone, country_code } = this.state; - this.props.addUserPhone(phone.replace(/\D/g, ''), country_code.substring(1)); + const { phone, countryCode } = this.state; + this.props.addUserPhone(phone.replace(/\D/g, ''), countryCode.substring(1)); } render() { const { cancelButton, phoneErrorMessage, isPending } = this.props; return ( -
-

- {__( - 'Enter your phone number and we will send you a verification code. We will not share your phone number with third parties.' - )} -

-
- - - {countryCodes.map((country, index) => ( -
+ ); } } export default UserPhoneNew; -/* eslint-enable */ diff --git a/src/renderer/component/userPhoneVerify/view.jsx b/src/renderer/component/userPhoneVerify/view.jsx index 9d507e710..349cea98c 100644 --- a/src/renderer/component/userPhoneVerify/view.jsx +++ b/src/renderer/component/userPhoneVerify/view.jsx @@ -2,7 +2,7 @@ /* eslint-disable */ import React from 'react'; import Button from 'component/button'; -import { Form, FormField, Submit } from 'component/common/form'; +import { Form, FormField, Submit, FormRow } from 'component/common/form'; class UserPhoneVerify extends React.PureComponent { constructor(props) { @@ -32,35 +32,44 @@ class UserPhoneVerify extends React.PureComponent { render() { const { cancelButton, phoneErrorMessage, phone, countryCode } = this.props; return ( -
-

- {__( - `Please enter the verification code sent to +${countryCode}${phone}. Didn't receive it? ` - )} -

+ + + { + this.handleCodeChanged(event); + }} + label={__('Verification Code')} + error={phoneErrorMessage} + /> + + +
+ + {cancelButton} +
+

- {__('Email')}

+
); } @@ -100,17 +100,14 @@ class RewardsPage extends PureComponent {

{__('Disabled')}

-
- -
-

+

{__( 'Rewards are currently disabled for your account. Turn on diagnostic data sharing, in' )}{' '}

+
); } else if (fetching) { @@ -121,16 +118,16 @@ class RewardsPage extends PureComponent { ); } else if (user === null) { return ( -
+

{__('This application is unable to earn rewards due to an authentication failure.')}

-
+ ); } else if (!rewards || rewards.length <= 0) { return ( -
+

{__('No Rewards Available')}

{claimed && claimed.length @@ -139,9 +136,9 @@ class RewardsPage extends PureComponent { ) : __('There are no rewards available at this time, please check back later.')}

-
+ -
{this.renderCustomRewardCode()}
+
{this.renderCustomRewardCode()}
 ); } @@ -155,9 +152,7 @@ class RewardsPage extends PureComponent { 'card--disabled': isNotEligible, })} > - {rewards.map(reward => ( - - ))} + {rewards.map(reward => )} {this.renderCustomRewardCode()}
); diff --git a/src/renderer/redux/reducers/navigation.js b/src/renderer/redux/reducers/navigation.js index e4544b4cc..dd3bf8625 100644 --- a/src/renderer/redux/reducers/navigation.js +++ b/src/renderer/redux/reducers/navigation.js @@ -3,7 +3,7 @@ import * as ACTIONS from 'constants/action_types'; const getCurrentPath = () => { const { hash } = document.location; if (hash !== '') return hash.replace(/^#/, ''); - return '/discover'; + return '/rewards'; }; const reducers = {}; diff --git a/src/renderer/scss/component/_card.scss b/src/renderer/scss/component/_card.scss index a1b6412da..8818cc736 100644 --- a/src/renderer/scss/component/_card.scss +++ b/src/renderer/scss/component/_card.scss @@ -118,6 +118,18 @@ grid-gap: var(--spacing-vertical-medium); } +.card__list--rewards { + column-count: 2; + column-gap: var(--spacing-vertical-medium); + margin-bottom: var(--spacing-vertical-large); + + .card { + display: inline-block; + margin: 0 0 var(--spacing-vertical-medium); + width: 100%; + } +} + // C A R D // M E T A @@ -167,12 +179,6 @@ bottom: -0.12rem; position: relative; } - - &.card-row__scrollhouse--sub-component { - .card:first-of-type { - margin-left: 0; - } - } } // C A R D From 82dc80e1003a6166caf41c78509707ab38fc079b Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 14:40:24 -0500 Subject: [PATCH 07/19] fix: better pending style for publishes --- src/renderer/component/fileCard/view.jsx | 2 +- src/renderer/modal/modalPublish/view.jsx | 2 +- src/renderer/scss/component/_media.scss | 12 +++++++++++- 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/src/renderer/component/fileCard/view.jsx b/src/renderer/component/fileCard/view.jsx index ec620c603..aa247ee5a 100644 --- a/src/renderer/component/fileCard/view.jsx +++ b/src/renderer/component/fileCard/view.jsx @@ -110,7 +110,7 @@ class FileCard extends React.PureComponent { role="button" onClick={!pending ? () => navigate('/show', { uri }) : () => {}} className={classnames('media-card', { - 'media--link': !pending, + 'card--link': !pending, 'media--pending': pending, })} onContextMenu={handleContextMenu} diff --git a/src/renderer/modal/modalPublish/view.jsx b/src/renderer/modal/modalPublish/view.jsx index 3375cccf4..b5fc2d908 100644 --- a/src/renderer/modal/modalPublish/view.jsx +++ b/src/renderer/modal/modalPublish/view.jsx @@ -26,7 +26,7 @@ class ModalSendTip extends React.PureComponent { >

{__('Your file has been published to LBRY at the address')}

-

{uri}

+
{uri}

{__( 'The file will take a few minutes to appear for other LBRY users. Until then it will be listed as "pending" under your published files.' diff --git a/src/renderer/scss/component/_media.scss b/src/renderer/scss/component/_media.scss index eed44c0c1..368aa5b40 100644 --- a/src/renderer/scss/component/_media.scss +++ b/src/renderer/scss/component/_media.scss @@ -76,6 +76,17 @@ } } +// M E D I A +// P E N D I N G + +.media--pending { + opacity: 0.5; + + &:hover { + cursor: default; + } +} + // M E D I A // S E A R C H R E S U L T @@ -454,7 +465,6 @@ } .media-card { - cursor: pointer; display: inline-block; margin-bottom: var(--spacing-vertical-large); vertical-align: top; From 0ab1740b075b73581d7c16c45a821178ef17a575 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 14:48:09 -0500 Subject: [PATCH 08/19] fix: pagination text color --- src/renderer/scss/component/_pagination.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/renderer/scss/component/_pagination.scss b/src/renderer/scss/component/_pagination.scss index e9c9b51ff..db9131a4c 100644 --- a/src/renderer/scss/component/_pagination.scss +++ b/src/renderer/scss/component/_pagination.scss @@ -14,6 +14,10 @@ border-radius: 50%; text-align: center; + &:not(.pagination__item--selected):hover { + color: $lbry-black; + } + &:not(.pagination__item--selected):not(.pagination__item--break):not(.disabled):hover { background-color: $lbry-gray-1; } From 719cdb33348d96d171085d44f79692f511faf031 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 15:31:22 -0500 Subject: [PATCH 09/19] fix: links inside collapsible info --- src/renderer/scss/component/_expandable.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/renderer/scss/component/_expandable.scss b/src/renderer/scss/component/_expandable.scss index 212669531..9e41699f9 100644 --- a/src/renderer/scss/component/_expandable.scss +++ b/src/renderer/scss/component/_expandable.scss @@ -24,9 +24,10 @@ &::after { width: 100%; - height: 100%; + height: 40%; bottom: 0; left: 0; + pointer-events: none; background-image: linear-gradient( to bottom, From d2fcd8cf1a7c9c936fe9f6290b0e8b8ba77d831e Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Tue, 8 Jan 2019 15:55:55 -0500 Subject: [PATCH 10/19] fix: media property visibility on search page --- src/renderer/component/common/file-selector.jsx | 2 +- src/renderer/component/fileTile/view.jsx | 4 ++++ src/renderer/scss/component/_media.scss | 10 ++++++++++ 3 files changed, 15 insertions(+), 1 deletion(-) diff --git a/src/renderer/component/common/file-selector.jsx b/src/renderer/component/common/file-selector.jsx index 1aea29fd2..476a1e42f 100644 --- a/src/renderer/component/common/file-selector.jsx +++ b/src/renderer/component/common/file-selector.jsx @@ -63,7 +63,7 @@ class FileSelector extends React.PureComponent { type === 'file' ? fileLabel || __('Choose File') : directoryLabel || __('Choose Directory'); return ( - +

@@ -359,19 +365,21 @@ class SettingsPage extends React.PureComponent {
- - {themes.map(theme => ( - - ))} - + + + {themes.map(theme => ( + + ))} + + Date: Wed, 9 Jan 2019 00:35:06 -0500 Subject: [PATCH 16/19] back to explore page --- src/renderer/redux/reducers/navigation.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/renderer/redux/reducers/navigation.js b/src/renderer/redux/reducers/navigation.js index dd3bf8625..e4544b4cc 100644 --- a/src/renderer/redux/reducers/navigation.js +++ b/src/renderer/redux/reducers/navigation.js @@ -3,7 +3,7 @@ import * as ACTIONS from 'constants/action_types'; const getCurrentPath = () => { const { hash } = document.location; if (hash !== '') return hash.replace(/^#/, ''); - return '/rewards'; + return '/discover'; }; const reducers = {}; From fdf90ef496498addbc3340b97ecdd26b23a97031 Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Wed, 9 Jan 2019 10:59:12 -0500 Subject: [PATCH 17/19] fix: change play/view icon color on hover over thumbnail --- src/renderer/scss/component/_button.scss | 10 ++-------- src/renderer/scss/component/_content.scss | 5 +++++ 2 files changed, 7 insertions(+), 8 deletions(-) diff --git a/src/renderer/scss/component/_button.scss b/src/renderer/scss/component/_button.scss index 3c7e297c6..d483e1a1c 100644 --- a/src/renderer/scss/component/_button.scss +++ b/src/renderer/scss/component/_button.scss @@ -73,17 +73,11 @@ background-color: rgba($lbry-black, 0.7); } - &:hover { - background-color: $lbry-green-3; - } - - &.btn--play { + // The play icon looks a little weird without this + .btn--play { padding-left: 0.25rem; } - &.btn--view { - } - .btn__label { display: none; } diff --git a/src/renderer/scss/component/_content.scss b/src/renderer/scss/component/_content.scss index 06d3482bf..d378a9b89 100644 --- a/src/renderer/scss/component/_content.scss +++ b/src/renderer/scss/component/_content.scss @@ -28,6 +28,11 @@ &:hover { cursor: pointer; + + .btn--view, + .btn--play { + background-color: $lbry-green-3; + } } } From 388434929c2bd64f9b34cb7b0371e7756f77639e Mon Sep 17 00:00:00 2001 From: Sean Yesmunt Date: Wed, 9 Jan 2019 12:53:05 -0500 Subject: [PATCH 18/19] fix: increase button icon size --- src/renderer/page/settings/view.jsx | 2 +- src/renderer/scss/component/_button.scss | 7 ++++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/renderer/page/settings/view.jsx b/src/renderer/page/settings/view.jsx index 8cb6b9109..69868acac 100644 --- a/src/renderer/page/settings/view.jsx +++ b/src/renderer/page/settings/view.jsx @@ -431,7 +431,7 @@ class SettingsPage extends React.PureComponent {