.qr-image {
margin: 5px;
}
- .qr-hint {
+ .qr-hint,
+ .qr-warning {
padding: 2px;
+ max-width: 150px;
}
.more-info {
cursor: help;
<div class="qr-container hidden">
<div class="qr-hint bg-primary" data-translate>Click field to hide QR</div>
<div class="qr-hint bg-primary hidden" data-translate>Click field to show QR</div>
- <div class="qr-image"></div>
+ <div class="qr-hider">
+ <div class="qr-image"></div>
+ <div class="qr-warning bg-primary" data-translate>Caution: Scanner may keep history</div>
+ </div>
</div>
<div class="feedback-container">
DOM.privateKeyToggle = $(".private-key-toggle");
DOM.languages = $(".languages a");
DOM.qrContainer = $(".qr-container");
+ DOM.qrHider = DOM.qrContainer.find(".qr-hider");
DOM.qrImage = DOM.qrContainer.find(".qr-image");
DOM.qrHint = DOM.qrContainer.find(".qr-hint");
DOM.showQrEls = $("[data-show-qr]");
var size = 130;
DOM.qrImage.qrcode({width: size, height: size, text: content});
if (!showQr) {
- DOM.qrImage.addClass("hidden");
+ DOM.qrHider.addClass("hidden");
+ }
+ else {
+ DOM.qrHider.removeClass("hidden");
}
DOM.qrContainer.removeClass("hidden");
}
function toggleQr() {
showQr = !showQr;
- DOM.qrImage.toggleClass("hidden");
+ DOM.qrHider.toggleClass("hidden");
DOM.qrHint.toggleClass("hidden");
}