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

refactor: Update FilterManager layout to utilize a grid system for server display, enhancing visual organization and responsiveness of server cards.
Publish Fast Tabler Docker image / build-and-push-fast (push) Successful in 2m4s
Details

Browse Source
This commit is contained in:
denozord
2025-12-06 22:59:43 +07:00
parent c84d4367b1
commit 6f1f8b368e
1 changed files with 40 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/FilterManager.jsx
+8 -8
View File
@@ -985,13 +985,12 @@ function FilterManager() {
</div> </div>
</div> </div>
{/* Горизонтальный список серверов */} {/* Список серверов в сетке Tabler */}
<div className="d-flex flex-wrap gap-2 mb-2"> <div className="row row-cards g-2 mb-2">
{activeServers.map(server => ( {activeServers.map(server => (
<div className="col-12 col-sm-6 col-md-4 col-lg-3" key={server.id}>
<div <div
key={server.id} className={`card card-sm h-100 cursor-pointer ${selectedServer?.id === server.id ? 'border-primary' : ''}`}
className={`card card-sm cursor-pointer ${selectedServer?.id === server.id ? 'border-primary' : ''}`}
style={{ minWidth: '220px', maxWidth: '260px' }}
onClick={() => setSelectedServer(server)} onClick={() => setSelectedServer(server)}
> >
<div className="card-body d-flex align-items-start gap-2"> <div className="card-body d-flex align-items-start gap-2">
@@ -1011,12 +1010,12 @@ function FilterManager() {
</div> </div>
</div> </div>
</div> </div>
</div>
))} ))}
{inactiveServers.map(server => ( {inactiveServers.map(server => (
<div className="col-12 col-sm-6 col-md-4 col-lg-3" key={server.id}>
<div <div
key={server.id} className={`card card-sm h-100 cursor-pointer ${selectedServer?.id === server.id ? 'border-primary' : ''}`}
className={`card card-sm cursor-pointer ${selectedServer?.id === server.id ? 'border-primary' : ''}`}
style={{ minWidth: '220px', maxWidth: '260px' }}
onClick={() => setSelectedServer(server)} onClick={() => setSelectedServer(server)}
> >
<div className="card-body d-flex align-items-start gap-2"> <div className="card-body d-flex align-items-start gap-2">
@@ -1036,6 +1035,7 @@ function FilterManager() {
</div> </div>
</div> </div>
</div> </div>
</div>
))} ))}
</div> </div>