zadam/trilium
1
1
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2024-12-28 10:52:18 +08:00
Code Issues Projects Releases Packages Wiki Activity

chaged "focused mode" - now title is displayed as well and together with content takes whole window

Browse source
This commit is contained in:
azivner 2018-06-10 10:53:39 -04:00
parent b255cf190c
commit 26066f39b1
3 changed files with 66 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/public/javascripts/services/entrypoints.js
View file

@ -58,7 +58,13 @@ function registerEntrypoints() {
utils.bindShortcut('alt+right', window.history.forward); utils.bindShortcut('alt+right', window.history.forward);
} }
utils.bindShortcut('alt+m', e => $(".hide-toggle").toggleClass("suppressed")); utils.bindShortcut('alt+m', e => {
$(".hide-toggle").toggle();
// when hiding switch display to block, otherwise grid still tries to display columns which shows
// left empty column
$("#container").css("display", $("#container").css("display") === "grid" ? "block" : "grid");
});
// hide (toggle) everything except for the note content for distraction free writing // hide (toggle) everything except for the note content for distraction free writing
utils.bindShortcut('alt+t', e => { utils.bindShortcut('alt+t', e => {

2
src/public/stylesheets/style.css
View file

@ -244,7 +244,7 @@ div.ui-tooltip {
} }
.suppressed { .suppressed {
filter: opacity(7%); display: none;
} }
#note-type .dropdown-menu li:not(.divider) { #note-type .dropdown-menu li:not(.divider) {

114
src/views/index.ejs
View file

@ -105,8 +105,8 @@
</div> </div>
<div style="grid-area: title;"> <div style="grid-area: title;">
<div class="hide-toggle" style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<div class="dropdown"> <div class="dropdown hide-toggle">
<button id="note-path-list-button" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm dropdown-toggle"> <button id="note-path-list-button" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm dropdown-toggle">
<span id="note-path-count">1 path</span> <span id="note-path-count">1 path</span>
@ -118,67 +118,69 @@
<input autocomplete="off" value="" id="note-title" style="margin-left: 15px; font-size: x-large; border: 0; flex-grow: 100;" tabindex="1"> <input autocomplete="off" value="" id="note-title" style="margin-left: 15px; font-size: x-large; border: 0; flex-grow: 100;" tabindex="1">
<span id="note-id-display" title="Note ID"></span> <div class="hide-toggle" style="display: flex; align-items: center;">
<span id="note-id-display" title="Note ID"></span>
<button class="btn btn-sm icon-button" <button class="btn btn-sm icon-button"
style="display: none; margin-right: 10px; background-image: url('/images/icons/edit-20.png');" style="display: none; margin-right: 10px; background-image: url('/images/icons/edit-20.png');"
title="Toggle edit" title="Toggle edit"
id="toggle-edit-button"></button> id="toggle-edit-button"></button>
<button class="btn btn-sm icon-button" <button class="btn btn-sm icon-button"
style="display: none; margin-right: 10px; background-image: url('/images/icons/play-20.png');" style="display: none; margin-right: 10px; background-image: url('/images/icons/play-20.png');"
title="Render (Ctrl+Enter)" title="Render (Ctrl+Enter)"
id="render-button"></button> id="render-button"></button>
<button class="btn btn-sm icon-button" <button class="btn btn-sm icon-button"
style="display: none; margin-right: 10px; background-image: url('/images/icons/play-20.png');" style="display: none; margin-right: 10px; background-image: url('/images/icons/play-20.png');"
title="Execute (Ctrl+Enter)" title="Execute (Ctrl+Enter)"
id="execute-script-button"></button> id="execute-script-button"></button>
<div> <div>
<button type="button" <button type="button"
class="btn btn-sm icon-button" class="btn btn-sm icon-button"
id="protect-button" id="protect-button"
title="Protected note can be viewed and edited only after entering password" title="Protected note can be viewed and edited only after entering password"
style="background-image: url('/images/icons/shield-20.png');"> style="background-image: url('/images/icons/shield-20.png');">
</button><button type="button" </button><button type="button"
class="btn btn-sm icon-button" class="btn btn-sm icon-button"
id="unprotect-button" id="unprotect-button"
title="Not protected note can be viewed without entering password" title="Not protected note can be viewed without entering password"
style="background-image: url('/images/icons/shield-off-20.png');"> style="background-image: url('/images/icons/shield-off-20.png');">
</button> </button>
</div> </div>
&nbsp; &nbsp; &nbsp; &nbsp;
<div class="dropdown" id="note-type" data-bind="visible: type() != 'search'"> <div class="dropdown" id="note-type" data-bind="visible: type() != 'search'">
<button data-bind="disable: isDisabled()" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm"> <button data-bind="disable: isDisabled()" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm">
Type: <span data-bind="text: typeString()"></span> Type: <span data-bind="text: typeString()"></span>
<span class="caret"></span> <span class="caret"></span>
</button> </button>
<ul id="note-type-dropdown" class="dropdown-menu dropdown-menu-right"> <ul id="note-type-dropdown" class="dropdown-menu dropdown-menu-right">
<li data-bind="click: selectText, css: { selected: type() == 'text' }"><span class="check">&check;</span> <strong>Text</strong></li> <li data-bind="click: selectText, css: { selected: type() == 'text' }"><span class="check">&check;</span> <strong>Text</strong></li>
<li role="separator" class="divider"></li> <li role="separator" class="divider"></li>
<li data-bind="click: selectRender, css: { selected: type() == 'render' && mime() == '' }"><span class="check">&check;</span> <strong>Render HTML note</strong></li> <li data-bind="click: selectRender, css: { selected: type() == 'render' && mime() == '' }"><span class="check">&check;</span> <strong>Render HTML note</strong></li>
<li role="separator" class="divider"></li> <li role="separator" class="divider"></li>
<li data-bind="click: selectCode, css: { selected: type() == 'code' && mime() == '' }"><span class="check">&check;</span> <strong>Code</strong></li> <li data-bind="click: selectCode, css: { selected: type() == 'code' && mime() == '' }"><span class="check">&check;</span> <strong>Code</strong></li>
<!-- ko foreach: codeMimeTypes --> <!-- ko foreach: codeMimeTypes -->
<li data-bind="click: $parent.selectCodeMime, css: { selected: $parent.type() == 'code' && $parent.mime() == mime }"><span class="check">&check;</span> <span data-bind="text: title"></span></li> <li data-bind="click: $parent.selectCodeMime, css: { selected: $parent.type() == 'code' && $parent.mime() == mime }"><span class="check">&check;</span> <span data-bind="text: title"></span></li>
<!-- /ko --> <!-- /ko -->
</ul> </ul>
</div> </div>
<div class="dropdown" id="note-actions"> <div class="dropdown" id="note-actions">
<button type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm"> <button type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="btn btn-sm">
Note actions Note actions
<span class="caret"></span> <span class="caret"></span>
</button> </button>
<ul class="dropdown-menu dropdown-menu-right"> <ul class="dropdown-menu dropdown-menu-right">
<li><a id="show-note-revisions-button">Note revisions</a></li> <li><a id="show-note-revisions-button">Note revisions</a></li>
<li><a class="show-labels-button"><kbd>Alt+L</kbd> Labels</a></li> <li><a class="show-labels-button"><kbd>Alt+L</kbd> Labels</a></li>
<li><a id="show-source-button"><kbd>Ctrl+U</kbd> HTML source</a></li> <li><a id="show-source-button"><kbd>Ctrl+U</kbd> HTML source</a></li>
<li><a id="upload-file-button">Upload file</a></li> <li><a id="upload-file-button">Upload file</a></li>
</ul> </ul>
</div>
</div> </div>
</div> </div>
</div> </div>