ux, and themes

This commit is contained in:
Mateusz Gruszczyński
2026-05-26 22:42:14 +02:00
parent 869af8756f
commit 1eb3aeff6c
2 changed files with 113 additions and 17 deletions

File diff suppressed because one or more lines are too long

View File

@@ -4485,35 +4485,135 @@ body,
}
}
/* Note: Peers tables keep hostnames readable without letting the Host column dominate the layout. */
.peers-table {
table-layout: auto;
min-width: 960px;
table-layout: fixed;
width: 100%;
}
.peers-table th,
.peers-table td {
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
}
.peers-table .peer-progress-wide {
min-width: 108px;
width: clamp(108px, 12vw, 126px);
width: 100%;
}
.peers-table-hosts th:nth-child(1),
.peers-table-hosts td:nth-child(1) {
width: 4%;
}
.peers-table-hosts th:nth-child(2),
.peers-table-hosts td:nth-child(2) {
width: 13%;
}
.peers-table-hosts th:nth-child(3),
.peers-table-hosts td:nth-child(3) {
width: 15%;
}
.peers-table-hosts th:nth-child(4),
.peers-table-hosts td:nth-child(4),
.peers-table-hosts th:nth-child(5),
.peers-table-hosts td:nth-child(5) {
width: 8%;
}
.peers-table-hosts th:nth-child(6),
.peers-table-hosts td:nth-child(6) {
width: 15%;
}
.peers-table-hosts th:nth-child(7),
.peers-table-hosts td:nth-child(7) {
width: 10%;
}
.peers-table-hosts th:nth-child(8),
.peers-table-hosts td:nth-child(8),
.peers-table-hosts th:nth-child(9),
.peers-table-hosts td:nth-child(9) {
width: 6%;
}
.peers-table-hosts th:nth-child(10),
.peers-table-hosts td:nth-child(10) {
width: 5%;
}
.peers-table-hosts th:nth-child(11),
.peers-table-hosts td:nth-child(11) {
width: 10%;
}
.peer-host {
display: inline-block;
max-width: min(54vw, 100%);
display: block;
max-width: 100%;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
white-space: nowrap;
}
.peers-table th:nth-child(3),
.peers-table td:nth-child(3) {
min-width: clamp(14rem, 26vw, 34rem);
/* Note: Mobile torrent details use a narrower fixed table so long reverse-DNS names cannot stretch the modal. */
.mobile-details-modal .modal-body {
overflow-x: hidden;
}
@media (max-width: 900px) {
.peer-host {
.mobile-details-modal .responsive-table-wrap {
max-width: 100%;
}
.mobile-details-peers-table {
min-width: 720px;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(1),
.mobile-details-peers-table.peers-table-hosts td:nth-child(1) {
width: 5%;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(2),
.mobile-details-peers-table.peers-table-hosts td:nth-child(2) {
width: 14%;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(3),
.mobile-details-peers-table.peers-table-hosts td:nth-child(3),
.mobile-details-peers-table.peers-table-hosts th:nth-child(4),
.mobile-details-peers-table.peers-table-hosts td:nth-child(4) {
width: 15%;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(5),
.mobile-details-peers-table.peers-table-hosts td:nth-child(5) {
width: 16%;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(6),
.mobile-details-peers-table.peers-table-hosts td:nth-child(6) {
width: 10%;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(7),
.mobile-details-peers-table.peers-table-hosts td:nth-child(7),
.mobile-details-peers-table.peers-table-hosts th:nth-child(8),
.mobile-details-peers-table.peers-table-hosts td:nth-child(8) {
width: 7%;
}
.mobile-details-peers-table.peers-table-hosts th:nth-child(9),
.mobile-details-peers-table.peers-table-hosts td:nth-child(9),
.mobile-details-peers-table.peers-table-hosts th:nth-child(10),
.mobile-details-peers-table.peers-table-hosts td:nth-child(10) {
width: 6%;
}
@@ -4994,10 +5094,6 @@ body,
margin-bottom: 0;
}
.mobile-details-peers-table {
min-width: 720px;
}
.mobile-details-files-table {
min-width: 760px;
}