denozord/router-lists-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(NetworkConfigManager): update card layout for items display; enhance responsiveness with Bootstrap grid system
Publish Fast Tabler Docker image / build-and-push-fast (push) Successful in 1m37s
Details

Browse Source
This commit is contained in:
denozord
2026-01-22 14:50:23 +07:00
parent b79dced147
commit cc69bc53b9
1 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/NetworkConfigManager.jsx
+6 -4
View File
@@ -866,9 +866,11 @@ function NetworkConfigManager() {
</div> </div>
{/* Items */} {/* Items */}
<div className="d-flex flex-column"> <div className="row row-cards">
{items.map(item => ( {items.map(item => (
type === 'gateway' ? renderGatewayCard(item) : renderInterfaceCard(item, serverId) <div key={item.id} className="col-12 col-md-6 col-lg-4">
{type === 'gateway' ? renderGatewayCard(item) : renderInterfaceCard(item, serverId)}
</div>
))} ))}
</div> </div>
</div> </div>
@@ -942,7 +944,7 @@ function NetworkConfigManager() {
} }
return ( return (
<div key={gateway.id} className="card mb-2" style={{ borderRadius: '12px', maxWidth: '100%' }}> <div className="card mb-2" style={{ borderRadius: '12px', maxWidth: '100%' }}>
<div className="card-body p-0"> <div className="card-body p-0">
<div className="d-flex align-items-stretch"> <div className="d-flex align-items-stretch">
{/* Левая часть: тип индикатора (как в ServerCard) */} {/* Левая часть: тип индикатора (как в ServerCard) */}
@@ -1077,7 +1079,7 @@ function NetworkConfigManager() {
const displayIp = displayRemoteIp !== '—' ? displayRemoteIp : displayLocalIp; const displayIp = displayRemoteIp !== '—' ? displayRemoteIp : displayLocalIp;
return ( return (
<div key={iface.id} className="card mb-2" style={{ borderRadius: '12px', maxWidth: '100%' }}> <div className="card mb-2" style={{ borderRadius: '12px', maxWidth: '100%' }}>
<div className="card-body p-0"> <div className="card-body p-0">
<div className="d-flex align-items-stretch"> <div className="d-flex align-items-stretch">
{/* Левая часть: тип интерфейса (как в ServerCard) */} {/* Левая часть: тип интерфейса (как в ServerCard) */}