Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-31 10:26:08 +01:00
Code Issues Packages Projects Releases Activity

auto resizing (full height) of tree and editor to fill the window without creating global scrollbar (instead there are independent scrollbars for tree and editor)

Browse Source
This commit is contained in:
azivner
2017-08-15 22:32:30 -04:00
parent b986e93356
commit bd19dd3e55
4 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/templates/app.html
View File

@@ -11,11 +11,11 @@
<span id="error-message"></span> <span id="error-message"></span>
</div> </div>
<div style="margin-left: auto; margin-right: auto; width: 1100px"> <div id="content" style="margin-left: auto; margin-right: auto; width: 1100px">
<div style="width: 300px; height: 800px; float: left; overflow: scroll;"> <div style="width: 300px; height: 100%; float: left;">
<button type="button" class="btn" onclick="createNewTopLevelNote()">Create new note</button> <button type="button" class="btn" onclick="createNewTopLevelNote()">Create new note</button>
<div id="tree"> <div id="tree" style="overflow: scroll; height: 100%;">
</div> </div>
</div> </div>
@@ -32,7 +32,7 @@
<div style="clear: both; height: 0"></div> <div style="clear: both; height: 0"></div>
<div id="noteDetail"> <div id="noteDetail" style="overflow: scroll; height: 100%;">
<p>This prototype version supports basic editing, including some formatting (bold, italic, strike-through, underscore), images (just paste it into editor) and links. To edit the note, just click on title or content and you can directly modify it. Changes are saved immediatelly.</p> <p>This prototype version supports basic editing, including some formatting (bold, italic, strike-through, underscore), images (just paste it into editor) and links. To edit the note, just click on title or content and you can directly modify it. Changes are saved immediatelly.</p>
<p>You can work with the tree using following keyboard shortcuts:</p> <p>You can work with the tree using following keyboard shortcuts:</p>
@@ -71,6 +71,7 @@
const baseUrl = ''; const baseUrl = '';
</script> </script>
<script src="stat/js/init.js"></script>
<script src="stat/js/tree.js"></script> <script src="stat/js/tree.js"></script>
<script src="stat/js/note.js"></script> <script src="stat/js/note.js"></script>
<script src="stat/js/notecase2html.js"></script> <script src="stat/js/notecase2html.js"></script>

7
static/js/init.js Normal file
View File

@@ -0,0 +1,7 @@
$(function() {
$(window).resize(function() {
$('div#tree').height($(window).height() - $('div#tree').offset().top);
$('div.note-editable').height($(window).height() - $('div.note-editable').offset().top);
});
$(window).resize();
});

2
static/js/note.js
View File

@@ -135,6 +135,8 @@ function loadNote(noteId) {
$('#noteDetail').summernote('code', noteText); $('#noteDetail').summernote('code', noteText);
$(window).resize(); // to trigger resizing of editor
noteChangeDisabled = false; noteChangeDisabled = false;
}); });
} }

1
static/style.css
View File

@@ -1,6 +1,7 @@
.note-editable { .note-editable {
/* This is because with empty content height of editor is 0 and it's impossible to click into it */ /* This is because with empty content height of editor is 0 and it's impossible to click into it */
min-height: 400px; min-height: 400px;
overflow: scroll;
} }
#top-message { #top-message {