mirror of
https://github.com/whippyshou/mastodon
synced 2024-11-25 07:37:08 +09:00
Remove unnecessary translateZ(0) when doing scale() (#5473)
This commit is contained in:
parent
049381b284
commit
8392ddbf87
@ -68,7 +68,7 @@ export default class Upload extends ImmutablePureComponent {
|
|||||||
<div className='compose-form__upload' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>
|
<div className='compose-form__upload' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>
|
||||||
<Motion defaultStyle={{ scale: 0.8 }} style={{ scale: spring(1, { stiffness: 180, damping: 12 }) }}>
|
<Motion defaultStyle={{ scale: 0.8 }} style={{ scale: spring(1, { stiffness: 180, damping: 12 }) }}>
|
||||||
{({ scale }) => (
|
{({ scale }) => (
|
||||||
<div className='compose-form__upload-thumbnail' style={{ transform: `translateZ(0) scale(${scale})`, backgroundImage: `url(${media.get('preview_url')})` }}>
|
<div className='compose-form__upload-thumbnail' style={{ transform: `scale(${scale})`, backgroundImage: `url(${media.get('preview_url')})` }}>
|
||||||
<IconButton icon='times' title={intl.formatMessage(messages.undo)} size={36} onClick={this.handleUndoClick} />
|
<IconButton icon='times' title={intl.formatMessage(messages.undo)} size={36} onClick={this.handleUndoClick} />
|
||||||
|
|
||||||
<div className={classNames('compose-form__upload-description', { active })}>
|
<div className={classNames('compose-form__upload-description', { active })}>
|
||||||
|
@ -47,7 +47,7 @@ class SensitiveButton extends React.PureComponent {
|
|||||||
'compose-form__sensitive-button--visible': visible,
|
'compose-form__sensitive-button--visible': visible,
|
||||||
});
|
});
|
||||||
return (
|
return (
|
||||||
<div className={className} style={{ transform: `translateZ(0) scale(${scale})` }}>
|
<div className={className} style={{ transform: `scale(${scale})` }}>
|
||||||
<IconButton
|
<IconButton
|
||||||
className='compose-form__sensitive-button__icon'
|
className='compose-form__sensitive-button__icon'
|
||||||
title={intl.formatMessage(messages.title)}
|
title={intl.formatMessage(messages.title)}
|
||||||
|
@ -40,7 +40,7 @@ export default class UploadArea extends React.PureComponent {
|
|||||||
{({ backgroundOpacity, backgroundScale }) =>
|
{({ backgroundOpacity, backgroundScale }) =>
|
||||||
<div className='upload-area' style={{ visibility: active ? 'visible' : 'hidden', opacity: backgroundOpacity }}>
|
<div className='upload-area' style={{ visibility: active ? 'visible' : 'hidden', opacity: backgroundOpacity }}>
|
||||||
<div className='upload-area__drop'>
|
<div className='upload-area__drop'>
|
||||||
<div className='upload-area__background' style={{ transform: `translateZ(0) scale(${backgroundScale})` }} />
|
<div className='upload-area__background' style={{ transform: `scale(${backgroundScale})` }} />
|
||||||
<div className='upload-area__content'><FormattedMessage id='upload_area.title' defaultMessage='Drag & drop to upload' /></div>
|
<div className='upload-area__content'><FormattedMessage id='upload_area.title' defaultMessage='Drag & drop to upload' /></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -3008,21 +3008,21 @@ button.icon-button.active i.fa-retweet {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.fa-search {
|
.fa-search {
|
||||||
transform: translateZ(0) rotate(90deg);
|
transform: rotate(90deg);
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
transform: translateZ(0) rotate(0deg);
|
transform: rotate(0deg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.fa-times-circle {
|
.fa-times-circle {
|
||||||
top: 11px;
|
top: 11px;
|
||||||
transform: translateZ(0) rotate(0deg);
|
transform: rotate(0deg);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
transform: translateZ(0) rotate(90deg);
|
transform: rotate(90deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
Loading…
Reference in New Issue
Block a user