JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite: fix long table content overflow

Browse Source 
This change fixes an issue where long text content in the common table
will overflow and breaks layout.

Change-Id: I30f6e08488410359e0a97995f8d769b272b56c72
This commit is contained in:
Wilfred Asomani 2023-07-07 12:24:37 +00:00
parent 074457fa4e
commit e0b5476e78
1 changed files with 16 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
web/satellite/src/components/common/VTable.vue
View File

@ -151,59 +151,30 @@ const emit = defineEmits(['selectAllClicked']);
}
}
@media screen and (width <= 970px) {
tbody tr > .data p {
max-width: 25rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
tbody tr > .data p {
max-width: 25rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
@media screen and (width <= 970px) {
max-width: 15rem;
}
@media screen and (width <= 870px) {
max-width: 10rem;
}
@media screen and (width <= 350px) {
max-width: 8rem;
}
}
@media screen and (width <= 870px) {
tbody tr > .data p {
max-width: 20rem;
}
}
@media screen and (width <= 550px) {
@media screen and (width <= 600px) {
.select {
display: none;
}
tbody tr > .data p {
max-width: 25rem;
}
}
@media screen and (width <= 660px) {
tbody tr > .data p {
max-width: 15rem;
}
}
@media screen and (width <= 550px) {
tbody tr > .data p {
max-width: 15rem;
}
}
@media screen and (width <= 440px) {
tbody tr > .data p {
max-width: 10rem;
}
}
@media screen and (width <= 350px) {
tbody tr > .data p {
max-width: 8rem;
}
}
</style>