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

Updated StatusSharePopover buttons to open in new tab and fit in popover

Browse Source 
• Updated:
- StatusSharePopover buttons to open in new tab and fit in popover
This commit is contained in:
mgabdev 2020-10-29 23:32:06 -05:00
parent 81987f9890
commit 15f9d7f955
1 changed files with 22 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
app/javascript/gabsocial/components/popover/status_share_popover.js
View File

@ -46,6 +46,7 @@ class StatusSharePopover extends ImmutablePureComponent {
const encodedStatusUrl = encodeURIComponent(status.get('url')) const encodedStatusUrl = encodeURIComponent(status.get('url'))
const mailToHref = `mailto:?subject=Gab&body=${encodedStatusUrl}` const mailToHref = `mailto:?subject=Gab&body=${encodedStatusUrl}`
const content = status.get('contentHtml') const content = status.get('contentHtml')
const iconSize = '18px'
return ( return (
<PopoverLayout <PopoverLayout
@ -59,71 +60,77 @@ class StatusSharePopover extends ImmutablePureComponent {
<div className={[_s.d, _s.w100PC, _s.px15, _s.py15, _s.flexRow, _s.noScrollbar, _s.aiCenter, _s.overflowXScroll, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}> <div className={[_s.d, _s.w100PC, _s.px15, _s.py15, _s.flexRow, _s.noScrollbar, _s.aiCenter, _s.overflowXScroll, _s.borderBottom1PX, _s.borderColorSecondary].join(' ')}>
<Button <Button
icon='copy' icon='copy'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='black' color='primary'
backgroundColor='secondary' backgroundColor='secondary'
onClick={this.handleCopy} onClick={this.handleCopy}
title={intl.formatMessage(messages.copy)} title={intl.formatMessage(messages.copy)}
className={[_s.jcCenter, _s.aiCenter, _s.mr15, _s.px10].join(' ')} className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10].join(' ')}
/> />
<Button <Button
icon='sms' icon='sms'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='white' color='white'
backgroundColor='none' backgroundColor='none'
href={`sms:+&body=${encodedStatusUrl}`} href={`sms:+&body=${encodedStatusUrl}`}
target='_blank'
title='Share via text message' title='Share via text message'
className={[_s.jcCenter, _s.aiCenter, _s.mr15, _s.px10, _s.bgSMS].join(' ')} className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10, _s.bgSMS].join(' ')}
/> />
<Button <Button
icon='facebook' icon='facebook'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='white' color='white'
backgroundColor='none' backgroundColor='none'
href={`https://www.facebook.com/sharer/sharer.php?u=${encodedStatusUrl}`} href={`https://www.facebook.com/sharer/sharer.php?u=${encodedStatusUrl}`}
target='_blank'
title='Share on Facebook' title='Share on Facebook'
className={[_s.jcCenter, _s.aiCenter, _s.mr15, _s.px10, _s.bgFacebook].join(' ')} className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10, _s.bgFacebook].join(' ')}
/> />
<Button <Button
icon='twitter' icon='twitter'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='white' color='white'
backgroundColor='none' backgroundColor='none'
href={`https://twitter.com/intent/tweet?url=${encodedStatusUrl}`} href={`https://twitter.com/intent/tweet?url=${encodedStatusUrl}`}
target='_blank'
title='Share on Twitter' title='Share on Twitter'
className={[_s.jcCenter, _s.aiCenter, _s.mr15, _s.px10, _s.bgTwitter].join(' ')} className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10, _s.bgTwitter].join(' ')}
/> />
<Button <Button
icon='telegram' icon='telegram'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='white' color='white'
backgroundColor='none' backgroundColor='none'
href={`https://telegram.me/share/?url=${encodedStatusUrl}`} href={`https://telegram.me/share/?url=${encodedStatusUrl}`}
target='_blank'
title='Share on Telegram' title='Share on Telegram'
className={[_s.jcCenter, _s.aiCenter, _s.mr15, _s.px10, _s.bgTelegram].join(' ')} className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10, _s.bgTelegram].join(' ')}
/> />
<Button <Button
icon='reddit' icon='reddit'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='white' color='white'
backgroundColor='none' backgroundColor='none'
href={`http://www.reddit.com/submit?url=${encodedStatusUrl}&title=Gab`} href={`http://www.reddit.com/submit?url=${encodedStatusUrl}&title=Gab`}
title='Share on Reddit' title='Share on Reddit'
className={[_s.jcCenter, _s.aiCenter, _s.px10, _s.mr15, _s.bgReddit].join(' ')} target='_blank'
className={[_s.jcCenter, _s.aiCenter, _s.px10, _s.mr10, _s.bgReddit].join(' ')}
/> />
<Button <Button
icon='email' icon='email'
iconSize='20px' iconSize={iconSize}
iconClassName={_s.inheritFill} iconClassName={_s.inheritFill}
color='white' color='white'
backgroundColor='black' backgroundColor='black'
href={mailToHref} href={mailToHref}
target='_blank'
title='Share via email' title='Share via email'
className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10].join(' ')} className={[_s.jcCenter, _s.aiCenter, _s.mr10, _s.px10].join(' ')}
/> />