EVOgeek
/
Vmeda.Online
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-2768 policy: Fix table width

main
Dani Palou 2024-03-20 09:27:55 +01:00
parent 03df67b739
commit 5d96c5a339
4 changed files with 30 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/core/features/policy/pages/acceptances/acceptances.html
View File

@ -28,26 +28,28 @@
</ion-card> </ion-card>
</div> </div>
<table *ngIf="isTablet && policies.length" class="core-table x-scrollable core-policy-tablet-container"> <div class="x-scrollable core-policy-tablet-container">
<thead> <table *ngIf="isTablet && policies.length" class="core-table">
<tr> <thead>
<th>{{ 'core.policy.policydocname' | translate }}</th> <tr>
<th>{{ 'core.policy.policydocrevision' | translate }}</th> <th>{{ 'core.policy.policydocname' | translate }}</th>
<th>{{ 'core.policy.response' | translate }}</th> <th>{{ 'core.policy.policydocrevision' | translate }}</th>
<th>{{ 'core.policy.responseon' | translate }}</th> <th>{{ 'core.policy.response' | translate }}</th>
<ng-container *ngIf="hasOnBehalf"> <th>{{ 'core.policy.responseon' | translate }}</th>
<th>{{ 'core.policy.responseby' | translate }}</th> <ng-container *ngIf="hasOnBehalf">
<th>{{ 'core.policy.acceptancenote' | translate }}</th> <th>{{ 'core.policy.responseby' | translate }}</th>
<th>{{ 'core.policy.acceptancenote' | translate }}</th>
</ng-container>
</tr>
</thead>
<tbody class="auto-striped">
<ng-container *ngFor="let policy of policies">
<ng-container
*ngTemplateOutlet="policyTabletTemplate; context: {policy: policy, isPreviousVersion: false, hidden: false}" />
</ng-container> </ng-container>
</tr> </tbody>
</thead> </table>
<tbody class="auto-striped"> </div>
<ng-container *ngFor="let policy of policies">
<ng-container
*ngTemplateOutlet="policyTabletTemplate; context: {policy: policy, isPreviousVersion: false, hidden: false}" />
</ng-container>
</tbody>
</table>
<div *ngIf="!isTablet && policies.length" class="core-policy-mobile-container"> <div *ngIf="!isTablet && policies.length" class="core-policy-mobile-container">
<ng-container *ngFor="let policy of policies"> <ng-container *ngFor="let policy of policies">

3
src/core/features/policy/pages/acceptances/acceptances.scss
View File

@ -75,7 +75,7 @@
} }
} }
table.core-policy-tablet-container { .core-policy-tablet-container table {
th { th {
&:first-child { &:first-child {
@include padding-horizontal(24px, 0px); @include padding-horizontal(24px, 0px);
@ -83,7 +83,6 @@
} }
th, td { th, td {
min-width: 200px;
text-wrap: nowrap; text-wrap: nowrap;
} }

6
src/core/features/reportbuilder/components/report-detail/report-detail.html
View File

@ -21,8 +21,8 @@
</ion-card> </ion-card>
</ng-container> </ng-container>
<ng-container *ngIf="!isCardLayout"> <div *ngIf="!isCardLayout" class="x-scrollable">
<table class="core-table x-scrollable"> <table class="core-table">
<thead> <thead>
<tr> <tr>
<th *ngFor="let header of state.report.data.headers"> <th *ngFor="let header of state.report.data.headers">
@ -40,7 +40,7 @@
</tr> </tr>
</tbody> </tbody>
</table> </table>
</ng-container> </div>
</ng-container> </ng-container>

10
src/theme/theme.base.scss
View File

@ -2031,6 +2031,11 @@ ion-datetime-button p {
margin-bottom: 4px; margin-bottom: 4px;
} }
.x-scrollable {
overflow-x: auto;
display: block;
}
// Table App styles // Table App styles
table.core-table { table.core-table {
border-collapse: collapse; border-collapse: collapse;
@ -2039,11 +2044,6 @@ table.core-table {
margin: 1em auto; margin: 1em auto;
color: var(--text-color); color: var(--text-color);
&.x-scrollable {
overflow-x: auto;
display: block;
}
thead th { thead th {
vertical-align: bottom; vertical-align: bottom;
font-weight: bold; font-weight: bold;