fix visual glitch in search - showing search now doesn't move note content

This commit is contained in:
azivner 2018-02-05 20:53:04 -05:00
parent 02e07ec03a
commit aee64b2522
3 changed files with 15 additions and 9 deletions

View file

@ -3,7 +3,7 @@
const noteTree = (function() {
const treeEl = $("#tree");
const parentListEl = $("#parent-list");
const parentListListEl = $("#parent-list-list");
const parentListListEl = $("#parent-list-inner");
let startNotePath = null;
let notesTreeMap = {};

View file

@ -5,13 +5,18 @@
display: grid;
grid-template-areas: "header header"
"tree-actions title"
"search note-content"
"tree note-content"
"parent-list note-content"
"parent-list attribute-list";
grid-template-columns: 2fr 5fr;
grid-template-rows: auto
auto
1fr;
auto
1fr
auto
auto;
justify-content: center;
grid-gap: 10px;
}
@ -135,6 +140,7 @@ div.ui-tooltip {
margin-left: 20px;
border-top: 2px solid #eee;
padding-top: 10px;
grid-area: parent-list;
}
#parent-list ul {

View file

@ -56,13 +56,13 @@
<img src="images/icons/search.png" alt="Search in notes"/>
</a>
</div>
</div>
<div id="search-box" style="display: none; padding: 10px; margin-top: 10px;">
<div style="display: flex; align-items: center;">
<label>Search:</label>
<input name="search-text" style="flex-grow: 100; margin-left: 5px; margin-right: 5px;" autocomplete="off">
<button id="reset-search-button" class="btn btn-sm" title="Reset search">&times;</button>
</div>
<div id="search-box" class="hide-toggle" style="grid-area: search; display: none; padding: 10px; margin-top: 10px;">
<div style="display: flex; align-items: center;">
<label>Search:</label>
<input name="search-text" style="flex-grow: 100; margin-left: 5px; margin-right: 5px;" autocomplete="off">
<button id="reset-search-button" class="btn btn-sm" title="Reset search">&times;</button>
</div>
</div>
@ -72,7 +72,7 @@
<div id="parent-list" class="hide-toggle">
<p><strong>Note locations:</strong></p>
<ul id="parent-list-list"></ul>
<ul id="parent-list-inner"></ul>
</div>
<div class="hide-toggle" style="grid-area: title;">