Revert "Revert "feat: updated "note editing disabled" design (#1033)""

This reverts commit 15f6b1ce13.
This commit is contained in:
Mo
2022-05-20 11:41:21 -05:00
parent 09af8bf6d8
commit a90ca4d2f6
3 changed files with 10 additions and 12 deletions

View File

@@ -919,7 +919,7 @@ export class NoteView extends PureComponent<Props, State> {
<div className="sn-component"> <div className="sn-component">
{this.state.noteLocked && ( {this.state.noteLocked && (
<div <div
className="sk-app-bar no-edges" className="flex items-center px-3.5 py-2 bg-warning cursor-pointer"
onMouseLeave={() => { onMouseLeave={() => {
this.setState({ this.setState({
lockText: 'Note Editing Disabled', lockText: 'Note Editing Disabled',
@@ -932,16 +932,14 @@ export class NoteView extends PureComponent<Props, State> {
showLockedIcon: false, showLockedIcon: false,
}) })
}} }}
onClick={() => this.appState.notes.setLockSelectedNotes(!this.state.noteLocked)}
> >
<div {this.state.showLockedIcon ? (
onClick={() => this.appState.notes.setLockSelectedNotes(!this.state.noteLocked)} <Icon type="pencil-off" className="color-accessory-tint-3 flex fill-current mr-3" />
className="sk-app-bar-item" ) : (
> <Icon type="pencil" className="color-accessory-tint-3 flex fill-current mr-3" />
<div className="sk-label warning flex items-center"> )}
{this.state.showLockedIcon && <Icon type="pencil-off" className="flex fill-current mr-2" />} <span className="color-grey-0">{this.state.lockText}</span>
{this.state.lockText}
</div>
</div>
</div> </div>
)} )}
</div> </div>

View File

@@ -167,7 +167,7 @@ const NoteSizeWarning: FunctionComponent<{
note: SNNote note: SNNote
}> = ({ note }) => { }> = ({ note }) => {
return new Blob([note.text]).size > NOTE_SIZE_WARNING_THRESHOLD ? ( return new Blob([note.text]).size > NOTE_SIZE_WARNING_THRESHOLD ? (
<div className="flex items-center px-3 py-3.5 relative bg-note-size-warning"> <div className="flex items-center px-3 py-3.5 relative bg-warning">
<Icon type="warning" className="color-accessory-tint-3 flex-shrink-0 mr-3" /> <Icon type="warning" className="color-accessory-tint-3 flex-shrink-0 mr-3" />
<div className="color-grey-0 select-none leading-140% max-w-80%"> <div className="color-grey-0 select-none leading-140% max-w-80%">
This note may have trouble syncing to the mobile application due to its size. This note may have trouble syncing to the mobile application due to its size.

View File

@@ -1017,7 +1017,7 @@
box-shadow: currentcolor 0px -1px 0px 0px inset, currentcolor 0px 1px 0px 0px; box-shadow: currentcolor 0px -1px 0px 0px inset, currentcolor 0px 1px 0px 0px;
} }
.bg-note-size-warning { .bg-warning {
background-color: rgba(235, 173, 0, 0.08); background-color: rgba(235, 173, 0, 0.08);
} }