diff options
-rw-r--r-- | src/client/views/DocumentDecorations.scss | 5 | ||||
-rw-r--r-- | src/client/views/DocumentDecorations.tsx | 4 |
2 files changed, 7 insertions, 2 deletions
diff --git a/src/client/views/DocumentDecorations.scss b/src/client/views/DocumentDecorations.scss index a4d4af2f0..0a96b058b 100644 --- a/src/client/views/DocumentDecorations.scss +++ b/src/client/views/DocumentDecorations.scss @@ -152,6 +152,11 @@ $linkGap : 3px; text-align: center; display: flex; border-bottom: solid 1px; + margin-left:10px; + width: calc(100% - 10px); + } + .focus-visible { + margin-left:0px; } .publishBox { width: 20px; diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 04f02c683..e7a237e62 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -466,7 +466,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> const titleArea = this._edtingTitle ? <> - <input ref={this._keyinput} className="documentDecorations-title" type="text" name="dynbox" autoComplete="on" value={this._accumulatedTitle} style={{ width: minimal ? "100%" : "calc(100% - 20px)" }} + <input ref={this._keyinput} className="documentDecorations-title" type="text" name="dynbox" autoComplete="on" value={this._accumulatedTitle} onBlur={e => this.titleBlur(true)} onChange={action(e => this._accumulatedTitle = e.target.value)} onKeyPress={this.titleEntered} /> {minimal ? (null) : <div className="publishBox" title="make document referenceable by its title" onPointerDown={action(e => { @@ -485,7 +485,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> <FontAwesomeIcon size="lg" icon="cog" /> </div>} <div className="documentDecorations-title" key="title" onPointerDown={this.onTitleDown} > - <span style={{ width: "calc(100% - 25px)", display: "inline-block" }}>{`${this.selectionTitle}`}</span> + <span style={{ width: "100%", display: "inline-block" }}>{`${this.selectionTitle}`}</span> </div> </>; |