From 59082aa0d047b6fbe248a9d74b817e330016384b Mon Sep 17 00:00:00 2001
From: shats <admin@shts.su>
Date: Mon, 16 Feb 2026 17:58:47 +0700
Subject: [PATCH] refactor(Managers): update card header layout in ASNs,
 Domains, and IPRanges managers for improved visual consistency and enhanced
 user experience

---
 frontend/src/ASNsNewManager.jsx    | 19 ++++++++++++++++---
 frontend/src/DomainsNewManager.jsx | 18 ++++++++++++------
 frontend/src/IPRangesManager.jsx   | 19 ++++++++++++++++---
 3 files changed, 44 insertions(+), 12 deletions(-)

diff --git a/frontend/src/ASNsNewManager.jsx b/frontend/src/ASNsNewManager.jsx
index b740ef6..a07b987 100644
--- a/frontend/src/ASNsNewManager.jsx
+++ b/frontend/src/ASNsNewManager.jsx
@@ -588,9 +588,22 @@ function ASNsNewManager() {
           />
 
           <div className="card card-flat">
-            <div className="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
-              <h3 className="card-title mb-0">Список ASN <span className="badge bg-blue-lt text-blue ms-2">{items.length}</span></h3>
-              <div className="d-flex gap-2 flex-wrap align-items-center">
+            <div className="card-header">
+              <div className="row align-items-center w-100 g-2">
+                <div className="col">
+                  <div className="d-flex align-items-center justify-content-between flex-wrap gap-2">
+                    <div className="d-flex align-items-center gap-2">
+                      <IconHash className="icon text-muted" size={18} />
+                      <span className="text-muted text-uppercase small">Список</span>
+                      <span className="badge bg-blue-lt text-blue">{filtered.length}</span>
+                    </div>
+                    <div className="d-none d-md-block text-muted small">
+                      Всего записей: {filtered.length}
+                    </div>
+                  </div>
+                </div>
+                <div className="col-12 mt-2"></div>
+                <div className="col d-flex gap-2 flex-wrap align-items-center">
                 <SavedFilters
                   pageKey="asns"
                   currentFilters={{ searchTerm, filterCommunity, sortField, sortOrder }}
diff --git a/frontend/src/DomainsNewManager.jsx b/frontend/src/DomainsNewManager.jsx
index 41fd4a7..614d30c 100644
--- a/frontend/src/DomainsNewManager.jsx
+++ b/frontend/src/DomainsNewManager.jsx
@@ -577,13 +577,19 @@ function DomainsNewManager() {
           <div className="card card-flat animate-in" style={{animationDelay: '0.3s'}}>
             <div className="card-header">
               <div className="row align-items-center w-100 g-2">
-                <div className="col-auto">
-                  <h3 className="card-title mb-0">
-                    <IconWorld className="icon me-2" size={20} />
-                    Список доменов 
-                    <span className="badge bg-blue-lt text-blue ms-2">{filtered.length}</span>
-                  </h3>
+                <div className="col">
+                  <div className="d-flex align-items-center justify-content-between flex-wrap gap-2">
+                    <div className="d-flex align-items-center gap-2">
+                      <IconWorld className="icon text-muted" size={18} />
+                      <span className="text-muted text-uppercase small">Список</span>
+                      <span className="badge bg-blue-lt text-blue">{filtered.length}</span>
+                    </div>
+                    <div className="d-none d-md-block text-muted small">
+                      Всего записей: {filtered.length}
+                    </div>
+                  </div>
                 </div>
+                <div className="col-12 mt-2"></div>
                 <div className="col">
                   <div className="d-flex gap-2 flex-wrap">
                     {/* Сохранённые фильтры */}
diff --git a/frontend/src/IPRangesManager.jsx b/frontend/src/IPRangesManager.jsx
index 5573298..e0a1b3b 100644
--- a/frontend/src/IPRangesManager.jsx
+++ b/frontend/src/IPRangesManager.jsx
@@ -849,9 +849,22 @@ function IPRangesManager() {
           />
 
           <div className="card card-flat">
-            <div className="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
-              <h3 className="card-title mb-0">Список IP-диапазонов <span className="badge bg-blue-lt text-blue ms-2">{items.length}</span></h3>
-              <div className="d-flex gap-2 flex-wrap align-items-center">
+            <div className="card-header">
+              <div className="row align-items-center w-100 g-2">
+                <div className="col">
+                  <div className="d-flex align-items-center justify-content-between flex-wrap gap-2">
+                    <div className="d-flex align-items-center gap-2">
+                      <IconNetwork className="icon text-muted" size={18} />
+                      <span className="text-muted text-uppercase small">Список</span>
+                      <span className="badge bg-blue-lt text-blue">{filtered.length}</span>
+                    </div>
+                    <div className="d-none d-md-block text-muted small">
+                      Всего записей: {filtered.length}
+                    </div>
+                  </div>
+                </div>
+                <div className="col-12 mt-2"></div>
+                <div className="col d-flex gap-2 flex-wrap align-items-center">
                 <SavedFilters
                   pageKey="ip-ranges"
                   currentFilters={{ searchTerm, filterCommunity, sortField, sortOrder }}