mirror of
https://github.com/nimbold/Firelink.git
synced 2026-07-26 12:08:27 +00:00
fix(ui): prevent download table column overflow
This commit is contained in:
+97
-60
@@ -931,26 +931,36 @@
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.download-table-scroll {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
.download-table-scroll {
|
||||
flex: 1;
|
||||
min-height: 0;
|
||||
min-width: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.download-table-header,
|
||||
.download-row {
|
||||
width: max-content;
|
||||
min-width: 100%;
|
||||
}
|
||||
.download-table-header,
|
||||
.download-row {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.download-table-header > div {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
}
|
||||
.download-table-header > div {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.download-table-header > div > span {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.download-table-header > div:not(:first-child) {
|
||||
border-left: 1px solid hsl(var(--border-color));
|
||||
@@ -976,16 +986,22 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.download-row {
|
||||
height: 32px;
|
||||
display: grid;
|
||||
align-items: center;
|
||||
padding: 0 16px;
|
||||
margin: 2px 12px;
|
||||
border-radius: 6px;
|
||||
color: hsl(var(--text-primary));
|
||||
font-size: 12px;
|
||||
}
|
||||
.download-row {
|
||||
height: 32px;
|
||||
display: grid;
|
||||
align-items: center;
|
||||
width: auto;
|
||||
padding: 0 16px;
|
||||
margin: 2px 12px;
|
||||
border-radius: 6px;
|
||||
color: hsl(var(--text-primary));
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.download-row > div {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.download-row:nth-child(even) {
|
||||
background: hsl(var(--stripe-bg));
|
||||
@@ -995,32 +1011,51 @@
|
||||
background: hsl(var(--item-hover));
|
||||
}
|
||||
|
||||
.download-file-cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 9px;
|
||||
min-width: 0;
|
||||
}
|
||||
.download-file-cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 9px;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.download-file-name {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: hsl(var(--text-primary));
|
||||
font-weight: 650;
|
||||
}
|
||||
.download-file-name {
|
||||
display: block;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: hsl(var(--text-primary));
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
.download-cell-truncate {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.download-cell-truncate > span,
|
||||
.download-cell-right > span {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.download-cell-muted {
|
||||
color: hsl(var(--text-muted));
|
||||
}
|
||||
|
||||
.download-cell-right {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
.download-cell-right {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.download-empty-row {
|
||||
color: hsl(var(--text-muted));
|
||||
@@ -1043,12 +1078,14 @@
|
||||
background: hsl(var(--stripe-bg));
|
||||
}
|
||||
|
||||
.download-status-cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding-right: 12px;
|
||||
}
|
||||
.download-status-cell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding-right: 12px;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.download-status-cell > span {
|
||||
min-width: 48px;
|
||||
@@ -1057,12 +1094,12 @@
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.download-progress-track {
|
||||
width: 100%;
|
||||
min-width: 58px;
|
||||
height: 14px;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
.download-progress-track {
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
height: 14px;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
background: hsl(var(--border-color));
|
||||
box-shadow: inset 0 1px 1px hsl(0 0% 0% / 0.22);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user