Improvements for #62

This commit is contained in:
djmaze 2021-03-25 10:08:29 +01:00
parent 23e15fd161
commit 673bd49095
12 changed files with 45 additions and 59 deletions

12
dev/External/ko.js vendored
View file

@ -1,4 +1,4 @@
import { i18n, i18nToNodes, trigger } from 'Common/Translator';
import { i18nToNodes } from 'Common/Translator';
import { doc, createElement } from 'Common/Globals';
import { SaveSettingsStep } from 'Common/Enums';
import { isNonEmptyArray, isFunction } from 'Common/Utils';
@ -6,16 +6,6 @@ import { isNonEmptyArray, isFunction } from 'Common/Utils';
const
koValue = value => !ko.isObservable(value) && isFunction(value) ? value() : ko.unwrap(value);
ko.bindingHandlers.tooltip = {
init: (element, fValueAccessor) => {
const sValue = koValue(fValueAccessor());
element.title = i18n(sValue);
trigger.subscribe(() => element.title = i18n(sValue));
},
update: (element, fValueAccessor) =>
element.title = i18n(koValue(fValueAccessor()))
};
ko.bindingHandlers.tooltipErrorTip = {
init: element => {
doc.addEventListener('click', () => element.removeAttribute('data-rainloopErrorTip'));

View file

@ -23,7 +23,7 @@
autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false"
data-i18n="[placeholder]LOGIN/LABEL_PASSWORD"
data-bind="textInput: password, disable: submitRequest" />
<span class="add-on" tabindex="-1" data-bind="command: submitCommand, tooltip: 'LOGIN/BUTTON_LOGIN'">
<span class="add-on" tabindex="-1" data-bind="command: submitCommand" data-i18n="[title]LOGIN/BUTTON_LOGIN">
<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()"></button>
</span>

View file

@ -1,7 +1,6 @@
<div class="b-login-content">
<div class="loginFormWrapper" data-bind="css: {'afterLoginHide': formHidden}">
<div class="descWrapper plugin-mark-Login-AfterLogoDescription"
data-bind="visible: '' !== loadingDesc">
<div class="descWrapper" data-bind="visible: '' !== loadingDesc">
<span class="desc" data-bind="text: loadingDesc"></span>
</div>
<div class="alert" data-bind="hidden: !submitError()" hidden="">
@ -15,8 +14,7 @@
<div class="wrapper-parent">
<form class="wrapper submitting-pane loginForm" action="#/"
data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}">
<div class="controls plugin-mark-Login-TopControlGroup"
data-bind="css: {'error': emailError}">
<div class="controls" data-bind="css: {'error': emailError}">
<div class="input-append">
<input required="" type="text" class="input-block-level inputEmail"
pattern="[^@\s]+(@[^\s]+)?" inputmode="email"
@ -35,14 +33,13 @@
data-bind="textInput: password, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/PASSWORD" />
<span class="add-on" tabindex="-1"
data-bind="command: submitCommand, tooltip: 'LOGIN/BUTTON_SIGN_IN'">
data-bind="command: submitCommand" data-i18n="[title]LOGIN/BUTTON_SIGN_IN">
<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()"></button>
</span>
</div>
</div>
<div class="controls"
data-bind="visible: additionalCodeVisibility(), css: {'error': additionalCodeError}">
<div class="controls" data-bind="visible: additionalCodeVisibility(), css: {'error': additionalCodeError}">
<div class="input-append">
<input type="text" class="input-block-level inputAdditionalCode"
inputmode="numeric"
@ -52,8 +49,7 @@
<span class="add-on"><i class="fontastic">🔑</i></span>
</div>
</div>
<div class="controls plugin-mark-Login-BottomControlGroup"
data-bind="visible: additionalCodeVisibility()">
<div class="controls" data-bind="visible: additionalCodeVisibility()">
<div class="additionalCodeSignMeLabel" data-bind="component: {
name: 'CheckboxSimple',
params: {
@ -62,6 +58,7 @@
}
}"></div>
</div>
<div id="plugin-Login-BottomControlGroup"></div>
<div class="controls" data-bind="hidden: hideSubmitButton">
<button type="submit" class="btn btn-large btn-block buttonLogin" data-bind="command: submitCommand">
<span class="i18n-animation" data-i18n="LOGIN/BUTTON_SIGN_IN"></span>
@ -70,7 +67,7 @@
<div class="controls clearfix" style="margin-bottom: 10px">
<div class="pull-right language-buttons">
<a href="#" tabindex="-1" class="language-button"
data-bind="visible: allowLanguagesOnLogin, click: selectLanguage, tooltip: 'POPUPS_LANGUAGES/TITLE_LANGUAGES'">
data-bind="visible: allowLanguagesOnLogin, click: selectLanguage" data-i18n="[title]POPUPS_LANGUAGES/TITLE_LANGUAGES">
<i class="fontastic" data-bind="css: { 'icon-spinner' : langRequest }">🌍</i>
</a>
</div>

View file

@ -1,10 +1,10 @@
<div class="b-folders g-ui-user-select-none" data-bind="css: {'focused': folderListFocused, 'single-root-inbox': foldersListWithSingleInboxRootFolder, 'inbox-is-starred': isInboxStarred}">
<div class="b-toolbar btn-toolbar hide-mobile">
<a class="btn buttonCompose" data-bind="visible: allowComposer, click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_NEW_MESSAGE', css: {'btn-warning': composeInEdit, 'btn-success': !composeInEdit()}">
<a class="btn buttonCompose" data-bind="visible: allowComposer, click: composeClick, css: {'btn-warning': composeInEdit, 'btn-success': !composeInEdit()}" data-i18n="[title]FOLDER_LIST/BUTTON_NEW_MESSAGE">
<i class="icon-paper-plane"></i>
<span class="buttonComposeText" data-i18n="FOLDER_LIST/BUTTON_NEW_MESSAGE"></span>
</a>
<a class="btn buttonContacts fontastic" data-bind="visible: allowContacts, click: contactsClick, tooltip: 'GLOBAL/CONTACTS'">📇</a>
<a class="btn buttonContacts fontastic" data-bind="visible: allowContacts, click: contactsClick" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
</div>
<div class="b-content opacity-on-panel-disabled" data-bind="css: {'inbox-is-starred': isInboxStarred}">
<div class="content">
@ -24,7 +24,7 @@
</a>
</div>
<div class="btn-group hide-on-panel-disabled">
<a class="btn" data-bind="click: createFolder">
<a class="btn" data-bind="click: createFolder" data-i18n="[title]POPUPS_CREATE_FOLDER/TITLE_CREATE_FOLDER">
<i data-bind="css: {'icon-folder-add': !foldersChanging(), 'icon-spinner': foldersChanging()}"></i>
</a>
<a class="btn fontastic" data-bind="click: configureFolders"></a>

View file

@ -5,15 +5,15 @@
<div class="btn-toolbar">
<a class="btn btn-thin-2 fontastic show-mobile" data-bind="click: hideLeft, visible: !leftPanelDisabled()"></a>
<a class="btn btn-thin-2 fontastic show-mobile" data-bind="click: showLeft, visible: leftPanelDisabled()"></a>
<a class="btn buttonCompose show-mobile" data-bind="click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_NEW_MESSAGE', css: {'btn-warning': composeInEdit, 'btn-success': !composeInEdit()}, visible: allowComposer && mobileCheckedStateHide()">
<a class="btn buttonCompose show-mobile" data-bind="click: composeClick, css: {'btn-warning': composeInEdit, 'btn-success': !composeInEdit()}, visible: allowComposer && mobileCheckedStateHide()" data-i18n="[title]FOLDER_LIST/BUTTON_NEW_MESSAGE">
<i class="icon-paper-plane"></i>
</a>
<a class="btn buttonReload" data-bind="command: reloadCommand, tooltip: 'MESSAGE_LIST/BUTTON_RELOAD', visible: allowReload && mobileCheckedStateHide()">
<a class="btn buttonReload" data-bind="command: reloadCommand, visible: allowReload && mobileCheckedStateHide()" data-i18n="[title]MESSAGE_LIST/BUTTON_RELOAD">
<i class="icon-spinner" data-bind="css: {'not-animated': !messageListCompleteLoadingThrottleForAnimation()}"></i>
</a>
<!-- ko if: !newMoveToFolder -->
<div class="btn-group dropdown colored-toggle hide-mobile" data-bind="visible: allowMessageListActions, registerBootstrapDropdown: true, openDropdownTrigger: moveDropdownTrigger">
<a id="move-dropdown-id" href="#" tabindex="-1" class="btn dropdown-toggle buttonMove" data-toggle="dropdown" data-bind="command: moveCommand, tooltip: 'GLOBAL/MOVE_TO'">
<a id="move-dropdown-id" href="#" tabindex="-1" class="btn dropdown-toggle buttonMove" data-toggle="dropdown" data-bind="command: moveCommand" data-i18n="[title]GLOBAL/MOVE_TO">
<i class="icon-copy visible-on-ctrl-btn"></i>
<i class="fontastic hidden-on-ctrl-btn">📁</i>
<span class="caret"></span>
@ -27,7 +27,7 @@
<!-- /ko -->
<!-- ko if: newMoveToFolder -->
<div class="btn-group" data-bind="visible: allowMessageListActions && mobileCheckedStateShow()">
<a id="move-dropdown-id" href="#" tabindex="-1" class="btn buttonMove" data-bind="command: moveNewCommand, tooltip: 'GLOBAL/MOVE_TO'">
<a id="move-dropdown-id" href="#" tabindex="-1" class="btn buttonMove" data-bind="command: moveNewCommand" data-i18n="[title]GLOBAL/MOVE_TO">
<i class="icon-copy visible-on-ctrl-btn"></i>
<i class="fontastic hidden-on-ctrl-btn">📁</i>
</a>
@ -35,19 +35,19 @@
<!-- /ko -->
<div class="btn-group" data-bind="visible: allowMessageListActions && mobileCheckedStateShow()">
<a class="btn button-archive"
data-bind="visible: isArchiveVisible, command: archiveCommand, tooltip: 'GLOBAL/TO_ARCHIVE'">
data-bind="visible: isArchiveVisible, command: archiveCommand" data-i18n="[title]GLOBAL/TO_ARCHIVE">
<i class="icon-archive"></i>
</a>
<a class="btn button-spam fontastic" data-bind="visible: isSpamVisible, command: spamCommand, tooltip: 'GLOBAL/SPAM'"></a>
<a class="btn button-spam fontastic" data-bind="visible: isSpamVisible, command: spamCommand" data-i18n="[title]GLOBAL/SPAM"></a>
<a class="btn button-not-spam"
data-bind="visible: isUnSpamVisible, command: notSpamCommand, tooltip: 'GLOBAL/NOT_SPAM'">
data-bind="visible: isUnSpamVisible, command: notSpamCommand" data-i18n="[title]GLOBAL/NOT_SPAM">
<i class="icon-check-mark-circle-two"></i>
</a>
<a class="btn button-delete fontastic"
data-bind="command: deleteCommand, tooltip: 'GLOBAL/DELETE'">🗑</a>
data-bind="command: deleteCommand" data-i18n="[title]GLOBAL/DELETE">🗑</a>
</div>
<div class="btn-group dropdown colored-toggle" data-bind="visible: allowComposer || allowMessageListActions || allowDangerousActions, registerBootstrapDropdown: true, openDropdownTrigger: moreDropdownTrigger">
<a id="more-list-dropdown-id" class="btn dropdown-toggle fontastic" href="#" tabindex="-1" data-toggle="dropdown" data-bind="tooltip: 'GLOBAL/MORE'"></a>
<a id="more-list-dropdown-id" class="btn dropdown-toggle fontastic" href="#" tabindex="-1" data-toggle="dropdown" data-i18n="[title]GLOBAL/MORE"></a>
<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="more-list-dropdown-id">
<div data-bind="visible: allowMessageListActions">
<li class="e-item" role="presentation" data-bind="click: listUnsetSeen, css: {'disabled': !hasCheckedOrSelectedLines()}">

View file

@ -2,21 +2,21 @@
<div class="messageView" data-bind="css: {'message-selected': isMessageSelected, 'message-focused': messageFocused}">
<div class="toolbar top-toolbar g-ui-user-select-none">
<div class="messageButtons btn-toolbar">
<div class="btn-group" data-bind="tooltip: 'GLOBAL/CLOSE'">
<div class="btn-group" data-i18n="[title]GLOBAL/CLOSE">
<a class="btn buttonClose fontastic" data-bind="command: closeMessageCommand"></a>
</div>
<div class="btn-group" data-bind="visible: isDraftFolder(), tooltip: 'MESSAGE/BUTTON_EDIT'">
<div class="btn-group" data-bind="visible: isDraftFolder()" data-i18n="[title]MESSAGE/BUTTON_EDIT">
<a class="btn btn-success buttonEdit fontastic" data-bind="command: messageEditCommand">🖉</a>
</div>
<div class="btn-group">
<a class="btn button-archive" data-bind="visible: !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled(), command: archiveCommand, tooltip: 'GLOBAL/TO_ARCHIVE'">
<a class="btn button-archive" data-bind="visible: !isDraftFolder() && !isArchiveFolder() && !isArchiveDisabled(), command: archiveCommand" data-i18n="[title]GLOBAL/TO_ARCHIVE">
<i class="icon-archive"></i>
</a>
<a class="btn button-spam fontastic" data-bind="visible: !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled(), command: spamCommand, tooltip: 'GLOBAL/SPAM'"></a>
<a class="btn button-not-spam" data-bind="visible: !isDraftFolder() && !isSentFolder() && isSpamFolder() && !isSpamDisabled(), command: notSpamCommand, tooltip: 'GLOBAL/NOT_SPAM'">
<a class="btn button-spam fontastic" data-bind="visible: !isDraftFolder() && !isSentFolder() && !isSpamFolder() && !isSpamDisabled(), command: spamCommand" data-i18n="[title]GLOBAL/SPAM"></a>
<a class="btn button-not-spam" data-bind="visible: !isDraftFolder() && !isSentFolder() && isSpamFolder() && !isSpamDisabled(), command: notSpamCommand" data-i18n="[title]GLOBAL/NOT_SPAM">
<i class="icon-check-mark-circle-two"></i>
</a>
<a class="btn button-delete fontastic" data-bind="command: deleteCommand, tooltip: 'GLOBAL/DELETE'">🗑</a>
<a class="btn button-delete fontastic" data-bind="command: deleteCommand" data-i18n="[title]GLOBAL/DELETE">🗑</a>
</div>
<div class="btn-group">
<a class="btn btn-thin buttonUp fontastic" data-bind="command: goUpCommand"></a>
@ -46,11 +46,11 @@
<div class="message-fixed-button-toolbar" data-bind="visible: message">
<div class="btn-group" style="margin-right: -11px;">
<a class="btn btn-thin-2 btn-transparent buttonReply fontastic"
data-bind="visible: 'reply' === lastReplyAction() && allowComposer, command: replyCommand, tooltip: 'MESSAGE/BUTTON_REPLY'">←</a>
data-bind="visible: 'reply' === lastReplyAction() && allowComposer, command: replyCommand" data-i18n="[title]MESSAGE/BUTTON_REPLY">←</a>
<a class="btn btn-thin-2 btn-transparent buttonReplyAll fontastic"
data-bind="visible: 'replyall' === lastReplyAction() && allowComposer, command: replyAllCommand, tooltip: 'MESSAGE/BUTTON_REPLY_ALL'">↞</a>
data-bind="visible: 'replyall' === lastReplyAction() && allowComposer, command: replyAllCommand" data-i18n="[title]MESSAGE/BUTTON_REPLY_ALL">↞</a>
<a class="btn btn-thin-2 btn-transparent buttonForward fontastic"
data-bind="visible: 'forward' === lastReplyAction() && allowComposer, command: forwardCommand, tooltip: 'MESSAGE/BUTTON_FORWARD'">→</a>
data-bind="visible: 'forward' === lastReplyAction() && allowComposer, command: forwardCommand" data-i18n="[title]MESSAGE/BUTTON_FORWARD">→</a>
<div class="btn-group" data-bind="registerBootstrapDropdown: true, visible: allowComposer || allowMessageListActions || allowMessageActions" style="display: inline-block">
<a class="btn btn-thin-2 btn-transparent dropdown-toggle" id="more-view-dropdown-id" href="#" tabindex="-1" data-toggle="dropdown" style="margin-left: -4px; margin-right: 2px">
<span data-bind="visible: allowComposer"></span>
@ -157,7 +157,7 @@
</div>
</div>
<div class="btn-group hide-mobile" data-bind="visible: isDraftFolder(), tooltip: 'MESSAGE/BUTTON_EDIT'" style="margin-right: 5px">
<div class="btn-group hide-mobile" data-bind="visible: isDraftFolder()" data-i18n="[title]MESSAGE/BUTTON_EDIT" style="margin-right: 5px">
<a class="btn btn-success buttonEdit fontastic" data-bind="command: messageEditCommand">🖉</a>
</div>
</div>

View file

@ -9,8 +9,8 @@
<span class="hide-mobile" data-i18n="GLOBAL/SAVE"></span>
</a>
<a class="close" data-bind="click: tryToClosePopup, tooltip: 'GLOBAL/CANCEL'">×</a>
<a class="minimize-custom" data-bind="click: skipCommand, tooltip: 'COMPOSE/BUTTON_MINIMIZE'"></a>
<a class="close" data-bind="click: tryToClosePopup" data-i18n="[title]GLOBAL/CANCEL">×</a>
<a class="minimize-custom" data-bind="click: skipCommand" data-i18n="[title]COMPOSE/BUTTON_MINIMIZE"></a>
<a class="btn btn-danger button-delete button-delete-transitions" data-bind="command: deleteCommand">
<i class="fontastic">🗑</i>
@ -76,7 +76,7 @@
</div>
<div class="btn-group pull-right">&nbsp;</div>
<div class="btn-group pull-right">
<a class="btn fontastic" data-bind="visible: allowContacts, command: contactsCommand, tooltip: 'GLOBAL/CONTACTS'">📇</a>
<a class="btn fontastic" data-bind="visible: allowContacts, command: contactsCommand" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
</div>
<div class="btn-group pull-right">&nbsp;</div>
</div>
@ -163,7 +163,7 @@
<div class="btn-group pull-right">
<a class="btn"
style="padding-left: 10px; padding-right: 10px;"
data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton, tooltip: 'COMPOSE/ATTACH_FILES'">
data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton" data-i18n="[title]COMPOSE/ATTACH_FILES">
<sup style="font-weight: bold; font-size: 100%; top: -0.3em;">+</sup><i class="icon-attachment"></i>
</a>
</div>

View file

@ -171,7 +171,7 @@
</div>
</div>
<div class="control-group" data-bind="visible: !viewReadOnly() || 0 < viewPropertiesEmails().length">
<label class="control-label fontastic iconsize24" data-bind="tooltip: 'GLOBAL/EMAIL'">@</label>
<label class="control-label fontastic iconsize24" data-i18n="[title]GLOBAL/EMAIL">@</label>
<div class="controls">
<div data-bind="foreach: viewPropertiesEmails">
<div class="property-line">
@ -185,7 +185,7 @@
</div>
</div>
<div class="control-group" data-bind="visible: 0 < viewPropertiesPhones().length">
<label class="control-label fontastic iconsize24" data-bind="tooltip: 'CONTACTS/LABEL_PHONE'">📞</label>
<label class="control-label fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_PHONE">📞</label>
<div class="controls">
<div data-bind="foreach: viewPropertiesPhones">
<div class="property-line">
@ -198,7 +198,7 @@
</div>
</div>
<div class="control-group" data-bind="visible: 0 < viewPropertiesWeb().length">
<label class="control-label fontastic iconsize24" data-bind="tooltip: 'CONTACTS/LABEL_WEB'">🌍</label>
<label class="control-label fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_WEB">🌍</label>
<div class="controls">
<div data-bind="foreach: viewPropertiesWeb">
<div class="property-line">
@ -212,7 +212,7 @@
</div>
</div>
<!--
<div class="e-read-only-sign fontastic iconsize24" data-bind="tooltip: 'CONTACTS/LABEL_READ_ONLY'">🔒</div>
<div class="e-read-only-sign fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_READ_ONLY">🔒</div>
-->
</div>
</div>

View file

@ -87,8 +87,7 @@
</div>
</div>
<div class="modal-footer">
<a class="btn" data-bind="visible: $root.allowToggle, click: function() { $root.toggleFiltersRaw(); },
css: {'active': $root.rawActive }, tooltip: 'POPUPS_SIEVE_SCRIPT/BUTTON_RAW_SCRIPT'">
<a class="btn" data-bind="visible: $root.allowToggle, click: function() { $root.toggleFiltersRaw(); }, css: {'active': $root.rawActive }" data-i18n="[title]POPUPS_SIEVE_SCRIPT/BUTTON_RAW_SCRIPT">
<i class="icon-file-code"></i>
</a>
<a class="btn buttonSave" data-bind="visible: hasChanges, click: function() { $root.saveScriptCommand(); }, css: {'btn-danger': $root.saveError}">

View file

@ -8,7 +8,7 @@
<div class="form-horizontal" data-bind="visible: capaTwoFactor" style="margin-top: 10px;">
<div class="control-group" data-bind="visible: twoFactorStatus">
<div class="controls">
<div style="display: inline-block" data-bind="tooltip: viewTwoFactorEnableTooltip">
<div style="display: inline-block" data-bind="attr:{title: viewTwoFactorEnableTooltip}">
<div data-bind="component: {
name: 'Checkbox',
params: {

View file

@ -11,14 +11,14 @@
<span data-i18n="GLOBAL/ARE_YOU_SURE"></span>
</a>
</td>
<td data-bind="tooltip: 'SETTINGS_FOLDERS/HELP_DELETE_FOLDER'">
<td data-i18n="[title]SETTINGS_FOLDERS/HELP_DELETE_FOLDER">
<span class="delete-folder e-action fontastic" data-bind="visible: canBeDeleted() && !deleteAccess(), click: function (oFolder) { $root.folderForDeletion(oFolder); }">🗑</span>
</td>
<td data-bind="tooltip: 'SETTINGS_FOLDERS/HELP_SHOW_HIDE_FOLDER'">
<td data-i18n="[title]SETTINGS_FOLDERS/HELP_SHOW_HIDE_FOLDER">
<span class="unsubscribed-folder e-action fontastic" data-bind="visible: canBeSubscribed() && !subscribed(), click: function(oFolder) { $root.subscribeFolder(oFolder); }">👁</span>
<span class="e-action fontastic" data-bind="visible: canBeSubscribed() && subscribed(), click: function(oFolder) { $root.unSubscribeFolder(oFolder); }">👁</span>
</td>
<td data-bind="visible: $root.displaySpecSetting, tooltip: 'SETTINGS_FOLDERS/HELP_CHECK_FOR_NEW_MESSAGES'">
<td data-bind="visible: $root.displaySpecSetting" data-i18n="[title]SETTINGS_FOLDERS/HELP_CHECK_FOR_NEW_MESSAGES">
<span class="unchecked-folder e-action" data-bind="visible: canBeSelected() && subscribed() && !checkable(), click: function(oFolder) { $root.checkableTrueFolder(oFolder); }">
<i class="icon-check-mark-circle-two"></i>
</span>

View file

@ -7,7 +7,7 @@
<span data-i18n="SETTINGS_OPEN_PGP/BUTTON_ADD_OPEN_PGP_KEY"></span>
</button>
&nbsp;&nbsp;
<div style="display: inline-block" data-bind="tooltip: 'SETTINGS_OPEN_PGP/GENERATE_ONLY_HTTPS'">
<div style="display: inline-block" data-i18n="[title]SETTINGS_OPEN_PGP/GENERATE_ONLY_HTTPS">
<button class="btn" data-bind="click: generateOpenPgpKey">
<i class="fontastic">🔑</i>
<span data-i18n="SETTINGS_OPEN_PGP/BUTTON_GENERATE_OPEN_PGP_KEYS"></span>