Fix fullwidth media CSS bugs with NSFW video, and bad spoiler margin on static pages (#60)
* Fix fullwidth style not applied to NSFW video correctly * Fix botched video .media-spoiler margin on static pageslolsob-rspec
parent
319e8e3041
commit
0b15430dbe
|
@ -138,7 +138,7 @@ export default class VideoPlayer extends React.PureComponent {
|
|||
if (!this.state.visible) {
|
||||
if (sensitive) {
|
||||
return (
|
||||
<div role='button' tabIndex='0' style={{ height: `${height}px` }} className='media-spoiler' onClick={this.handleVisibility}>
|
||||
<div role='button' tabIndex='0' style={{ height: `${height}px` }} className={`media-spoiler ${fullwidth ? 'full-width' : ''}`} onClick={this.handleVisibility}>
|
||||
{spoilerButton}
|
||||
<span className='media-spoiler__warning'><FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' /></span>
|
||||
<span className='media-spoiler__trigger'><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span>
|
||||
|
@ -146,7 +146,7 @@ export default class VideoPlayer extends React.PureComponent {
|
|||
);
|
||||
} else {
|
||||
return (
|
||||
<div role='button' tabIndex='0' style={{ height: `${height}px` }} className='media-spoiler' onClick={this.handleVisibility}>
|
||||
<div role='button' tabIndex='0' style={{ height: `${height}px` }} className={`media-spoiler ${fullwidth ? 'full-width' : ''}`} onClick={this.handleVisibility}>
|
||||
{spoilerButton}
|
||||
<span className='media-spoiler__warning'><FormattedMessage id='status.media_hidden' defaultMessage='Media hidden' /></span>
|
||||
<span className='media-spoiler__trigger'><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span>
|
||||
|
|
|
@ -2319,9 +2319,13 @@ button.icon-button.active i.fa-retweet {
|
|||
text-align: center;
|
||||
z-index: 100;
|
||||
|
||||
.status__content > & {
|
||||
margin-top: 15px; // Add margin when used bare for NSFW video player
|
||||
.media-gallery & {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
&.full-width {
|
||||
margin-left: -68px;
|
||||
width: calc(100% + 80px);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue