prehistoric-systems/keepassxc-browser
1
0
Fork 0
mirror of https://github.com/keepassxreboot/keepassxc-browser.git synced 2026-03-11 08:54:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #792 from xf-/mediaquery

Browse source 
Use bootstrap classes
This commit is contained in:
Sami Vänttinen 2020-03-17 15:47:18 +02:00 committed by GitHub
commit ffd257bbdf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 232 additions and 366 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

247
keepassxc-browser/options/options.css
View file

@ -1,244 +1,111 @@
body { body {
background-color: var(--background-color);
font-size: 14px; font-size: 14px;
padding-top: 20px; max-width: 1440px;
padding-bottom: 60px;
} }
a { a {
color: var(--link-color); text-decoration: none !important;
text-decoration: none;
}
a:hover {
color: var(--link-hover-color);
text-decoration: none;
}
.table td {
vertical-align: middle !important;
width: 100%;
word-break: break-all;
}
table td:last-child {
white-space: nowrap;
width: 1%;
}
input {
background-color: var(--input-background-color);
} }
input:invalid { input:invalid {
border: 2px solid red; border: 2px solid red;
} }
input[type=range] { input[disabled] {
width: 20%; opacity: .3!important;
}
input[type=text], input[type=url] {
max-width: 66.666667%;
}
main {
background: var(--background-color);
} }
footer { footer {
bottom: 1rem; bottom: 1rem;
color: #cbcfcb;
font-size: .75rem;
position: absolute;
text-transform: uppercase;
} }
select { .table tbody td {
background-color: var(--input-background-color) !important; vertical-align: middle;
color: var(--text-color) !important;
min-width: 100px !important;
width: auto !important;
} }
h2, hr { #tab-site-preferences td:nth-of-type(2),
margin-top: 0; #tab-site-preferences td:nth-of-type(2) select {
width: 200px;
} }
tr.clone { #tab-site-preferences td:nth-of-type(3),
display: none; table td:last-of-type {
} width: 1px;
td.identifier, td.key, td.last-used, td.created {
white-space: nowrap;
}
button.collapsed {
display: none;
} }
.fa { .fa {
margin-right: 0.2rem; margin-right: 0.2rem;
} }
.card {
background-color: var(--card-background-color);
border: 1px solid rgba(0,0,0,.125);
margin-bottom: 2rem;
min-width: 720px;
width: 75%;
}
.card-header {
background-color: var(--card-header-color);
color: var(--text-color);
font-size: 1rem;
font-weight: 500;
}
.card-body {
background-color: var(--background-color);
color: var(--text-color);
}
.sidebar { .sidebar {
background-color: var(--sidebar-background-color) !important; height: 50px;
bottom: 0; bottom: 0;
min-width: 160px !important;
position: fixed; position: fixed;
top: 0; top: 0;
z-index: 100; z-index: 100;
} }
.sidebar a { .sidebar a {
color: #cbcfcb; border: 1px solid transparent;
} }
.sidebar a:hover { h1,
color: #a0a0a0; .nav-item,
} .sidebar-heading {
.nav-item, .sidebar-heading {
font-size: .75rem; font-size: .75rem;
text-transform: uppercase;
} }
.active > a { .active > a {
border: 1px solid #a0a0a0; border-color: currentColor;
border-radius: 2px; color: #a0a0a0 !important;
color: #a0a0a0;
} }
.sidebar-heading { .collapse.show {
color: #f2f2f2;
padding-bottom: 1.5rem;
}
.tab {
display: none;
}
.tab-header {
margin-bottom: 2rem;
}
.table, tbody, thead, tr, th, td {
border: 1px solid var(--table-border-color) !important;
}
.alert, #manualUrl {
width: 75%;
}
.collapse:not(.show) {
display: block !important; display: block !important;
} }
.invalid-feedback { .invalid-feedback {
color: var(--link-color);
display: block;
font-size: 95% !important; font-size: 95% !important;
} }
.invalid-feedback code { @media (min-width: 768px) {
color: var(--link-hover-color) !important;
}
#defaultGroup {
width: 50%;
}
#redirectAllowanceLabel {
font-weight: normal;
}
#colorTheme {
width: 20%;
}
#dangerousSettings {
display: none;
}
#padded-helptext {
margin-bottom: 1rem;
padding-left: 1.25rem;
}
@media (max-width: 768px) {
main {
padding-top: 50px;
}
h6.d-flex {
float: right !important;
}
button.collapsed {
display: block;
padding-top: 0.5rem !important;
}
.collapse:not(.show) {
display: none !important;
}
.d-flex {
display: none !important;
}
.sidebar { .sidebar {
height: 50px; height: auto;
min-width: 100% !important;
} }
}
#sidebar { @media (min-width: 1440px) {
background-color: #2f2f2f; .sidebar {
width: 30%; width: 240px;
} }
} }
@media (prefers-color-scheme: dark), (prefers-color-scheme: light) { @media (prefers-color-scheme: dark), (prefers-color-scheme: light) {
a { a {
color: var(--link-color); color: var(--link-color);
text-decoration: none;
} }
a:hover { a:hover {
color: var(--link-hover-color); color: var(--link-hover-color);
text-decoration: none;
} }
.bg-danger { body,
color: #000; pre {
}
body, pre {
background-color: var(--background-color); background-color: var(--background-color);
color: var(--text-color); color: var(--text-color);
} }
input, input[type="checkbox"] { main {
background: var(--background-color);
}
#sidebar,
.sidebar {
background-color: var(--sidebar-background-color) !important;
}
input,
input[type="checkbox"] {
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
border-color: var(--input-main-border-color) !important; border-color: var(--input-main-border-color) !important;
color: var(--text-color) !important; color: var(--text-color) !important;
@ -253,13 +120,9 @@ button.collapsed {
color: var(--text-color); color: var(--text-color);
} }
.navbar-default {
box-shadow: 0 0px 2px 0;
}
select { select {
background-color: var(--input-background-color); background-color: var(--input-background-color) !important;
color: var(--text-color); color: var(--text-color) !important;
} }
select option { select option {
@ -267,19 +130,25 @@ button.collapsed {
color: var(--text-color); color: var(--text-color);
} }
.table, tbody, thead, tr, th, td { .table,
border: 1px solid var(--table-border-color) !important; tbody,
thead,
tr,
th,
td {
border-color: var(--table-border-color) !important;
} }
.table > caption { .table > caption {
color: var(--text-color); color: var(--text-color);
} }
.table > thead, tbody { .table > thead,
tbody {
color: var(--text-color); color: var(--text-color);
} }
.table-striped > tbody > tr:nth-of-type(odd) { .table-striped > tbody > tr:nth-of-type(odd) {
background-color: var(--table-odd-color); background-color: var(--table-odd-color);
} }
@ -288,7 +157,7 @@ button.collapsed {
} }
.card { .card {
background-color: var(--input-background-color); background-color: var(--card-background-color);
border-color: var(--card-border-color); border-color: var(--card-border-color);
} }
@ -297,12 +166,16 @@ button.collapsed {
color: var(--text-color); color: var(--text-color);
} }
.card-header:first-child {
border-radius: 0;
}
.card-body { .card-body {
background-color: var(--card-background-color); background-color: var(--card-background-color);
color: var(--text-color); color: var(--text-color);
} }
.invalid-feedback code {
color: var(--link-hover-color) !important;
}
.invalid-feedback {
color: var(--link-color);
}
} }

341
keepassxc-browser/options/options.html
View file

@ -3,6 +3,7 @@
<head> <head>
<title data-i18n="optionsTitle"></title> <title data-i18n="optionsTitle"></title>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="../css/colors.css" /> <link rel="stylesheet" href="../css/colors.css" />
<link rel="stylesheet" href="../bootstrap/bootstrap.min.css" /> <link rel="stylesheet" href="../bootstrap/bootstrap.min.css" />
<link rel="stylesheet" href="../fonts/fork-awesome.min.css" /> <link rel="stylesheet" href="../fonts/fork-awesome.min.css" />
@ -17,44 +18,44 @@
<script src="options.js"></script> <script src="options.js"></script>
<script src="../translate.js" defer></script> <script src="../translate.js" defer></script>
</head> </head>
<body> <body class="pt-3 pb-5">
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<nav class="col-md-2 bg-dark sidebar"> <nav class="col-md-3 col-lg-2 sidebar">
<button class="navbar-dark navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#sidebar" aria-controls="sidebar"> <button class="navbar-dark navbar-toggler collapsed d-block d-md-none pt-2" type="button" data-toggle="collapse" data-target="#sidebar" aria-controls="sidebar">
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse" id="sidebar"> <div class="collapse d-none d-md-block" id="sidebar">
<h6 class="sidebar-heading d-flex px-3 mt-4 mb-1">KeePassXC-Browser</h6> <h1 class="text-uppercase text-white-50 d-none d-md-flex px-3 pb-4 mt-4 mb-1 ">KeePassXC-Browser</h1>
<ul class="nav flex-column mb-2"> <ul class="nav flex-column mb-2 text-uppercase">
<li class="active nav-item"><a class="nav-link" href="#general-settings" tabindex="1"><span data-i18n="optionsMenuGeneral"></span></a></li> <li class="active nav-item"><a class="nav-link text-light rounded-sm" href="#general-settings" tabindex="1"><span data-i18n="optionsMenuGeneral"></span></a></li>
<li class="nav-item"><a class="nav-link" href="#connected-databases" tabindex="2"><span data-i18n="optionsMenuConnectedDatabases"></span></a></li> <li class="nav-item"><a class="nav-link text-light rounded-sm" href="#connected-databases" tabindex="2"><span data-i18n="optionsMenuConnectedDatabases"></span></a></li>
<li class="nav-item"><a class="nav-link" href="#custom-fields" tabindex="3"><span data-i18n="optionsMenuCustomFields"></span></a></li> <li class="nav-item"><a class="nav-link text-light rounded-sm" href="#custom-fields" tabindex="3"><span data-i18n="optionsMenuCustomFields"></span></a></li>
<li class="nav-item"><a class="nav-link" href="#site-preferences" tabindex="4"><span data-i18n="optionsMenuSitePreferences"></span></a></li> <li class="nav-item"><a class="nav-link text-light rounded-sm" href="#site-preferences" tabindex="4"><span data-i18n="optionsMenuSitePreferences"></span></a></li>
<li class="nav-item"><a class="nav-link" href="#about" tabindex="5"><span data-i18n="optionsMenuAbout"></span></a></li> <li class="nav-item"><a class="nav-link text-light rounded-sm" href="#about" tabindex="5"><span data-i18n="optionsMenuAbout"></span></a></li>
</ul> </ul>
<footer class="d-flex px-3 mt-4 mb-1"> <footer class="d-none d-md-flex px-3 mt-4 mb-1 text-uppercase position-absolute small text-muted">
(C) 2017-2020 - KeePassXC Team (C) 2017-2020 - KeePassXC Team
</footer> </footer>
</div> </div>
</nav> </nav>
<main class="col-md-9 ml-sm-auto col-md-10 px-4"> <main class="col-md-9 col-lg-10 offset-md-3 offset-lg-2 px-4 mt-5 mt-md-0">
<div class="content"> <div class="content">
<!-- General Settings --> <!-- General Settings -->
<div class="tab" id="tab-general-settings"> <div class="tab" id="tab-general-settings">
<h2 class="tab-header" data-i18n="optionsGeneralSettingsTab"></h2> <h2 class="pb-3 mt-0" data-i18n="optionsGeneralSettingsTab"></h2>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-television" aria-hidden="true"></i> <i class="fa fa-television" aria-hidden="true"></i>
User interface User interface
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="form-group"> <div class="form-group">
<label for="colorTheme"><span data-i18n="optionsThemeSelectionHeader"></span></label> <label for="colorTheme" data-i18n="optionsThemeSelectionHeader"></label>
<select class="form-control form-control-sm" id="colorTheme" data-i18n="[title]optionsThemeSelection"> <select class="form-control form-control-sm col-md-3 col-lg-2" id="colorTheme" data-i18n="[title]optionsThemeSelection">
<option value="system" data-i18n="optionsThemeSystem"></option> <option value="system" data-i18n="optionsThemeSystem"></option>
<option value="dark" data-i18n="optionsThemeDark"></option> <option value="dark" data-i18n="optionsThemeDark"></option>
<option value="light" data-i18n="optionsThemeLight"></option> <option value="light" data-i18n="optionsThemeLight"></option>
@ -64,8 +65,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="showLoginFormIcon" id="usernameIconsCheckBox" value="true" /> <input class="form-check-input" type="checkbox" name="showLoginFormIcon" id="usernameIconsCheckBox" value="true" />
<span data-i18n="optionsCheckboxUsernameIcons"></span> <label class="form-check-label" for="usernameIconsCheckBox" data-i18n="optionsCheckboxUsernameIcons"></label>
<label class="form-check-label" for="usernameIconsCheckBox"></label>
<span class="form-text text-muted" data-i18n="optionsShowLoginFormIconHelpText"></span> <span class="form-text text-muted" data-i18n="optionsShowLoginFormIconHelpText"></span>
</div> </div>
</div> </div>
@ -73,8 +73,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="usePasswordGeneratorIcons" id="passwordIconsCheckBox" value="true" /> <input class="form-check-input" type="checkbox" name="usePasswordGeneratorIcons" id="passwordIconsCheckBox" value="true" />
<span data-i18n="optionsCheckboxUsePasswordGenerator"></span> <label class="form-check-label" for="passwordIconsCheckBox" data-i18n="optionsCheckboxUsePasswordGenerator"></label>
<label class="form-check-label" for="passwordIconsCheckBox"></label>
<span class="form-text text-muted" data-i18n="optionsUsePasswordGeneratorHelpText"></span> <span class="form-text text-muted" data-i18n="optionsUsePasswordGeneratorHelpText"></span>
<span class="form-text text-muted" data-i18n="optionsUsePasswordGeneratorHelpTextSecond"></span> <span class="form-text text-muted" data-i18n="optionsUsePasswordGeneratorHelpTextSecond"></span>
</div> </div>
@ -83,8 +82,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="showOTPIcon" id="totpIconsCheckBox" value="true" /> <input class="form-check-input" type="checkbox" name="showOTPIcon" id="totpIconsCheckBox" value="true" />
<span data-i18n="optionsCheckboxOTPIcons"></span> <label class="form-check-label" for="totpIconsCheckBox" data-i18n="optionsCheckboxOTPIcons"></label>
<label class="form-check-label" for="totpIconsCheckBox"></label>
<span class="form-text text-muted" data-i18n="optionsShowOTPIconHelpText"></span> <span class="form-text text-muted" data-i18n="optionsShowOTPIconHelpText"></span>
</div> </div>
</div> </div>
@ -92,16 +90,15 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="showNotifications" id="notificationCheckBox" value="true" /> <input class="form-check-input" type="checkbox" name="showNotifications" id="notificationCheckBox" value="true" />
<span data-i18n="optionsCheckboxShowNotifications"></span> <label class="form-check-label" for="notificationCheckBox" data-i18n="optionsCheckboxShowNotifications"></label>
<label class="form-check-label" for="notificationCheckBox"></label>
<span class="form-text text-muted" data-i18n="optionsShowNotificationsHelpText"></span> <span class="form-text text-muted" data-i18n="optionsShowNotificationsHelpText"></span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-keyboard-o" aria-hidden="true"></i> <i class="fa fa-keyboard-o" aria-hidden="true"></i>
<span data-i18n="optionsKeyboardShortcutsHeader"></span> <span data-i18n="optionsKeyboardShortcutsHeader"></span>
</div> </div>
@ -120,8 +117,8 @@
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-pencil" aria-hidden="true"></i> <i class="fa fa-pencil" aria-hidden="true"></i>
Filling credentials Filling credentials
</div> </div>
@ -129,8 +126,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="autoRetrieveCredentials" id="autoRetrieveCredentials" value="true" /> <input class="form-check-input" type="checkbox" name="autoRetrieveCredentials" id="autoRetrieveCredentials" value="true" />
<span data-i18n="optionsCheckboxAutoRetrieveCredentials"></span> <label class="form-check-label" for="autoRetrieveCredentials" data-i18n="optionsCheckboxAutoRetrieveCredentials"></label>
<label class="form-check-label" for="autoRetrieveCredentials"></label>
<span class="form-text text-muted" data-i18n="optionsAutoRetrieveCredentialsHelpText"></span> <span class="form-text text-muted" data-i18n="optionsAutoRetrieveCredentialsHelpText"></span>
</div> </div>
</div> </div>
@ -138,8 +134,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="autoCompleteUsernames" id="autoCompleteUsernames" value="true" /> <input class="form-check-input" type="checkbox" name="autoCompleteUsernames" id="autoCompleteUsernames" value="true" />
<span data-i18n="optionsCheckboxAutoCompleteUsernames"></span> <label class="form-check-label" for="autoCompleteUsernames" data-i18n="optionsCheckboxAutoCompleteUsernames"></label>
<label class="form-check-label" for="autoCompleteUsernames"></label>
<span class="form-text text-muted" data-i18n="optionsAutocompleteUsernamesHelpText"></span> <span class="form-text text-muted" data-i18n="optionsAutocompleteUsernamesHelpText"></span>
</div> </div>
</div> </div>
@ -147,8 +142,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="autoSubmit" id="autoSubmit" value="true" /> <input class="form-check-input" type="checkbox" name="autoSubmit" id="autoSubmit" value="true" />
<span data-i18n="optionsCheckboxAutoSubmit"></span> <label class="form-check-label" for="autoSubmit" data-i18n="optionsCheckboxAutoSubmit"></label>
<label class="form-check-label" for="autoSubmit"></label>
<span class="form-text text-muted" data-i18n="optionsAutoSubmitHelpText"></span> <span class="form-text text-muted" data-i18n="optionsAutoSubmitHelpText"></span>
</div> </div>
</div> </div>
@ -156,10 +150,9 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="autoFillSingleEntry" id="autoFillSingleEntry" value="true" /> <input class="form-check-input" type="checkbox" name="autoFillSingleEntry" id="autoFillSingleEntry" value="true" />
<span data-i18n="optionsCheckboxAutoFillSingleEntry"></span> <label class="form-check-label" for="autoFillSingleEntry" data-i18n="optionsCheckboxAutoFillSingleEntry"></label>
<label class="form-check-label" for="autoFillSingleEntry"></label>
<span class="form-text text-muted" data-i18n="optionsAutoFillSingleEntryHelpText"></span> <span class="form-text text-muted" data-i18n="optionsAutoFillSingleEntryHelpText"></span>
<div class="alert alert-warning mt-3" role="alert"> <div class="alert alert-warning mt-3 col-lg-9" role="alert">
<i class="fa fa-exclamation-triangle" aria-hidden="true"></i> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
<span data-i18n="optionsAutoFillSingleEntryWarning"></span> <span data-i18n="optionsAutoFillSingleEntryWarning"></span>
</div> </div>
@ -169,18 +162,17 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="autoFillAndSend" id="autoFillAndSend" value="true"> <input class="form-check-input" type="checkbox" name="autoFillAndSend" id="autoFillAndSend" value="true">
<span data-i18n="optionsCheckboxAutoFillAndSend"></span> <label class="form-check-label" for="autoFillAndSend" data-i18n="optionsCheckboxAutoFillAndSend"></label>
<label class="form-check-label" for="autoFillAndSend"></label>
<span class="form-text text-muted" data-i18n="optionsAutoFillAndSendHelpText"></span> <span class="form-text text-muted" data-i18n="optionsAutoFillAndSendHelpText"></span>
<span class="form-text text-muted" data-i18n="optionsAutoFillAndSendHelpTextSecond"></span> <span class="form-text text-muted" data-i18n="optionsAutoFillAndSendHelpTextSecond"></span>
<br /><img src="/options/http-auth-dialog.png" data-i18n="[alt]httpAuthDialog"/> <img src="/options/http-auth-dialog.png" data-i18n="[alt]httpAuthDialog" class="img-fluid mt-2"/>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-save" aria-hidden="true"></i> <i class="fa fa-save" aria-hidden="true"></i>
Saving credentials Saving credentials
</div> </div>
@ -188,66 +180,65 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="showLoginNotifications" id="showLoginNotifications" value="true"> <input class="form-check-input" type="checkbox" name="showLoginNotifications" id="showLoginNotifications" value="true">
<span data-i18n="optionsCheckboxShowLoginNotifications"></span> <label class="form-check-label" for="showLoginNotifications" data-i18n="optionsCheckboxShowLoginNotifications"></label>
<label class="form-check-label" for="saveDomainOnlyNewCreds"></label> </div>
</div>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="defaultGroupAlwaysAsk" id="defaultGroupAlwaysAsk" value="true">
<label class="form-check-label" for="defaultGroupAlwaysAsk" data-i18n="optionsLabelDefaultGroupCheckboxText"></label>
<span class="form-text text-muted" data-i18n="optionsLabelDefaultGroupCheckboxHelpText"></span>
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="defaultGroup" data-i18n="optionsLabelDefaultGroup"></label> <label for="defaultGroup" data-i18n="optionsLabelDefaultGroup"></label>
<div class="input-group"> <div class="input-group">
<input class="form-control form-control-sm" type="text" id="defaultGroup" placeholder="KeePassXC-Browser Passwords"> <input class="form-control form-control-sm col-md-8 col-lg-6" type="text" id="defaultGroup" placeholder="KeePassXC-Browser Passwords">
<div class="input-group-append"> <div class="input-group-append">
<button class="btn btn-sm btn-primary" type="button"><i class="fa fa-save" aria-hidden="true"></i><span data-i18n="optionsButtonSave"></span></button> <button class="btn btn-sm btn-primary" type="button"><i class="fa fa-save" aria-hidden="true"></i><span data-i18n="optionsButtonSave"></span></button>
<button class="btn btn-sm btn-danger" type="button"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonReset"></span></button> <button class="btn btn-sm btn-danger" type="button"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonReset"></span></button>
</div> </div>
</div> <span class="form-text text-muted w-100" data-i18n="optionsDefaultGroupHelpText"></span>
<span class="form-text text-muted" id="padded-helptext" data-i18n="optionsDefaultGroupHelpText"></span>
<div class="form-check">
<input class="form-check-input" type="checkbox" name="defaultGroupAlwaysAsk" id="defaultGroupAlwaysAsk" value="true">
<span data-i18n="optionsLabelDefaultGroupCheckboxText"></span>
<label class="form-check-label" for="defaultGroupAlwaysAsk"></label>
<span class="form-text text-muted" data-i18n="optionsLabelDefaultGroupCheckboxHelpText"></span>
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="saveDomainOnlyNewCreds" id="saveDomainOnlyNewCreds" value="true"> <input class="form-check-input" type="checkbox" name="saveDomainOnlyNewCreds" id="saveDomainOnlyNewCreds" value="true">
<span data-i18n="optionsSaveDomainOnly"></span> <label class="form-check-label" for="saveDomainOnlyNewCreds" data-i18n="optionsSaveDomainOnly"></label>
<label class="form-check-label" for="saveDomainOnlyNewCreds"></label>
<span class="form-text text-muted" data-i18n="optionsSaveDomainOnlyHelpText"></span> <span class="form-text text-muted" data-i18n="optionsSaveDomainOnlyHelpText"></span>
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-group">
<label id="redirectAllowanceLabel" for="redirectAllowance" data-i18n="optionsRedirectAllowance" i18n-placeholder="1"></label> <label id="redirectAllowanceLabel" class="font-weight-normal" for="redirectAllowance" data-i18n="optionsRedirectAllowance" i18n-placeholder="1"></label>
<input type="range" class="form-control-range" id="redirectAllowance" name="redirectAllowance" min="1" max="11" step="1" value="1" /> <input type="range" class="form-control-range col-md-6 col-lg-4" id="redirectAllowance" name="redirectAllowance" min="1" max="11" step="1" value="1" />
</div> </div>
<span class="form-text text-muted" data-i18n="optionsRedirectAllowanceHelpText"></span> <span class="form-text text-muted" data-i18n="optionsRedirectAllowanceHelpText"></span>
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-clock-o" aria-hidden="true"></i> <i class="fa fa-clock-o" aria-hidden="true"></i>
Updates Updates
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="help-block kphVersion"> <div class="help-block kphVersion">
<span data-i18n="optionsVersionInfoText"></span> <p>
<br /> <span data-i18n="optionsVersionInfoText"></span>
<span data-i18n="optionsVersionDownload" i18n-placeholder="<a target='_blank' href='https://keepassxc.org/'>https://keepassxc.org/</a>"></span> <br />
<br /> <span data-i18n="optionsVersionDownload" i18n-placeholder="<a target='_blank' href='https://keepassxc.org/'>https://keepassxc.org/</a>"></span>
<br /> </p>
<div> <p>
<span data-i18n="optionsVersionRunning" i18n-placeholder="<em class='yourVersion'></em>"></span> <span data-i18n="optionsVersionRunning" i18n-placeholder="<em class='yourVersion'></em>"></span>
</div> </p>
<div> <p>
<span data-i18n="optionsLatestVersion" i18n-placeholder="<em class='latestVersion'></em>"></span> <span data-i18n="optionsLatestVersion" i18n-placeholder="<em class='latestVersion'></em>"></span>
<p></p> </p>
<button class="btn btn-sm btn-success checkUpdateKeePassXC"><i class="fa fa-refresh" aria-hidden="true"></i><span data-i18n="optionsButtonUpdate"></span></button> <button class="btn btn-sm btn-success checkUpdateKeePassXC"><i class="fa fa-refresh" aria-hidden="true"></i><span data-i18n="optionsButtonUpdate"></span></button>
</div>
<div class="mt-3"> <div class="mt-3">
<div data-i18n="optionsRadioText"></div> <div data-i18n="optionsRadioText"></div>
<div class="form-check form-check-inline"> <div class="form-check form-check-inline">
@ -271,8 +262,8 @@
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-pencil" aria-hidden="true"></i> <i class="fa fa-pencil" aria-hidden="true"></i>
Advanced settings Advanced settings
</div> </div>
@ -280,8 +271,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="useObserver" id="useObserver" value="true" /> <input class="form-check-input" type="checkbox" name="useObserver" id="useObserver" value="true" />
<span data-i18n="optionsUseObserver"></span> <label class="form-check-label" for="useObserver" data-i18n="optionsUseObserver"></label>
<label class="form-check-label" for="useObserver"></label>
<span class="form-text text-muted" data-i18n="optionsUseObserverHelpText"></span> <span class="form-text text-muted" data-i18n="optionsUseObserverHelpText"></span>
</div> </div>
</div> </div>
@ -289,10 +279,9 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="showGroupNameInAutocomplete" id="showGroupNameInAutocomplete" value="true" /> <input class="form-check-input" type="checkbox" name="showGroupNameInAutocomplete" id="showGroupNameInAutocomplete" value="true" />
<span data-i18n="optionsCheckboxShowGroupNameInAutocomplete"></span> <label class="form-check-label" for="showGroupNameInAutocomplete" data-i18n="optionsCheckboxShowGroupNameInAutocomplete"></label>
<label class="form-check-label" for="showGroupNameInAutocomplete"></label>
<span class="form-text text-muted" data-i18n="optionsShowGroupNameInAutocompleteHelpText"></span> <span class="form-text text-muted" data-i18n="optionsShowGroupNameInAutocompleteHelpText"></span>
<div class="alert alert-info mt-3" role="alert"> <div class="alert alert-info mt-3 col-lg-9" role="alert">
<i class="fa fa-exclamation-circle" aria-hidden="true"></i> <i class="fa fa-exclamation-circle" aria-hidden="true"></i>
<span data-i18n="optionsKeePassXCVersionRequired" i18n-placeholder="2.6.0"></span> <span data-i18n="optionsKeePassXCVersionRequired" i18n-placeholder="2.6.0"></span>
</div> </div>
@ -302,10 +291,9 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="autoReconnect" id="autoReconnect" value="true" /> <input class="form-check-input" type="checkbox" name="autoReconnect" id="autoReconnect" value="true" />
<span data-i18n="optionsCheckboxAutomaticReconnect"></span> <label class="form-check-label" for="autoReconnect" data-i18n="optionsCheckboxAutomaticReconnect"></label>
<label class="form-check-label" for="autoReconnect"></label>
<span class="form-text text-muted" data-i18n="optionsAutomaticReconnectHelpText"></span> <span class="form-text text-muted" data-i18n="optionsAutomaticReconnectHelpText"></span>
<div class="alert alert-warning mt-3" role="alert"> <div class="alert alert-warning mt-3 col-lg-9" role="alert">
<i class="fa fa-exclamation-triangle" aria-hidden="true"></i> <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
<span data-i18n="optionsAutomaticReconnectWarning"></span> <span data-i18n="optionsAutomaticReconnectWarning"></span>
</div> </div>
@ -315,8 +303,7 @@
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
<input class="form-check-input" type="checkbox" name="saveDomainOnly" id="saveDomainOnly" value="true" /> <input class="form-check-input" type="checkbox" name="saveDomainOnly" id="saveDomainOnly" value="true" />
<span data-i18n="optionsSaveDomainOnly"></span> <label class="form-check-label" for="saveDomainOnly" data-i18n="optionsSaveDomainOnly"></label>
<label class="form-check-label" for="saveDomainOnly"></label>
<span class="form-text text-muted" data-i18n="optionsSaveDomainOnlyCustomLoginHelpText"></span> <span class="form-text text-muted" data-i18n="optionsSaveDomainOnlyCustomLoginHelpText"></span>
</div> </div>
</div> </div>
@ -352,35 +339,37 @@
</div> </div>
<!-- Connected Databases --> <!-- Connected Databases -->
<div class="tab" id="tab-connected-databases"> <div class="tab d-none" id="tab-connected-databases">
<h2 class="tab-header" data-i18n="optionsConnectedDatabasesTab"></h2> <h2 class="pb-3 mt-0" data-i18n="optionsConnectedDatabasesTab"></h2>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-body"> <div class="card-body">
<table class="table table-striped table-bordered"> <div class="table-responsive">
<caption data-i18n="optionsConnectedDatabasesText"></caption> <table class="table table-sm table-striped table-bordered">
<thead> <caption data-i18n="optionsConnectedDatabasesText"></caption>
<tr> <thead>
<th scope="col"><span data-i18n="optionsDatabaseIdentifier"></span></th> <tr>
<th scope="col"><span data-i18n="optionsDatabaseKey"></span></th> <th scope="col"><span data-i18n="optionsDatabaseIdentifier"></span></th>
<th scope="col"><span data-i18n="optionsDatabaseLastUsed"></span></th> <th scope="col"><span data-i18n="optionsDatabaseKey"></span></th>
<th scope="col"><span data-i18n="optionsDatabaseCreated"></span></th> <th scope="col"><span data-i18n="optionsDatabaseLastUsed"></span></th>
<th scope="col"><span data-i18n="optionsDatabaseDelete"></span></th> <th scope="col"><span data-i18n="optionsDatabaseCreated"></span></th>
</tr> <th scope="col"><span data-i18n="optionsDatabaseDelete"></span></th>
</thead> </tr>
<tbody> </thead>
<tr class="empty"> <tbody>
<td colspan="5"><span data-i18n="optionsConnectedDatabasesNotFound"></span></td> <tr class="empty">
</tr> <td colspan="5"><span data-i18n="optionsConnectedDatabasesNotFound"></span></td>
<tr class="clone"> </tr>
<td class="identifier"></td> <tr class="clone d-none">
<td class="key"></td> <td class="identifier text-nowrap"></td>
<td class="last-used"></td> <td class="key text-nowrap"></td>
<td class="created"></td> <td class="last-used text-nowrap"></td>
<td><button class="btn btn-sm delete btn-danger"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonRemove"></span></button></td> <td class="created text-nowrap"></td>
</tr> <td class="text-nowrap"><button class="btn btn-sm delete btn-danger"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonRemove"></span></button></td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
<div> <div>
<button id="connect-button" class="btn btn-sm btn-success"><i class="fa fa-link" aria-hidden="true"></i><span data-i18n="optionsButtonConnect"></span></button> <button id="connect-button" class="btn btn-sm btn-success"><i class="fa fa-link" aria-hidden="true"></i><span data-i18n="optionsButtonConnect"></span></button>
</div> </div>
@ -408,34 +397,36 @@
</div> </div>
<!-- Custom login fields --> <!-- Custom login fields -->
<div class="tab" id="tab-custom-fields"> <div class="tab d-none" id="tab-custom-fields">
<h2 class="tab-header" data-i18n="optionsCustomFieldsTab"></h2> <h2 class="pb-3 mt-0" data-i18n="optionsCustomFieldsTab"></h2>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-body"> <div class="card-body">
<p> <p>
<span data-i18n="optionsCustomFieldsTabHelpTextFirst"></span> <span data-i18n="optionsCustomFieldsTabHelpTextFirst"></span>
<br /> <br />
<span data-i18n="optionsCustomFieldsTabHelpTextSecond"></span><em><span data-i18n="popupChooseCredentialsText"></span></em>. <span data-i18n="optionsCustomFieldsTabHelpTextSecond"></span><em><span data-i18n="popupChooseCredentialsText"></span></em>.
</p> </p>
<table class="table table-striped table-bordered"> <div class="table-responsive">
<caption data-i18n="optionsCustomFieldsTableCaption"></caption> <table class="table table-sm table-striped table-bordered">
<thead> <caption data-i18n="optionsCustomFieldsTableCaption"></caption>
<tr> <thead>
<th scope="col"><span data-i18n="optionsColumnPageURL"></span></th> <tr>
<th scope="col"><span data-i18n="optionsColumnDelete"></span></th> <th scope="col"><span data-i18n="optionsColumnPageURL"></span></th>
</tr> <th scope="col"><span data-i18n="optionsColumnDelete"></span></th>
</thead> </tr>
<tbody> </thead>
<tr class="empty"> <tbody>
<td colspan="2"><span data-i18n="optionsCustomFieldsNotFound"></span></td> <tr class="empty">
</tr> <td colspan="2"><span data-i18n="optionsCustomFieldsNotFound"></span></td>
<tr class="clone"> </tr>
<td></td> <tr class="clone d-none">
<td><button class="btn btn-sm delete btn-danger btn"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonRemove"></span></button></td> <td></td>
</tr> <td class="text-nowrap"><button class="btn btn-sm delete btn-danger btn"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonRemove"></span></button></td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
<div id="dialogDeleteCustomCredentialFields" class="modal fade" tabindex="-1" role="dialog"> <div id="dialogDeleteCustomCredentialFields" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
@ -460,10 +451,10 @@
</div> </div>
<!-- Site preferences --> <!-- Site preferences -->
<div class="tab" id="tab-site-preferences"> <div class="tab d-none" id="tab-site-preferences">
<h2 class="tab-header" data-i18n="optionsSitePreferencesTab"></h2> <h2 class="pb-3 mt-0" data-i18n="optionsSitePreferencesTab"></h2>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-body"> <div class="card-body">
<p> <p>
<span data-i18n="optionsSitePreferencesTabHelpTextFirst"></span> <span data-i18n="optionsSitePreferencesTabHelpTextFirst"></span>
@ -474,49 +465,51 @@
<br /> <br />
<span data-i18n="optionsSitePreferencesTabHelpTextFourth"></span> <span data-i18n="optionsSitePreferencesTabHelpTextFourth"></span>
</p> </p>
<hr /> <hr class="mt-0" />
<form class="was-validated"> <form class="was-validated">
<div class="form-group"> <div class="form-group">
<label for="manualUrl" data-i18n="optionsSitePreferencesManualAddText"></label> <label for="manualUrl" data-i18n="optionsSitePreferencesManualAddText"></label>
<div class="input-group" id="manualUrlGroup"> <div class="input-group" id="manualUrlGroup">
<input class="form-control form-control-sm" type="url" id="manualUrl" aria-label="Manual URL" pattern="ftp://.*|http://.*|https://.*" minlength="10" required> <input class="form-control form-control-sm col-lg-10" type="url" id="manualUrl" aria-label="Manual URL" pattern="ftp://.*|http://.*|https://.*" minlength="10" required>
<div class="input-group-append"> <div class="input-group-append">
<button class="btn btn-sm btn-primary" type="button" id="sitePreferencesManualAdd"><i class="fa fa-plus" aria-hidden="true"></i><span data-i18n="optionsButtonAdd"></span></button> <button class="btn btn-sm btn-primary" type="button" id="sitePreferencesManualAdd"><i class="fa fa-plus" aria-hidden="true"></i><span data-i18n="optionsButtonAdd"></span></button>
</div> </div>
</div> </div>
<span class="invalid-feedback" data-i18n="optionsSitePreferencesManualAddHelp"></span> <span class="invalid-feedback d-block" data-i18n="optionsSitePreferencesManualAddHelp"></span>
</div> </div>
</form> </form>
<table class="table table-striped table-bordered"> <div class="table-responsive">
<caption data-i18n="optionsSitePreferencesTableCaption"></caption> <table class="table table-sm table-striped table-bordered">
<thead> <caption data-i18n="optionsSitePreferencesTableCaption"></caption>
<tr> <thead>
<th scope="col"><span data-i18n="optionsColumnPageURL"></span></th> <tr>
<th scope="col"><span data-i18n="optionsColumnIgnore"></span></th> <th scope="col"><span data-i18n="optionsColumnPageURL"></span></th>
<th scope="col"><span data-i18n="optionsColumnUsernameOnly"></span></th> <th scope="col"><span data-i18n="optionsColumnIgnore"></span></th>
<th scope="col"><span data-i18n="optionsColumnDelete"></span></th> <th scope="col"><span data-i18n="optionsColumnUsernameOnly"></span></th>
</tr> <th scope="col"><span data-i18n="optionsColumnDelete"></span></th>
</thead> </tr>
<tbody> </thead>
<tr class="empty"> <tbody>
<td colspan="4"><span data-i18n="optionsSitePreferencesNotFound"></span></td> <tr class="empty">
</tr> <td colspan="4"><span data-i18n="optionsSitePreferencesNotFound"></span></td>
<tr class="clone"> </tr>
<td></td> <tr class="clone d-none">
<td> <td class="text-nowrap"></td>
<select class="form-control form-control-sm" name="ignore" data-i18n="[title]optionsSitePreferencesSelect"> <td>
<option value="ignoreNothing" data-i18n="optionsSelectionNothing"></option> <select class="form-control form-control-sm" name="ignore" data-i18n="[title]optionsSitePreferencesSelect">
<option value="ignoreNormal" data-i18n="optionsSelectionNormal"></option> <option value="ignoreNothing" data-i18n="optionsSelectionNothing"></option>
<option value="ignoreFull" data-i18n="optionsSelectionFull"></option> <option value="ignoreNormal" data-i18n="optionsSelectionNormal"></option>
</select> <option value="ignoreFull" data-i18n="optionsSelectionFull"></option>
</td> </select>
<td><input type="checkbox" name="usernameOnly" value="false" data-i18n="[title]optionsColumnUsernameOnly"/></td> </td>
<td><button class="btn btn-sm delete btn-danger btn"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonRemove"></span></button></td> <td><input type="checkbox" name="usernameOnly" value="false" data-i18n="[title]optionsColumnUsernameOnly"/></td>
</tr> <td class="text-nowrap"><button class="btn btn-sm delete btn-danger btn"><i class="fa fa-remove" aria-hidden="true"></i><span data-i18n="optionsButtonRemove"></span></button></td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
<div id="dialogDeleteSite" class="modal fade" tabindex="-1" role="dialog"> <div id="dialogDeleteSite" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog"> <div class="modal-dialog">
@ -542,11 +535,11 @@
<!-- About --> <!-- About -->
<div class="tab" id="tab-about"> <div class="tab d-none" id="tab-about">
<h2 class="tab-header" data-i18n="optionsAboutTab"></h2> <h2 class="pb-3 mt-0" data-i18n="optionsAboutTab"></h2>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-desktop" aria-hidden="true"></i> <i class="fa fa-desktop" aria-hidden="true"></i>
Extension Extension
</div> </div>
@ -563,14 +556,14 @@
<a target="_blank" href="https://github.com/keepassxreboot/keepassxc-browser" data-i18n="[title]openNewTab" tabindex="8"> <a target="_blank" href="https://github.com/keepassxreboot/keepassxc-browser" data-i18n="[title]openNewTab" tabindex="8">
<span data-i18n="optionsAboutGitHub"></span></a> <span data-i18n="optionsAboutGitHub"></span></a>
</p> </p>
<hr /> <hr class="mt-0" />
<p> <p>
<span data-i18n="optionsAboutExtensionVersion" i18n-placeholder="<em class='versionCIP'></em>"></span> <span data-i18n="optionsAboutExtensionVersion" i18n-placeholder="<em class='versionCIP'></em>"></span>
</p> </p>
<p> <p>
<span data-i18n="optionsAboutKeePassXCVersion" i18n-placeholder="<em class='versionKPH'></em>"></span> <span data-i18n="optionsAboutKeePassXCVersion" i18n-placeholder="<em class='versionKPH'></em>"></span>
</p> </p>
<hr /> <hr class="mt-0" />
<p> <p>
<span data-i18n="optionsAboutContributors"></span>:<br> <span data-i18n="optionsAboutContributors"></span>:<br>
<a target="_blank" href="https://github.com/pfn/" data-i18n="[title]openNewTab" tabindex="9">Perry Nguyen</a>, <a target="_blank" href="https://github.com/pfn/" data-i18n="[title]openNewTab" tabindex="9">Perry Nguyen</a>,
@ -582,8 +575,8 @@
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-bug" aria-hidden="true"></i> <i class="fa fa-bug" aria-hidden="true"></i>
<span data-i18n="optionsAboutReportBugs"></span> <span data-i18n="optionsAboutReportBugs"></span>
</div> </div>
@ -601,8 +594,8 @@
</div> </div>
</div> </div>
<div class="card shadow"> <div class="card my-4 shadow">
<div class="card-header"> <div class="card-header h6 rounded-0">
<i class="fa fa-file-code-o" aria-hidden="true"></i> <i class="fa fa-file-code-o" aria-hidden="true"></i>
<span data-i18n="optionsAboutLicenses"></span> <span data-i18n="optionsAboutLicenses"></span>
</div> </div>

10
keepassxc-browser/options/options.js
View file

@ -31,7 +31,7 @@ options.initMenu = function() {
$('.sidebar:first ul.nav:first li').removeClass('active'); $('.sidebar:first ul.nav:first li').removeClass('active');
$(this).parent('li').addClass('active'); $(this).parent('li').addClass('active');
$('div.tab').hide(); $('div.tab').hide();
$('div.tab#tab-' + $(this).attr('href').substring(1)).fadeIn(); $('div.tab#tab-' + $(this).attr('href').substring(1)).removeClass('d-none').fadeIn();
}); });
$('div.tab:first').show(); $('div.tab:first').show();
@ -307,7 +307,7 @@ options.initConnectedDatabases = function() {
$('#tab-connected-databases tr.clone:first .dropdown-menu:first').width('230px'); $('#tab-connected-databases tr.clone:first .dropdown-menu:first').width('230px');
const trClone = $('#tab-connected-databases table tr.clone:first').clone(true); const trClone = $('#tab-connected-databases table tr.clone:first').clone(true);
trClone.removeClass('clone'); trClone.removeClass('clone d-none');
const addHashToTable = function(hash) { const addHashToTable = function(hash) {
$('#tab-connected-databases table tbody:first tr.empty:first').hide(); $('#tab-connected-databases table tbody:first tr.empty:first').hide();
@ -390,7 +390,7 @@ options.initCustomCredentialFields = function() {
}); });
const trClone = $('#tab-custom-fields table tr.clone:first').clone(true); const trClone = $('#tab-custom-fields table tr.clone:first').clone(true);
trClone.removeClass('clone'); trClone.removeClass('clone d-none');
let counter = 1; let counter = 1;
for (const url in options.settings['defined-custom-fields']) { for (const url in options.settings['defined-custom-fields']) {
const tr = trClone.clone(true); const tr = trClone.clone(true);
@ -488,7 +488,7 @@ options.initSitePreferences = function() {
const newValue = options.settings['sitePreferences'].length + 1; const newValue = options.settings['sitePreferences'].length + 1;
const trClone = $('#tab-site-preferences table tr.clone:first').clone(true); const trClone = $('#tab-site-preferences table tr.clone:first').clone(true);
trClone.removeClass('clone'); trClone.removeClass('clone d-none');
const tr = trClone.clone(true); const tr = trClone.clone(true);
tr.data('url', value); tr.data('url', value);
@ -526,7 +526,7 @@ options.initSitePreferences = function() {
}); });
const trClone = $('#tab-site-preferences table tr.clone:first').clone(true); const trClone = $('#tab-site-preferences table tr.clone:first').clone(true);
trClone.removeClass('clone'); trClone.removeClass('clone d-none');
let counter = 1; let counter = 1;
if (options.settings['sitePreferences']) { if (options.settings['sitePreferences']) {
for (const site of options.settings['sitePreferences']) { for (const site of options.settings['sitePreferences']) {