aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorRigel Kent <sendmemail@rigelk.eu>2020-11-21 12:43:53 +0100
committerRigel Kent <sendmemail@rigelk.eu>2020-11-21 12:44:05 +0100
commitc5dcdab330b1767c0ce25d788ed51119f74e7e71 (patch)
treee62aabb66a1592f0ef1fe159d97e65779af89873 /client
parent47e363bbe961c03c2a7d13b8da3de4b90047b002 (diff)
downloadPeerTube-c5dcdab330b1767c0ce25d788ed51119f74e7e71.tar.gz
PeerTube-c5dcdab330b1767c0ce25d788ed51119f74e7e71.tar.zst
PeerTube-c5dcdab330b1767c0ce25d788ed51119f74e7e71.zip
add explicit numbers in configuration number inputs
fixes #1346
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html58
-rw-r--r--client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss11
-rw-r--r--client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.html4
3 files changed, 50 insertions, 23 deletions
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
index e0361fbfd..09539fa92 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.html
@@ -362,10 +362,13 @@
362 362
363 <div [ngClass]="{ 'disabled-checkbox-extra': !isSignupEnabled() }" class="mt-3"> 363 <div [ngClass]="{ 'disabled-checkbox-extra': !isSignupEnabled() }" class="mt-3">
364 <label i18n for="signupLimit">Signup limit</label> 364 <label i18n for="signupLimit">Signup limit</label>
365 <input 365 <div class="number-with-unit">
366 type="number" min="-1" id="signupLimit" class="form-control" 366 <input
367 formControlName="limit" [ngClass]="{ 'input-error': formErrors['signup.limit'] }" 367 type="number" min="-1" id="signupLimit" class="form-control"
368 > 368 formControlName="limit" [ngClass]="{ 'input-error': formErrors['signup.limit'] }"
369 >
370 <span i18n>{form.value['signup']['limit'], plural, =1 {user} other {users}}</span>
371 </div>
369 <div *ngIf="formErrors.signup.limit" class="form-error">{{ formErrors.signup.limit }}</div> 372 <div *ngIf="formErrors.signup.limit" class="form-error">{{ formErrors.signup.limit }}</div>
370 <small *ngIf="form.value['signup']['limit'] === -1" class="text-muted">Signup won't be limited to a fixed number of users.</small> 373 <small *ngIf="form.value['signup']['limit'] === -1" class="text-muted">Signup won't be limited to a fixed number of users.</small>
371 </div> 374 </div>
@@ -743,22 +746,29 @@
743 746
744 <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> 747 <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }">
745 <label i18n for="liveMaxInstanceLives">Max lives created on your instance (-1 for "unlimited")</label> 748 <label i18n for="liveMaxInstanceLives">Max lives created on your instance (-1 for "unlimited")</label>
746 <input type="number" name="liveMaxInstanceLives" formControlName="maxInstanceLives" /> 749 <div class="number-with-unit">
750 <input type="number" name="liveMaxInstanceLives" formControlName="maxInstanceLives" />
751 <span i18n>{form.value['live']['maxInstanceLives'], plural, =1 {live} other {lives}}</span>
752 </div>
747 </div> 753 </div>
748 754
749 <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> 755 <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }">
750 <label i18n for="liveMaxUserLives">Max lives created per user (-1 for "unlimited")</label> 756 <label i18n for="liveMaxUserLives">Max lives created per user (-1 for "unlimited")</label>
751 <input type="number" name="liveMaxUserLives" formControlName="maxUserLives" /> 757 <div class="number-with-unit">
758 <input type="number" name="liveMaxUserLives" formControlName="maxUserLives" />
759 <span i18n>{form.value['live']['maxUserLives'], plural, =1 {live} other {lives}}</span>
760 </div>
752 </div> 761 </div>
753 762
754 <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }"> 763 <div class="form-group" [ngClass]="{ 'disabled-checkbox-extra': !isLiveEnabled() }">
755 <label i18n for="liveMaxDuration">Max live duration</label> 764 <label i18n for="liveMaxDuration">Max live duration</label>
756 <div class="peertube-select-container"> 765 <div class="peertube-select-container">
757 <select id="liveMaxDuration" formControlName="maxDuration" class="form-control"> 766 <ng-select
758 <option *ngFor="let liveMaxDurationOption of liveMaxDurationOptions" [value]="liveMaxDurationOption.value"> 767 labelForId="liveMaxDuration" [items]="liveMaxDurationOptions" formControlName="maxDuration"
759 {{ liveMaxDurationOption.label }} 768 bindLabel="label" bindValue="value"
760 </option> 769 [clearable]="false"
761 </select> 770 [searchable]="false"
771 ></ng-select>
762 </div> 772 </div>
763 </div> 773 </div>
764 774
@@ -780,7 +790,7 @@
780 <div class="peertube-select-container"> 790 <div class="peertube-select-container">
781 <select id="liveTranscodingThreads" formControlName="threads" class="form-control"> 791 <select id="liveTranscodingThreads" formControlName="threads" class="form-control">
782 <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value"> 792 <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value">
783 {{ transcodingThreadOption.label }} 793 {{ transcodingThreadOption.label }} {transcodingThreadOption.value, plural, =0 {} =1 {thread} other {threads}}
784 </option> 794 </option>
785 </select> 795 </select>
786 </div> 796 </div>
@@ -922,7 +932,7 @@
922 <div class="peertube-select-container"> 932 <div class="peertube-select-container">
923 <select id="transcodingThreads" formControlName="threads" class="form-control"> 933 <select id="transcodingThreads" formControlName="threads" class="form-control">
924 <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value"> 934 <option *ngFor="let transcodingThreadOption of transcodingThreadOptions" [value]="transcodingThreadOption.value">
925 {{ transcodingThreadOption.label }} 935 {{ transcodingThreadOption.label }} {transcodingThreadOption.value, plural, =0 {} =1 {thread} other {threads}}
926 </option> 936 </option>
927 </select> 937 </select>
928 </div> 938 </div>
@@ -968,19 +978,25 @@
968 <ng-container formGroupName="cache"> 978 <ng-container formGroupName="cache">
969 <div class="form-group" formGroupName="previews"> 979 <div class="form-group" formGroupName="previews">
970 <label i18n for="cachePreviewsSize">Number of previews to keep in cache</label> 980 <label i18n for="cachePreviewsSize">Number of previews to keep in cache</label>
971 <input 981 <div class="number-with-unit">
972 type="number" min="0" id="cachePreviewsSize" class="form-control" 982 <input
973 formControlName="size" [ngClass]="{ 'input-error': formErrors['cache.previews.size'] }" 983 type="number" min="0" id="cachePreviewsSize" class="form-control"
974 > 984 formControlName="size" [ngClass]="{ 'input-error': formErrors['cache.previews.size'] }"
985 >
986 <span i18n>{form.value['cache']['previews']['size'], plural, =1 {cached image} other {cached images}}</span>
987 </div>
975 <div *ngIf="formErrors.cache.previews.size" class="form-error">{{ formErrors.cache.previews.size }}</div> 988 <div *ngIf="formErrors.cache.previews.size" class="form-error">{{ formErrors.cache.previews.size }}</div>
976 </div> 989 </div>
977 990
978 <div class="form-group" formGroupName="captions"> 991 <div class="form-group" formGroupName="captions">
979 <label i18n for="cacheCaptionsSize">Number of video captions to keep in cache</label> 992 <label i18n for="cacheCaptionsSize">Number of video captions to keep in cache</label>
980 <input 993 <div class="number-with-unit">
981 type="number" min="0" id="cacheCaptionsSize" class="form-control" 994 <input
982 formControlName="size" [ngClass]="{ 'input-error': formErrors['cache.captions.size'] }" 995 type="number" min="0" id="cacheCaptionsSize" class="form-control"
983 > 996 formControlName="size" [ngClass]="{ 'input-error': formErrors['cache.captions.size'] }"
997 >
998 <span i18n>{form.value['cache']['captions']['size'], plural, =1 {cached image} other {cached images}}</span>
999 </div>
984 <div *ngIf="formErrors.cache.captions.size" class="form-error">{{ formErrors.cache.captions.size }}</div> 1000 <div *ngIf="formErrors.cache.captions.size" class="form-error">{{ formErrors.cache.captions.size }}</div>
985 </div> 1001 </div>
986 </ng-container> 1002 </ng-container>
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss
index 14cd6bd8b..d5352b472 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss
@@ -22,6 +22,17 @@ input[type=number] {
22 display: block; 22 display: block;
23} 23}
24 24
25.number-with-unit {
26 position: relative;
27 width: min-content;
28
29 input[type=number] + span {
30 position: absolute;
31 top: 5px;
32 right: 2.5rem;
33 }
34}
35
25input[type=checkbox] { 36input[type=checkbox] {
26 @include peertube-checkbox(1px); 37 @include peertube-checkbox(1px);
27} 38}
diff --git a/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.html b/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.html
index 8b7c12ba3..8ec4ebbb2 100644
--- a/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.html
+++ b/client/src/app/+admin/moderation/video-comment-list/video-comment-list.component.html
@@ -105,11 +105,11 @@
105 <a [href]="videoComment.localUrl" target="_blank" rel="noopener noreferrer">{{ videoComment.video.name }}</a> 105 <a [href]="videoComment.localUrl" target="_blank" rel="noopener noreferrer">{{ videoComment.video.name }}</a>
106 </td> 106 </td>
107 107
108 <td class="comment-html"> 108 <td class="comment-html c-hand" [pRowToggler]="videoComment">
109 <div [innerHTML]="videoComment.textHtml"></div> 109 <div [innerHTML]="videoComment.textHtml"></div>
110 </td> 110 </td>
111 111
112 <td>{{ videoComment.createdAt | date: 'short' }}</td> 112 <td class="c-hand" [pRowToggler]="videoComment">{{ videoComment.createdAt | date: 'short' }}</td>
113 </tr> 113 </tr>
114 </ng-template> 114 </ng-template>
115 115