bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use Tabler for missing LineAwesome icons

Browse source
This commit is contained in:
Alex Gleason 2021-09-27 00:00:03 -05:00
parent b7c7d64bf7
commit f6fdf46040
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
8 changed files with 24 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/soapbox/features/crypto_donate/components/crypto_address.js
View file

@ -42,7 +42,7 @@ class CryptoAddress extends ImmutablePureComponent {
<Icon id='qrcode' /> <Icon id='qrcode' />
</a> </a>
{explorerUrl && <a href={explorerUrl} target='_blank'> {explorerUrl && <a href={explorerUrl} target='_blank'>
<Icon id='external-link' /> <Icon id='external-link-alt' />
</a>} </a>}
</div> </div>
</div> </div>

3
app/soapbox/features/crypto_donate/components/crypto_donate_panel.js
View file

@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component'; import ImmutablePureComponent from 'react-immutable-pure-component';
import Icon from 'soapbox/components/icon';
import SiteWallet from './site_wallet'; import SiteWallet from './site_wallet';
import { List as ImmutableList } from 'immutable'; import { List as ImmutableList } from 'immutable';
import classNames from 'classnames'; import classNames from 'classnames';
@ -44,7 +45,7 @@ class CryptoDonatePanel extends ImmutablePureComponent {
return ( return (
<div className={classNames('wtf-panel funding-panel crypto-donate-panel', { 'crypto-donate-panel--has-more': hasMore })}> <div className={classNames('wtf-panel funding-panel crypto-donate-panel', { 'crypto-donate-panel--has-more': hasMore })}>
<div className='wtf-panel-header'> <div className='wtf-panel-header'>
<i role='img' alt='bitcoin' className='fa fa-bitcoin wtf-panel-header__icon' /> <Icon src={require('@tabler/icons/icons/currency-bitcoin.svg')} className='wtf-panel-header__icon' />
<span className='wtf-panel-header__label'> <span className='wtf-panel-header__label'>
<span><FormattedMessage id='crypto_donate_panel.heading' defaultMessage='Donate Cryptocurrency' /></span> <span><FormattedMessage id='crypto_donate_panel.heading' defaultMessage='Donate Cryptocurrency' /></span>
</span> </span>

2
app/soapbox/features/crypto_donate/components/detailed_crypto_address.js
View file

@ -32,7 +32,7 @@ export default class DetailedCryptoAddress extends ImmutablePureComponent {
<div className='crypto-address__title'>{title || ticker.toUpperCase()}</div> <div className='crypto-address__title'>{title || ticker.toUpperCase()}</div>
<div className='crypto-address__actions'> <div className='crypto-address__actions'>
{explorerUrl && <a href={explorerUrl} target='_blank'> {explorerUrl && <a href={explorerUrl} target='_blank'>
<Icon id='external-link' /> <Icon id='external-link-alt' />
</a>} </a>}
</div> </div>
</div> </div>

2
app/soapbox/features/ui/components/funding_panel.js
View file

@ -41,7 +41,7 @@ class FundingPanel extends ImmutablePureComponent {
return ( return (
<div className='wtf-panel funding-panel'> <div className='wtf-panel funding-panel'>
<div className='wtf-panel-header'> <div className='wtf-panel-header'>
<i role='img' alt='users' className='fa fa-line-chart wtf-panel-header__icon' /> <i role='img' alt='users' className='fa fa-chart-line wtf-panel-header__icon' />
<span className='wtf-panel-header__label'> <span className='wtf-panel-header__label'>
<span>Funding Goal</span> <span>Funding Goal</span>
</span> </span>

2
app/soapbox/features/ui/components/subscription_button.js
View file

@ -59,7 +59,7 @@ class SubscriptionButton extends ImmutablePureComponent {
title={intl.formatMessage(subscribing ? messages.unsubscribe : messages.subscribe, { name: account.get('username') })} title={intl.formatMessage(subscribing ? messages.unsubscribe : messages.subscribe, { name: account.get('username') })}
onClick={this.handleSubscriptionToggle} onClick={this.handleSubscriptionToggle}
> >
<Icon id={subscribing ? 'bell-ringing' : 'bell'} /> <Icon src={subscribing ? require('@tabler/icons/icons/bell-ringing.svg') : require('@tabler/icons/icons/bell.svg')} />
{subscribing && intl.formatMessage(messages.subscribed)} {subscribing && intl.formatMessage(messages.subscribed)}
</Button> </Button>
); );

10
app/styles/components/account-header.scss
View file

@ -24,8 +24,9 @@
.subscription-button { .subscription-button {
color: var(--primary-text-color); color: var(--primary-text-color);
margin-bottom: 4px; margin-bottom: 4px;
display: block; display: flex;
vertical-align: top; align-items: center;
justify-content: center;
background-color: var(--background-color); background-color: var(--background-color);
text-transform: uppercase; text-transform: uppercase;
font-size: 13px; font-size: 13px;
@ -43,6 +44,11 @@
&:not(.button-active) i.fa { &:not(.button-active) i.fa {
margin: 0; margin: 0;
} }
.svg-icon {
width: 20px;
height: 20px;
}
} }
} }

4
app/styles/components/crypto-donate.scss
View file

@ -37,6 +37,10 @@
color: var(--primary-text-color--faint); color: var(--primary-text-color--faint);
margin-left: 10px; margin-left: 10px;
} }
i.fa {
font-size: 20px;
}
} }
&__note { &__note {

7
app/styles/components/wtf-panel.scss
View file

@ -18,13 +18,18 @@
.wtf-panel-header { .wtf-panel-header {
display: flex; display: flex;
align-items: baseline; align-items: center;
margin-bottom: 10px; margin-bottom: 10px;
padding: 15px 15px 0; padding: 15px 15px 0;
&__icon { &__icon {
margin-right: 10px; margin-right: 10px;
font-size: 20px; font-size: 20px;
&.svg-icon {
width: 20px;
height: 20px;
}
} }
&__label { &__label {