From 048a62d74a2f71c75699cd3970312444bc86a093 Mon Sep 17 00:00:00 2001
From: master3395 <master3395@users.noreply.github.com>
Date: Mon, 16 Feb 2026 15:14:00 +0100
Subject: [PATCH] CloudFlare DNS: fix search (custom filter), search icon left
 of box

---
 .../dns/addDeleteDNSRecordsCloudFlare.html          | 13 +++++++------
 public/static/dns/dns.js                            |  9 +++++++++
 static/dns/dns.js                                   |  9 +++++++++
 3 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html b/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html
index 0f89162ff..02a542769 100644
--- a/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html
+++ b/dns/templates/dns/addDeleteDNSRecordsCloudFlare.html
@@ -568,9 +568,10 @@
         .sortable-th { cursor: pointer; user-select: none; white-space: nowrap; }
         .sortable-th:hover { background: var(--bg-hover, #f0f1ff); }
         .sort-icon { margin-left: 4px; opacity: 0.7; font-size: 0.75rem; }
-        .dns-search-wrap { position: relative; max-width: 400px; }
-        .dns-search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; }
-        .dns-search-input { padding-left: 36px; padding-right: 36px; border-radius: 8px; border: 1px solid var(--border-primary, #e2e8f0); }
+        .dns-search-wrap { position: relative; max-width: 440px; display: flex; align-items: center; }
+        .dns-search-icon-left { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 38px; margin-right: 0; padding-right: 0; color: #94a3b8; background: var(--bg-hover, #f1f5f9); border: 1px solid var(--border-primary, #e2e8f0); border-right: none; border-radius: 8px 0 0 8px; flex-shrink: 0; }
+        .dns-search-input { flex: 1; padding-left: 12px; padding-right: 36px; border-radius: 0 8px 8px 0; border: 1px solid var(--border-primary, #e2e8f0); border-left: none; min-width: 0; }
+        .dns-search-wrap:focus-within .dns-search-icon-left { background: var(--bg-primary, #fff); color: #5b5fcf; }
         .dns-search-clear { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); cursor: pointer; color: #94a3b8; padding: 4px; }
         .dns-search-clear:hover { color: #64748b; }
     </style>
@@ -907,7 +908,7 @@
                                         </h4>
                                         
                                         <div class="dns-search-wrap mb-3" ng-if="!loadingRecords && records.length > 0">
-                                            <i class="fas fa-search dns-search-icon"></i>
+                                            <span class="dns-search-icon-left"><i class="fas fa-search"></i></span>
                                             <input type="text" class="form-control dns-search-input" ng-model="dnsSearchFilter" placeholder="{% trans 'Search name, type, value...' %}" title="{% trans 'Search through all records' %}">
                                             <span class="dns-search-clear" ng-if="dnsSearchFilter" ng-click="dnsSearchFilter = ''" title="{% trans 'Clear search' %}"><i class="fas fa-times"></i></span>
                                         </div>
@@ -920,7 +921,7 @@
                                             No DNS records found.
                                         </div>
                                         
-                                        <div ng-if="!loadingRecords && records.length > 0 && dnsSearchFilter && (records | filter:dnsSearchFilter).length === 0" class="alert alert-info" style="margin-bottom: 1rem;">
+                                        <div ng-if="!loadingRecords && records.length > 0 && dnsSearchFilter && (records | filter:matchDnsSearch).length === 0" class="alert alert-info" style="margin-bottom: 1rem;">
                                             <i class="fas fa-info-circle"></i> {% trans "No records match your search." %}
                                         </div>
                                         
@@ -949,7 +950,7 @@
                                                 </tr>
                                             </thead>
                                             <tbody>
-                                                <tr ng-repeat="record in records | filter:dnsSearchFilter | orderBy:sortColumn:sortReverse track by record.id">
+                                                <tr ng-repeat="record in records | filter:matchDnsSearch | orderBy:sortColumn:sortReverse track by record.id">
                                                     <td class="editable-cell">
                                                         <span ng-hide="isEditing(record, 'name')" ng-click="startEdit(record, 'name')" class="cell-click" title="{% trans 'Click to edit' %}"><strong ng-bind="record.name"></strong></span>
                                                         <input ng-show="isEditing(record, 'name')" type="text" class="inline-input" ng-model="record.name" ng-blur="saveInlineField(record, 'name')" ng-keypress="$event.keyCode === 13 && saveInlineField(record, 'name')">
diff --git a/public/static/dns/dns.js b/public/static/dns/dns.js
index 2a9790505..6ac62ff9c 100644
--- a/public/static/dns/dns.js
+++ b/public/static/dns/dns.js
@@ -1159,6 +1159,15 @@ app.controller('addModifyDNSRecordsCloudFlare', function ($scope, $http, $window
         return list;
     };
     $scope.dnsSearchFilter = '';
+    $scope.matchDnsSearch = function (record) {
+        var q = ($scope.dnsSearchFilter || '').toLowerCase().trim();
+        if (!q) return true;
+        var name = (record.name || '').toLowerCase();
+        var type = (record.type || '').toLowerCase();
+        var content = (record.content || '').toLowerCase();
+        var priority = String(record.priority != null ? record.priority : '');
+        return name.indexOf(q) !== -1 || type.indexOf(q) !== -1 || content.indexOf(q) !== -1 || priority.indexOf(q) !== -1;
+    };
     $scope.sortColumn = 'name';
     $scope.sortReverse = false;
     $scope.setSort = function (col) {
diff --git a/static/dns/dns.js b/static/dns/dns.js
index 6fec9b07b..df8c99f2b 100644
--- a/static/dns/dns.js
+++ b/static/dns/dns.js
@@ -1163,6 +1163,15 @@ app.controller('addModifyDNSRecordsCloudFlare', function ($scope, $http, $window
         return list;
     };
     $scope.dnsSearchFilter = '';
+    $scope.matchDnsSearch = function (record) {
+        var q = ($scope.dnsSearchFilter || '').toLowerCase().trim();
+        if (!q) return true;
+        var name = (record.name || '').toLowerCase();
+        var type = (record.type || '').toLowerCase();
+        var content = (record.content || '').toLowerCase();
+        var priority = String(record.priority != null ? record.priority : '');
+        return name.indexOf(q) !== -1 || type.indexOf(q) !== -1 || content.indexOf(q) !== -1 || priority.indexOf(q) !== -1;
+    };
     $scope.sortColumn = 'name';
     $scope.sortReverse = false;
     $scope.setSort = function (col) {