diff --git a/scripts/pi-hole/js/settings-dns-records.js b/scripts/pi-hole/js/settings-dns-records.js index a438adb5..d664d8ee 100644 --- a/scripts/pi-hole/js/settings-dns-records.js +++ b/scripts/pi-hole/js/settings-dns-records.js @@ -49,7 +49,7 @@ function populateDataTable(endpoint) { columns = [ { data: null, render: CNAMEdomain }, { data: null, render: CNAMEtarget }, - { data: null, render: CNAMEttl }, + { data: null, width: "40px", render: CNAMEttl }, { data: null, width: "22px", orderable: false }, ]; } @@ -73,6 +73,7 @@ function populateDataTable(endpoint) { type: "GET", dataSrc: `config.dns.${endpoint}`, }, + autoWidth: false, columns: columns, columnDefs: [ { @@ -99,7 +100,7 @@ function populateDataTable(endpoint) { $(`td:eq(${endpoint === "hosts" ? 2 : 3})`, row).html(button); }, dom: - "<'row'<'col-sm-6'l><'col-sm-6'f>>" + + "<'row'<'col-sm-5'l><'col-sm-7'f>>" + "<'row'<'col-sm-12'p>>" + "<'row'<'col-sm-12'<'table-responsive'tr>>>" + "<'row'<'col-sm-12'p>>" + @@ -264,4 +265,7 @@ $(document).ready(function () { console.log(exception); // eslint-disable-line no-console }); }); + + // Add a small legend below the CNAME table + $("#cnameRecords-Table").after("* TTL in seconds (optional)"); }); diff --git a/settings-dnsrecords.lp b/settings-dnsrecords.lp index eecee140..7e726a85 100644 --- a/settings-dnsrecords.lp +++ b/settings-dnsrecords.lp @@ -14,125 +14,96 @@ PageTitle = "Local DNS Settings" mg.include('scripts/pi-hole/lua/settings_header.lp','r') ?>
-
+

Local DNS records

-
-
- -
-

- Add new DNS record -

-
- -
-
- -
-
-
- - -
-
- - -
-
-
-
- Note: -

Adding/removing local DNS records will flush the cache but does not require a restart of the DNS server.

- -
-
-

List of local DNS records

- - - - - + + + + + + + + + + + +
DomainIP
DomainIP
+ + + + + +
+
+ Note: +

Adding/removing local DNS records will flush the cache but does not require a restart of the DNS server.

+
-
+

Local CNAME records records

-
-
- -
-

- Add new CNAME record -

-
- -
-
- -
-
-
- - -
-
- - -
-
- - -
-
-
-
- Note: -

The target of a CNAME must be a domain that the Pi-hole already has in its cache or is authoritative for. This is a universal limitation of CNAME records.

-

The reason for this is that Pi-hole will not send additional queries upstream when serving CNAME replies. As consequence, if you set a target that isn't already known, the reply to the client may be incomplete. Pi-hole just returns the information it knows at the time of the query. This results in certain limitations for CNAME targets, - for instance, only active DHCP leases work as targets - mere DHCP leases aren't sufficient as they aren't (yet) valid DNS records.

-

Additionally, you can't CNAME external domains (bing.com to google.com) successfully as this could result in invalid SSL certificate errors when the target server does not serve content for the requested domain.

-

Adding/removing local CNAME records will restart the DNS server.

- -
-
-

List of local CNAME records

- - - - - - + + + + + + + + + + + + + +
DomainTargetTTL
DomainTargetTTL *
+ + + + + + + +
+
+ Note: +

The target of a CNAME must be a domain that the Pi-hole already has in its cache or is authoritative for. This is a universal limitation of CNAME records.

+

The reason for this is that Pi-hole will not send additional queries upstream when serving CNAME replies. As consequence, if you set a target that isn't already known, the reply to the client may be incomplete. Pi-hole just returns the information it knows at the time of the query. This results in certain limitations for CNAME targets, + for instance, only active DHCP leases work as targets - mere DHCP leases aren't sufficient as they aren't (yet) valid DNS records.

+

Additionally, you can't CNAME external domains (bing.com to google.com) successfully as this could result in invalid SSL certificate errors when the target server does not serve content for the requested domain.

+

Adding/removing local CNAME records will restart the DNS server.

+
diff --git a/style/pi-hole.css b/style/pi-hole.css index e140ccb0..82b8bb77 100644 --- a/style/pi-hole.css +++ b/style/pi-hole.css @@ -373,12 +373,18 @@ td.lookatme { font-family: inherit; } -.form-inline .dataTables .form-control { +.form-inline .dataTable .form-control { display: inline-block; width: 100%; vertical-align: middle; } +/* Table footer row used to add new items, using inline input fields */ +tfoot.add-new-item > tr > th { + font-weight: normal; + vertical-align: inherit; +} + .select2-container--default .select2-results > .select2-results__options { max-height: 400px; }