aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2023-05-26 10:27:02 +0200
committerChocobozzz <me@florianbigard.com>2023-05-26 10:27:02 +0200
commit4b70c278a960a8d43407f0039aa03d0b08b44f9c (patch)
treed82990de9c1075dc5357f5f2f03162381f1e2c87 /client/src/app/shared
parenta4c49a17ea8b90c1522a9d0868de7186c7432592 (diff)
downloadPeerTube-4b70c278a960a8d43407f0039aa03d0b08b44f9c.tar.gz
PeerTube-4b70c278a960a8d43407f0039aa03d0b08b44f9c.tar.zst
PeerTube-4b70c278a960a8d43407f0039aa03d0b08b44f9c.zip
Automatic colspan for tables
Diffstat (limited to 'client/src/app/shared')
-rw-r--r--client/src/app/shared/shared-abuse-list/abuse-list-table.component.html6
-rw-r--r--client/src/app/shared/shared-main/angular/auto-colspan.directive.ts22
-rw-r--r--client/src/app/shared/shared-main/angular/index.ts1
-rw-r--r--client/src/app/shared/shared-main/shared-main.module.ts3
-rw-r--r--client/src/app/shared/shared-moderation/account-blocklist.component.html2
-rw-r--r--client/src/app/shared/shared-moderation/server-blocklist.component.html2
6 files changed, 31 insertions, 5 deletions
diff --git a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html
index 2571cc952..5833e3465 100644
--- a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html
+++ b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.html
@@ -136,10 +136,10 @@
136 136
137 <ng-template pTemplate="rowexpansion" let-abuse> 137 <ng-template pTemplate="rowexpansion" let-abuse>
138 <tr> 138 <tr>
139 <td *ngIf="isAdminView()" class="expand-cell" colspan="8"> 139 <td *ngIf="isAdminView()" class="expand-cell" myAutoColspan>
140 <my-abuse-details [abuse]="abuse" [isAdminView]="true"></my-abuse-details> 140 <my-abuse-details [abuse]="abuse" [isAdminView]="true"></my-abuse-details>
141 </td> 141 </td>
142 <td *ngIf="!isAdminView()" class="expand-cell" colspan="6"> 142 <td *ngIf="!isAdminView()" class="expand-cell" myAutoColspan>
143 <my-abuse-details [abuse]="abuse" [isAdminView]="false"></my-abuse-details> 143 <my-abuse-details [abuse]="abuse" [isAdminView]="false"></my-abuse-details>
144 </td> 144 </td>
145 </tr> 145 </tr>
@@ -147,7 +147,7 @@
147 147
148 <ng-template pTemplate="emptymessage"> 148 <ng-template pTemplate="emptymessage">
149 <tr> 149 <tr>
150 <td colspan="6"> 150 <td myAutoColspan>
151 <div class="no-results"> 151 <div class="no-results">
152 <ng-container *ngIf="search" i18n>No abuses found matching current filters.</ng-container> 152 <ng-container *ngIf="search" i18n>No abuses found matching current filters.</ng-container>
153 <ng-container *ngIf="!search" i18n>No abuses found.</ng-container> 153 <ng-container *ngIf="!search" i18n>No abuses found.</ng-container>
diff --git a/client/src/app/shared/shared-main/angular/auto-colspan.directive.ts b/client/src/app/shared/shared-main/angular/auto-colspan.directive.ts
new file mode 100644
index 000000000..8da89b668
--- /dev/null
+++ b/client/src/app/shared/shared-main/angular/auto-colspan.directive.ts
@@ -0,0 +1,22 @@
1import { AfterViewInit, Directive, ElementRef, Renderer2 } from '@angular/core'
2
3@Directive({
4 selector: '[myAutoColspan]'
5})
6export class AutoColspanDirective implements AfterViewInit {
7
8 constructor (
9 private host: ElementRef,
10 private renderer: Renderer2
11 ) { }
12
13 ngAfterViewInit () {
14 const el = this.host.nativeElement as HTMLElement
15 const table = el.closest('table')
16 if (!table) throw new Error('table element not found')
17
18 const th = table.querySelectorAll('th')
19
20 this.renderer.setAttribute(el, 'colspan', th.length + '')
21 }
22}
diff --git a/client/src/app/shared/shared-main/angular/index.ts b/client/src/app/shared/shared-main/angular/index.ts
index f72d60313..6ea494129 100644
--- a/client/src/app/shared/shared-main/angular/index.ts
+++ b/client/src/app/shared/shared-main/angular/index.ts
@@ -1,3 +1,4 @@
1export * from './auto-colspan.directive'
1export * from './autofocus.directive' 2export * from './autofocus.directive'
2export * from './bytes.pipe' 3export * from './bytes.pipe'
3export * from './defer-loading.directive' 4export * from './defer-loading.directive'
diff --git a/client/src/app/shared/shared-main/shared-main.module.ts b/client/src/app/shared/shared-main/shared-main.module.ts
index 0bdf27263..d3ec31d6e 100644
--- a/client/src/app/shared/shared-main/shared-main.module.ts
+++ b/client/src/app/shared/shared-main/shared-main.module.ts
@@ -18,6 +18,7 @@ import { LoadingBarHttpClientModule } from '@ngx-loading-bar/http-client'
18import { SharedGlobalIconModule } from '../shared-icons' 18import { SharedGlobalIconModule } from '../shared-icons'
19import { AccountService, SignupLabelComponent } from './account' 19import { AccountService, SignupLabelComponent } from './account'
20import { 20import {
21 AutoColspanDirective,
21 AutofocusDirective, 22 AutofocusDirective,
22 BytesPipe, 23 BytesPipe,
23 DeferLoadingDirective, 24 DeferLoadingDirective,
@@ -89,6 +90,7 @@ import { VideoChannelService } from './video-channel'
89 DurationFormatterPipe, 90 DurationFormatterPipe,
90 AutofocusDirective, 91 AutofocusDirective,
91 DeferLoadingDirective, 92 DeferLoadingDirective,
93 AutoColspanDirective,
92 94
93 InfiniteScrollerDirective, 95 InfiniteScrollerDirective,
94 PeerTubeTemplateDirective, 96 PeerTubeTemplateDirective,
@@ -150,6 +152,7 @@ import { VideoChannelService } from './video-channel'
150 DurationFormatterPipe, 152 DurationFormatterPipe,
151 AutofocusDirective, 153 AutofocusDirective,
152 DeferLoadingDirective, 154 DeferLoadingDirective,
155 AutoColspanDirective,
153 156
154 InfiniteScrollerDirective, 157 InfiniteScrollerDirective,
155 PeerTubeTemplateDirective, 158 PeerTubeTemplateDirective,
diff --git a/client/src/app/shared/shared-moderation/account-blocklist.component.html b/client/src/app/shared/shared-moderation/account-blocklist.component.html
index 8cf9aa4c9..609a8cecd 100644
--- a/client/src/app/shared/shared-moderation/account-blocklist.component.html
+++ b/client/src/app/shared/shared-moderation/account-blocklist.component.html
@@ -49,7 +49,7 @@
49 49
50 <ng-template pTemplate="emptymessage"> 50 <ng-template pTemplate="emptymessage">
51 <tr> 51 <tr>
52 <td colspan="3"> 52 <td myAutoColspan>
53 <div class="no-results"> 53 <div class="no-results">
54 <ng-container *ngIf="search" i18n>No account found matching current filters.</ng-container> 54 <ng-container *ngIf="search" i18n>No account found matching current filters.</ng-container>
55 <ng-container *ngIf="!search" i18n>No account found.</ng-container> 55 <ng-container *ngIf="!search" i18n>No account found.</ng-container>
diff --git a/client/src/app/shared/shared-moderation/server-blocklist.component.html b/client/src/app/shared/shared-moderation/server-blocklist.component.html
index 1a13e0207..a98333339 100644
--- a/client/src/app/shared/shared-moderation/server-blocklist.component.html
+++ b/client/src/app/shared/shared-moderation/server-blocklist.component.html
@@ -51,7 +51,7 @@
51 51
52 <ng-template pTemplate="emptymessage"> 52 <ng-template pTemplate="emptymessage">
53 <tr> 53 <tr>
54 <td colspan="3"> 54 <td myAutoColspan>
55 <div class="no-results"> 55 <div class="no-results">
56 <ng-container *ngIf="search" i18n>No server found matching current filters.</ng-container> 56 <ng-container *ngIf="search" i18n>No server found matching current filters.</ng-container>
57 <ng-container *ngIf="!search" i18n>No server found.</ng-container> 57 <ng-container *ngIf="!search" i18n>No server found.</ng-container>