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

Add "Edit profile" button

Browse source
This commit is contained in:
Alex Gleason 2020-04-21 19:44:55 -05:00
parent e338760fd3
commit d4d56e5dc8
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
3 changed files with 37 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
app/gabsocial/components/button.js
View file

@ -1,18 +1,22 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classNames from 'classnames'; import classNames from 'classnames';
import { Link } from 'react-router-dom';
import Icon from './icon';
export default class Button extends React.PureComponent { export default class Button extends React.PureComponent {
static propTypes = { static propTypes = {
text: PropTypes.node, text: PropTypes.node,
onClick: PropTypes.func, onClick: PropTypes.func,
to: PropTypes.string,
disabled: PropTypes.bool, disabled: PropTypes.bool,
block: PropTypes.bool, block: PropTypes.bool,
secondary: PropTypes.bool, secondary: PropTypes.bool,
size: PropTypes.number, size: PropTypes.number,
className: PropTypes.string, className: PropTypes.string,
style: PropTypes.object, style: PropTypes.object,
icon: PropTypes.string,
children: PropTypes.node, children: PropTypes.node,
}; };
@ -47,7 +51,7 @@ export default class Button extends React.PureComponent {
'button--block': this.props.block, 'button--block': this.props.block,
}); });
return ( const btn = (
<button <button
className={className} className={className}
disabled={this.props.disabled} disabled={this.props.disabled}
@ -55,9 +59,20 @@ export default class Button extends React.PureComponent {
ref={this.setRef} ref={this.setRef}
style={style} style={style}
> >
{this.props.icon && <Icon id={this.props.icon} />}
{this.props.text || this.props.children} {this.props.text || this.props.children}
</button> </button>
); );
if (this.props.to) {
return (
<Link to={this.props.to}>
{btn}
</Link>
);
} else {
return btn;
}
} }
} }

2
app/gabsocial/features/account/components/header.js
View file

@ -213,6 +213,8 @@ class Header extends ImmutablePureComponent {
} else if (account.getIn(['relationship', 'blocking'])) { } else if (account.getIn(['relationship', 'blocking'])) {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.unblock, { name: account.get('username') })} onClick={this.props.onBlock} />; actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.unblock, { name: account.get('username') })} onClick={this.props.onBlock} />;
} }
} else {
actionBtn = <Button className='logo-button' text={intl.formatMessage(messages.edit_profile)} to='/settings/profile' />;
} }
return actionBtn; return actionBtn;

37
app/styles/gabsocial/components/buttons.scss
View file

@ -1,23 +1,24 @@
button, button,
a.button { a.button {
&.standard { &.standard {
// NOTE - will define the larger standard buttons here and apply class where used. // NOTE - will define the larger standard buttons here and apply class where used.
&-small { &-small {
height: 20px; height: 20px;
padding: 5px 15px; padding: 5px 15px;
border: none; border: none;
border-radius: 4px; border-radius: 4px;
@include font-size(11); @include font-size(11);
@include line-height(11); @include line-height(11);
@include font-weight(bold); @include font-weight(bold);
text-transform: uppercase; text-transform: uppercase;
color: white; color: white;
background: $gab-small-cta-primary; background: $gab-small-cta-primary;
} }
} }
i.fa {
margin-right: 0.6em;
}
} }