chore: only add bottom safe area padding in note view if note is locked

packages/web/src/javascripts/Components/NoteView/EditorContentWithSafeAreaPadding.tsx

@@ -6,9 +6,11 @@ import { useAvailableSafeAreaPadding } from '@/Hooks/useSafeAreaPadding'
 
 export const EditorContentWithSafeAreaPadding = forwardRef(function EditorContentWithSafeAreaPadding(
   {
+    isNoteLocked,
     editorLineWidth,
     children,
   }: {
+    isNoteLocked: boolean
     editorLineWidth: EditorLineWidth
     children: NonNullable<ReactNode>
   },
@@ -22,7 +24,7 @@ export const EditorContentWithSafeAreaPadding = forwardRef(function EditorConten
       className={classNames(
         ElementIds.EditorContent,
         'z-editor-content overflow-auto sm:[&>*]:mx-[var(--editor-margin)] sm:[&>*]:max-w-[var(--editor-max-width)]',
-        hasBottomInset && 'pb-safe-bottom',
+        hasBottomInset && isNoteLocked && 'pb-safe-bottom',
       )}
       style={
         {

packages/web/src/javascripts/Components/NoteView/NoteView.tsx

@@ -955,7 +955,11 @@ class NoteView extends AbstractComponent<NoteViewProps, State> {
           </div>
         )}
 
-        <EditorContentWithSafeAreaPadding editorLineWidth={this.state.editorLineWidth} ref={this.editorContentRef}>
+        <EditorContentWithSafeAreaPadding
+          isNoteLocked={this.state.noteLocked}
+          editorLineWidth={this.state.editorLineWidth}
+          ref={this.editorContentRef}
+        >
           {editorMode === 'component' && this.state.editorComponentViewer && (
             <div className="component-view relative flex-grow">
               {this.state.paneGestureEnabled && <div className="absolute left-0 top-0 h-full w-[20px] md:hidden" />}