random-mirrors/gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Progress

Browse Source
This commit is contained in:
mgabdev
2020-02-03 13:24:24 -05:00
parent 960c43d24c
commit 1cd851e02e
51 changed files with 932 additions and 939 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
app/javascript/gabsocial/components/status_action_bar/status_action_bar.js
View File

@@ -6,6 +6,7 @@ import { Link } from 'react-router-dom';
import { openModal } from '../../actions/modal';
import { me, isStaff } from '../../initial_state';
import DropdownMenuContainer from '../../containers/dropdown_menu_container';
import ComposeFormContainer from '../../features/compose/containers/compose_form_container';
import IconButton from '../icon_button';
import './status_action_bar.scss';
@@ -265,49 +266,67 @@ class StatusActionBar extends ImmutablePureComponent {
return (
<div className='status-action-bar'>
<div className='status-action-bar-item'>
<IconButton
className='status-action-bar-item__btn'
title={replyTitle}
icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon}
onClick={this.handleReplyClick}
/>
{
replyCount !== 0 &&
<Link to={`/${status.getIn(['account', 'acct'])}/posts/${status.get('id')}`} className='status-action-bar-item__link'>{replyCount}</Link>
}
</div>
<div className='status-action-bar__items'>
<div className='status-action-bar-item'>
<IconButton
className='status-action-bar-item__btn star-icon'
animate
active={status.get('favourited')}
pressed={status.get('favourited')}
title={formatMessage(messages.favourite)}
icon='star'
onClick={this.handleFavouriteClick}
text='Like'
/>
{ /* favoriteCount !== 0 && <span className='detailed-status__link'>{favoriteCount}</span> */ }
</div>
<div className='status-action-bar-item'>
<IconButton
className='status-action-bar-item__btn'
disabled={!publicStatus}
active={status.get('reblogged')}
pressed={status.get('reblogged')}
title={reblogTitle}
icon={reblogIcon}
onClick={this.handleReblogClick}
/>
{reblogCount !== 0 && <Link to={`/${status.getIn(['account', 'acct'])}/posts/${status.get('id')}/reblogs`} className='status-action-bar-item__link'>{reblogCount}</Link>}
</div>
<div className='status-action-bar-item'>
<IconButton
className='status-action-bar-item__btn'
title={replyTitle}
icon={status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) ? 'reply' : replyIcon}
onClick={this.handleReplyClick}
text='Comment'
/>
{ /*
replyCount !== 0 &&
<Link to={`/${status.getIn(['account', 'acct'])}/posts/${status.get('id')}`} className='status-action-bar-item__link'>{replyCount}</Link>
*/
}
</div>
<div className='status__action-bar__counter'>
<IconButton className='status__action-bar-button' disabled={!publicStatus} title={!publicStatus ? formatMessage(messages.cannot_quote) : formatMessage(messages.quote)} icon='quote-left' onClick={this.handleQuoteClick} />
</div>
<div className='status__action-bar__counter'>
<IconButton className='status__action-bar-button star-icon' animate active={status.get('favourited')} pressed={status.get('favourited')} title={formatMessage(messages.favourite)} icon='star' onClick={this.handleFavouriteClick} />
{favoriteCount !== 0 && <span className='detailed-status__link'>{favoriteCount}</span>}
</div>
<div className='status-action-bar-item'>
<IconButton
className='status-action-bar-item__btn'
disabled={!publicStatus}
active={status.get('reblogged')}
pressed={status.get('reblogged')}
title={reblogTitle}
icon={reblogIcon}
onClick={this.handleReblogClick}
text='Share'
/>
{ /* reblogCount !== 0 && <Link to={`/${status.getIn(['account', 'acct'])}/posts/${status.get('id')}/reblogs`} className='status-action-bar-item__link'>{reblogCount}</Link> */ }
</div>
<div className='status-action-bar__dropdown'>
<DropdownMenuContainer
status={status}
items={menu}
icon='ellipsis-h'
size={18}
direction='right'
title={formatMessage(messages.more)}
/>
{/*<div className='status__action-bar__counter'>
<IconButton className='status__action-bar-button' disabled={!publicStatus} title={!publicStatus ? formatMessage(messages.cannot_quote) : formatMessage(messages.quote)} icon='quote-left' onClick={this.handleQuoteClick} />
</div>*/}
{/*<div className='status-action-bar__dropdown'>
<DropdownMenuContainer
status={status}
items={menu}
icon='ellipsis-h'
size={18}
direction='right'
title={formatMessage(messages.more)}
/>
</div>*/}
</div>
<div className='status-action-bar__comment'>
{/*<ComposeFormContainer shouldCondense statusId={status.get('id')} />*/}
</div>
</div>
);

38
app/javascript/gabsocial/components/status_action_bar/status_action_bar.scss
View File

@@ -1,21 +1,51 @@
.status-action-bar {
display: flex;
align-items: center;
margin-top: 25px;
display: block;
margin-top: 10px;
z-index: 4;
@include horizontal-padding(10px);
&__dropdown {
@include size(23px);
}
&__items {
display: flex;
align-items: center;
border-top: 1px solid #161616;
@include size(100%, 42px);
}
&__comment {
}
}
.status-action-bar-item {
display: inline-flex;
margin-right: 22px;
align-items: center;
justify-content: center;
height: 42px;
width: 33%;
padding: 5px;
box-sizing: border-box;
&__btn {
border-radius: 4px;
margin-right: 4px;
font-size: 14px;
font-weight: 500;
@include size(100%);
&:hover {
background-color: #000;
}
i {
margin-right: 4px;
}
}
&__link {