fix overflowing tables on ln nodes-per-x chart pages

This commit is contained in:
Mononaut 2023-01-18 15:48:01 -06:00
parent 47d2a6d5c7
commit c5f9682b5b
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
3 changed files with 12 additions and 7 deletions

View File

@ -21,7 +21,7 @@
<div class="spinner-border text-light"></div> <div class="spinner-border text-light"></div>
</div> </div>
<table class="table table-borderless text-center m-auto" style="max-width: 900px"> <table class="table table-borderless table-fixed text-center m-auto" style="max-width: 900px">
<thead> <thead>
<tr> <tr>
<th class="text-left rank" i18n="mining.rank">Rank</th> <th class="text-left rank" i18n="mining.rank">Rank</th>

View File

@ -42,14 +42,14 @@
} }
.rank { .rank {
width: 20%; width: 8%;
@media (max-width: 576px) { @media (max-width: 576px) {
display: none display: none
} }
} }
.name { .name {
width: 20%; width: 36%;
@media (max-width: 576px) { @media (max-width: 576px) {
width: 80%; width: 80%;
max-width: 150px; max-width: 150px;
@ -59,21 +59,21 @@
} }
.share { .share {
width: 20%; width: 15%;
@media (max-width: 576px) { @media (max-width: 576px) {
display: none display: none
} }
} }
.nodes { .nodes {
width: 20%; width: 15%;
@media (max-width: 576px) { @media (max-width: 576px) {
width: 10%; width: 10%;
} }
} }
.capacity { .capacity {
width: 20%; width: 26%;
@media (max-width: 576px) { @media (max-width: 576px) {
width: 10%; width: 10%;
max-width: 100px; max-width: 100px;
@ -91,3 +91,8 @@ a:hover .link {
.flag { .flag {
font-size: 20px; font-size: 20px;
} }
.text-truncate .link {
overflow: hidden;
text-overflow: ellipsis;
}

View File

@ -51,7 +51,7 @@
<app-toggle [textLeft]="'Sort by nodes'" [textRight]="'capacity'" [checked]="true" (toggleStatusChanged)="onGroupToggleStatusChanged($event)"></app-toggle> <app-toggle [textLeft]="'Sort by nodes'" [textRight]="'capacity'" [checked]="true" (toggleStatusChanged)="onGroupToggleStatusChanged($event)"></app-toggle>
</div> </div>
<table class="table table-borderless text-center m-auto" style="max-width: 900px" *ngIf="!widget"> <table class="table table-borderless table-fixed text-center m-auto" style="max-width: 900px" *ngIf="!widget">
<thead> <thead>
<tr> <tr>
<th class="rank text-left pl-0" i18n="mining.rank">Rank</th> <th class="rank text-left pl-0" i18n="mining.rank">Rank</th>