Handle displaying folder select: small screen vs. un-/locked vault

This commit is contained in:
Daniel James Smith 2021-10-28 23:23:00 +02:00
parent da80904d54
commit d495ed6c1f
No known key found for this signature in database
GPG Key ID: 03E4BD365FF06726
3 changed files with 11 additions and 2 deletions

View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
@ -25,6 +25,7 @@
<div class="add-text"></div> <div class="add-text"></div>
<div class="add-buttons"> <div class="add-buttons">
<button type="button" class="never-save link " short-text="" full-text=""></button> <button type="button" class="never-save link " short-text="" full-text=""></button>
<select class="select-folder" isVaultLocked="false"></select>
<button type="button" class="add-save" short-text="" full-text=""></button> <button type="button" class="add-save" short-text="" full-text=""></button>
</div> </div>
</div> </div>

View File

@ -33,6 +33,7 @@ document.addEventListener('DOMContentLoaded', () => {
var selectFolder = document.querySelector('#template-add .select-folder'); var selectFolder = document.querySelector('#template-add .select-folder');
selectFolder.setAttribute('aria-label', i18n.folder); selectFolder.setAttribute('aria-label', i18n.folder);
selectFolder.setAttribute('isVaultLocked', isVaultLocked.toString());
var addButton = document.querySelector('#template-add .add-save'); var addButton = document.querySelector('#template-add .add-save');
addButton.setAttribute('short-text', i18n.yes); addButton.setAttribute('short-text', i18n.yes);

View File

@ -1,4 +1,4 @@
body { body {
background-color: #ffffff; background-color: #ffffff;
padding: 0; padding: 0;
margin: 0; margin: 0;
@ -76,6 +76,9 @@ button.neutral {
} }
} }
.select-folder[isVaultLocked="true"] {
display: none
}
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.never-save::after { .never-save::after {
@ -103,6 +106,10 @@ button.neutral {
.change-save::after { .change-save::after {
content: attr(short-text); content: attr(short-text);
} }
.select-folder {
display: none
}
} }
@media (print) { @media (print) {