mirror of
https://github.com/keepassxreboot/keepassxc-browser.git
synced 2026-03-11 08:54:43 +00:00
Switch to list instead of table
This commit is contained in:
parent
0ea0745d19
commit
dcf1a1c71f
2 changed files with 86 additions and 85 deletions
|
|
@ -731,89 +731,84 @@
|
|||
<span class="invalid-feedback d-block" data-i18n="optionsSitePreferencesManualAddHelp"></span>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-sm table-striped table-bordered">
|
||||
<div class="table-responsive mt-3">
|
||||
<ul id="sitePreferencesTable" class="list-group list-group-flush">
|
||||
<caption data-i18n="optionsSitePreferencesTableCaption"></caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col"><span data-i18n="optionsColumnPageURL"></span></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="empty">
|
||||
<td colspan="5"><span data-i18n="optionsSitePreferencesNotFound"></span></td>
|
||||
</tr>
|
||||
<tr class="clone d-none">
|
||||
<td class="text-nowrap">
|
||||
<details>
|
||||
<summary>
|
||||
<span></span>
|
||||
</summary>
|
||||
|
||||
<div class="form-group col-sm-3 pb-2">
|
||||
<label for="ignore" data-i18n="optionsColumnIgnore"></label>
|
||||
<select class="form-select form-select-sm" id="ignore" name="ignore" data-i18n="[title]optionsSitePreferencesSelect">
|
||||
<option value="ignoreNothing" data-i18n="optionsSelectionNothing"></option>
|
||||
<option value="ignoreNormal" data-i18n="optionsSelectionNormal"></option>
|
||||
<option value="ignoreAutoSubmit" data-i18n="optionsSelectionAutoSubmit"></option>
|
||||
<option value="ignoreFull" data-i18n="optionsSelectionFull"></option>
|
||||
</select>
|
||||
<li class="empty list-group-item">
|
||||
<span data-i18n="optionsSitePreferencesNotFound"></span>
|
||||
</li>
|
||||
|
||||
<li class="clone d-none list-group-item">
|
||||
<details>
|
||||
<summary>
|
||||
<span></span>
|
||||
</summary>
|
||||
|
||||
<div class="m-3">
|
||||
<div class="form-group col-sm-3 mb-3">
|
||||
<label for="ignore" class="form-label" data-i18n="optionsColumnIgnore"></label>
|
||||
<select class="form-select form-select-sm" id="ignore" name="ignore" data-i18n="[title]optionsSitePreferencesSelect">
|
||||
<option value="ignoreNothing" data-i18n="optionsSelectionNothing"></option>
|
||||
<option value="ignoreNormal" data-i18n="optionsSelectionNormal"></option>
|
||||
<option value="ignoreAutoSubmit" data-i18n="optionsSelectionAutoSubmit"></option>
|
||||
<option value="ignoreFull" data-i18n="optionsSelectionFull"></option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="usernameOnly" data-i18n="optionsColumnUsernameOnly"></label>
|
||||
<input class="form-check-input" type="checkbox" id="usernameOnly" name="usernameOnly" value="false" data-i18n="[title]optionsColumnUsernameOnly">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="usernameOnly" data-i18n="optionsColumnUsernameOnly"></label>
|
||||
<input class="form-check-input" type="checkbox" id="usernameOnly" name="usernameOnly" value="false" data-i18n="[title]optionsColumnUsernameOnly">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="improvedFieldDetection" data-i18n="optionsColumnImprovedInputFieldDetection"></label>
|
||||
<input class="form-check-input" type="checkbox" id="improvedFieldDetection" name="improvedFieldDetection" value="false" data-i18n="[title]optionsColumnImprovedInputFieldDetection">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="improvedFieldDetection" data-i18n="optionsColumnImprovedInputFieldDetection"></label>
|
||||
<input class="form-check-input" type="checkbox" id="improvedFieldDetection" name="improvedFieldDetection" value="false" data-i18n="[title]optionsColumnImprovedInputFieldDetection">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="allowIframes" data-i18n="optionsColumnAllowIframes"></label>
|
||||
<input class="form-check-input" type="checkbox" id="allowIframes" name="allowIframes" value="false" data-i18n="[title]optionsColumnAllowIframes">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="allowIframes" data-i18n="optionsColumnAllowIframes"></label>
|
||||
<input class="form-check-input" type="checkbox" id="allowIframes" name="allowIframes" value="false" data-i18n="[title]optionsColumnAllowIframes">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="autoSubmit" data-i18n="optionsCheckboxAutoSubmit"></label>
|
||||
<input class="form-check-input" type="checkbox" id="autoSubmit" name="autoSubmit" value="false" data-i18n="[title]optionsColumnAutoSubmit">
|
||||
<div class="form-text" data-i18n="optionsAutoSubmitHelpText"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="autoSubmit" data-i18n="optionsCheckboxAutoSubmit"></label>
|
||||
<input class="form-check-input" type="checkbox" id="autoSubmit" name="autoSubmit" value="false" data-i18n="[title]optionsColumnAutoSubmit">
|
||||
<div class="form-text" data-i18n="optionsAutoSubmitHelpText"></div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="autoFillCredentials" data-i18n="optionsCheckboxAutoFillSingleEntry"></label>
|
||||
<input class="form-check-input" type="checkbox" id="autoFillCredentials" name="autoFillCredentials" value="false" data-i18n="[title]optionsColumnAutoFillCredentials">
|
||||
<div class="form-text" data-i18n="optionsAutoFillSingleEntryHelpText"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="autoFillCredentials" data-i18n="optionsCheckboxAutoFillSingleEntry"></label>
|
||||
<input class="form-check-input" type="checkbox" id="autoFillCredentials" name="autoFillCredentials" value="false" data-i18n="[title]optionsColumnAutoFillCredentials">
|
||||
<div class="form-text" data-i18n="optionsAutoFillSingleEntryHelpText"></div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="autoFillTOTP" data-i18n="optionsCheckboxAutoFillSingleTotp"></label>
|
||||
<input class="form-check-input" type="checkbox" id="autoFillTOTP" name="autoFillTOTP" value="false" data-i18n="[title]optionsColumnAutoFillTOTP">
|
||||
<div class="form-text" data-i18n="optionsAutoFillSingleTotpHelpText"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<label for="autoFillTOTP" data-i18n="optionsCheckboxAutoFillSingleTotp"></label>
|
||||
<input class="form-check-input" type="checkbox" id="autoFillTOTP" name="autoFillTOTP" value="false" data-i18n="[title]optionsColumnAutoFillTOTP">
|
||||
<div class="form-text" data-i18n="optionsAutoFillSingleTotpHelpText"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-sm delete btn-danger btn" data-i18n="[title]removeSitePreferencesButtonTitle">
|
||||
<i class="fa fa-remove" aria-hidden="true"></i>
|
||||
<span data-i18n="optionsButtonRemove"></span>
|
||||
</button>
|
||||
</details>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<button id="deleteButton" class="btn btn-sm delete btn-danger btn mt-3" data-i18n="[title]removeSitePreferencesButtonTitle">
|
||||
<i class="fa fa-remove" aria-hidden="true"></i>
|
||||
<span data-i18n="optionsButtonRemove"></span>
|
||||
</button>
|
||||
</div>
|
||||
</details>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="dialogDeleteSite" class="modal fade" tabindex="-1" role="dialog">
|
||||
|
|
|
|||
|
|
@ -525,17 +525,17 @@ options.initSitePreferences = function() {
|
|||
const removeButtonClicked = function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const closestTr = this.closest('tr');
|
||||
$('#dialogDeleteSite').setAttribute('url', closestTr.getAttribute('url'));
|
||||
$('#dialogDeleteSite').setAttribute('tr-id', closestTr.getAttribute('id'));
|
||||
$('#dialogDeleteSite .modal-body strong').textContent = closestTr.children[0].textContent;
|
||||
const closestLi = this.closest('li');
|
||||
$('#dialogDeleteSite').setAttribute('url', closestLi.getAttribute('url'));
|
||||
$('#dialogDeleteSite').setAttribute('tr-id', closestLi.getAttribute('id'));
|
||||
$('#dialogDeleteSite .modal-body strong').textContent = closestLi.children[0].textContent;
|
||||
|
||||
dialogDeleteSiteModal.show();
|
||||
};
|
||||
|
||||
const checkboxClicked = function() {
|
||||
const closestTr = this.closest('tr');
|
||||
const url = closestTr.getAttribute('url');
|
||||
const closestLi = this.closest('li');
|
||||
const url = closestLi.getAttribute('url');
|
||||
|
||||
for (const site of options.settings['sitePreferences']) {
|
||||
if (site.url === url) {
|
||||
|
|
@ -559,8 +559,8 @@ options.initSitePreferences = function() {
|
|||
};
|
||||
|
||||
const selectionChanged = function() {
|
||||
const closestTr = this.closest('tr');
|
||||
const url = closestTr.getAttribute('url');
|
||||
const closestLi = this.closest('li');
|
||||
const url = closestLi.getAttribute('url');
|
||||
|
||||
for (const site of options.settings['sitePreferences']) {
|
||||
if (site.url === url) {
|
||||
|
|
@ -576,10 +576,10 @@ options.initSitePreferences = function() {
|
|||
row.setAttribute('url', url);
|
||||
row.setAttribute('id', 'tr-scf' + newIndex);
|
||||
|
||||
const details = row.children[0].children[0];
|
||||
const details = row.children[0];
|
||||
details.children[0].children[0].textContent = url;
|
||||
details.children[2].children[0].value = ignore;
|
||||
details.children[2].children[0].addEventListener('change', selectionChanged);
|
||||
details.querySelector('#ignore').value = ignore;
|
||||
details.querySelector('#ignore').addEventListener('change', selectionChanged);
|
||||
details.querySelector('#usernameOnly').checked = usernameOnly;
|
||||
details.querySelector('#usernameOnly').addEventListener('change', checkboxClicked);
|
||||
details.querySelector('#improvedFieldDetection').checked = improvedFieldDetection;
|
||||
|
|
@ -592,9 +592,9 @@ options.initSitePreferences = function() {
|
|||
details.querySelector('#autoFillCredentials').addEventListener('change', checkboxClicked);
|
||||
details.querySelector('#autoFillTOTP').checked = autoFillTOTP;
|
||||
details.querySelector('#autoFillTOTP').addEventListener('change', checkboxClicked);
|
||||
details.children[8].addEventListener('click', removeButtonClicked);
|
||||
details.querySelector('#deleteButton').addEventListener('click', removeButtonClicked);
|
||||
|
||||
$('#tab-site-preferences table tbody').append(row);
|
||||
$('#tab-site-preferences #sitePreferencesTable').append(row);
|
||||
};
|
||||
|
||||
$('#dialogDeleteSite .modal-footer button.yes').addEventListener('click', function(e) {
|
||||
|
|
@ -649,11 +649,13 @@ options.initSitePreferences = function() {
|
|||
}
|
||||
|
||||
const newIndex = options.settings['sitePreferences'].length + 1;
|
||||
const rowClone = $('#tab-site-preferences table tr.clone').cloneNode(true);
|
||||
const rowClone = $('#tab-site-preferences #sitePreferencesTable li.clone').cloneNode(true);
|
||||
rowClone.classList.remove('clone', 'd-none');
|
||||
|
||||
|
||||
addNewRow(rowClone, newIndex, value, IGNORE_NOTHING, false, false, false, false, false, false);
|
||||
$('#tab-site-preferences table tbody tr.empty').hide();
|
||||
$('#tab-site-preferences #sitePreferencesTable li.empty').hide();
|
||||
|
||||
|
||||
options.settings['sitePreferences'].push({
|
||||
url: value,
|
||||
|
|
@ -666,7 +668,7 @@ options.initSitePreferences = function() {
|
|||
manualUrl.value = '';
|
||||
});
|
||||
|
||||
const rowClone = $('#tab-site-preferences table tr.clone').cloneNode(true);
|
||||
const rowClone = $('#tab-site-preferences ul li.clone').cloneNode(true);
|
||||
rowClone.classList.remove('clone', 'd-none');
|
||||
let counter = 1;
|
||||
if (options.settings['sitePreferences']) {
|
||||
|
|
@ -686,6 +688,10 @@ options.initSitePreferences = function() {
|
|||
++counter;
|
||||
}
|
||||
}
|
||||
|
||||
if (counter > 1) {
|
||||
$('#tab-site-preferences #sitePreferencesTable li.empty').hide();
|
||||
}
|
||||
};
|
||||
|
||||
options.initAbout = function() {
|
||||
|
|
|
|||
Loading…
Reference in a new issue