encrypt / decrypt is now using icons next to note title

This commit is contained in:
azivner 2017-09-10 21:33:39 -04:00
parent 19561191f6
commit 7c0f89bc95
4 changed files with 35 additions and 16 deletions

View File

@ -26,11 +26,11 @@
<span id="matches"></span> <span id="matches"></span>
</p> </p>
<a onclick="createNewTopLevelNote()" title="Create new top level note"> <a onclick="createNewTopLevelNote()" title="Create new top level note" class="icon-action">
<img src="stat/icons/file-plus.png" alt="Create new top level note"/> <img src="stat/icons/file-plus.png" alt="Create new top level note"/>
</a> </a>
<a onclick="collapseTree()" title="Collapse tree"> <a onclick="collapseTree()" title="Collapse tree" class="icon-action">
<img src="stat/icons/list.png" alt="Collapse tree"/> <img src="stat/icons/list.png" alt="Collapse tree"/>
</a> </a>
@ -40,14 +40,30 @@
<div id="noteDetailWrapper"> <div id="noteDetailWrapper">
<div style="float: left; margin: 0 5px 5px 5px;" class="hide-toggle"> <div style="float: left; margin: 0 5px 5px 5px;" class="hide-toggle">
<button class="btn btn-sm" <!--<button class="btn btn-sm"-->
onclick="encryptNoteAndSendToServer();" <!--onclick="encryptNoteAndSendToServer();"-->
title="Encrypt the note so that password will be required to view the note" <!--title="Encrypt the note so that password will be required to view the note"-->
id="encryptButton">Encrypt</button> <!--id="encryptButton">Encrypt</button>-->
<button class="btn btn-sm" <!--<button class="btn btn-sm"-->
onclick="decryptNoteAndSendToServer();" <!--onclick="decryptNoteAndSendToServer();"-->
title="Decrypt note permamently so that password will not be required to access this note in the future" <!--title="Decrypt note permamently so that password will not be required to access this note in the future"-->
id="decryptButton">Decrypt</button> <!--id="decryptButton">Decrypt</button>-->
<a onclick="encryptNoteAndSendToServer()"
title="Encrypt the note so that password will be required to view the note"
class="icon-action"
id="encryptButton">
<img src="stat/icons/lock.png" alt="Encrypt note"/>
</a>
<a onclick="decryptNoteAndSendToServer()"
title="Decrypt note permamently so that password will not be required to access this note in the future"
class="icon-action"
id="decryptButton">
<img src="stat/icons/unlock.png" alt="Decrypt note"/>
</a>
&nbsp;
<input autocomplete="off" value="Welcome to Notecase web app!" id="noteTitle" style="font-size: x-large; border: 0; width: 600px;" tabindex="1"> <input autocomplete="off" value="Welcome to Notecase web app!" id="noteTitle" style="font-size: x-large; border: 0; width: 600px;" tabindex="1">
</div> </div>

BIN
static/icons/lock.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 323 B

BIN
static/icons/unlock.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 337 B

View File

@ -71,12 +71,15 @@ span.fancytree-node.encrypted.fancytree-folder > span.fancytree-icon {
overflow-x: hidden; overflow-x: hidden;
} }
#encryptButton { .icon-action:hover {
position: absolute; text-decoration: none;
left: 950px;
} }
#decryptButton { #encryptButton, #decryptButton {
position: absolute; display: none;
left: 950px; }
#encryptButton img, #decryptButton img {
top: -5px;
position: relative;
} }