aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared/shared-main
diff options
context:
space:
mode:
authorRigel Kent <sendmemail@rigelk.eu>2020-07-24 11:26:22 +0200
committerRigel Kent <par@rigelk.eu>2020-07-29 18:15:53 +0200
commit66927c0588b050f23ad3f98d62b48307bc7e79e7 (patch)
tree3c56129289a24a1642265deadfbcfd82a5d259b7 /client/src/app/shared/shared-main
parent4f5d045960b042eb27e10bac1bdaf1c074c9fa2a (diff)
downloadPeerTube-66927c0588b050f23ad3f98d62b48307bc7e79e7.tar.gz
PeerTube-66927c0588b050f23ad3f98d62b48307bc7e79e7.tar.zst
PeerTube-66927c0588b050f23ad3f98d62b48307bc7e79e7.zip
modify user-quota to match account settings style
Diffstat (limited to 'client/src/app/shared/shared-main')
-rw-r--r--client/src/app/shared/shared-main/users/user-quota.component.html15
-rw-r--r--client/src/app/shared/shared-main/users/user-quota.component.scss13
2 files changed, 14 insertions, 14 deletions
diff --git a/client/src/app/shared/shared-main/users/user-quota.component.html b/client/src/app/shared/shared-main/users/user-quota.component.html
index f9fb32133..06981223a 100644
--- a/client/src/app/shared/shared-main/users/user-quota.component.html
+++ b/client/src/app/shared/shared-main/users/user-quota.component.html
@@ -1,21 +1,22 @@
1<div class="user-quota mb-3"> 1<div class="user-quota mb-3">
2 <div> 2 <div>
3 <strong class="user-quota-title" tabindex="0" i18n>Total video quota</strong> 3 <label class="user-quota-title" tabindex="0" i18n>Total video quota</label>
4 <div class="progress" tabindex="0" [ngbTooltip]="titleVideoQuota()"> 4 <div class="progress" tabindex="0" [ngbTooltip]="titleVideoQuota()">
5 <div class="progress-bar" tabindex="0" role="progressbar" [style]="{ width: userVideoQuotaPercentage + '%' }" 5 <div class="progress-bar" tabindex="0" role="progressbar" [style]="{ width: userVideoQuotaPercentage + '%' }"
6 [attr.aria-valuenow]="userVideoQuotaUsed" aria-valuemin="0" [attr.aria-valuemax]="user.videoQuota"> 6 [attr.aria-valuenow]="userVideoQuotaUsed" aria-valuemin="0" [attr.aria-valuemax]="user.videoQuota"></div>
7 {{ userVideoQuotaUsed | bytes: 0 }}</div> 7 <span>{{ userVideoQuotaUsed | bytes: 1 }}</span>
8 <span class="ml-auto mr-2">{{ userVideoQuota }}</span> 8 <span>{{ userVideoQuota }}</span>
9 </div> 9 </div>
10 </div> 10 </div>
11 11
12 <div *ngIf="hasDailyQuota()" class="mt-3"> 12 <div *ngIf="hasDailyQuota()" class="mt-3">
13 <strong class="user-quota-title" tabindex="0" i18n>Daily video quota</strong> 13 <label class="user-quota-title" tabindex="0" i18n>Daily video quota</label>
14 <div class="progress" tabindex="0" [ngbTooltip]="titleVideoQuotaDaily()"> 14 <div class="progress" tabindex="0" [ngbTooltip]="titleVideoQuotaDaily()">
15 <div class="progress-bar secondary" role="progressbar" [style]="{ width: userVideoQuotaDailyPercentage + '%' }" 15 <div class="progress-bar secondary" role="progressbar" [style]="{ width: userVideoQuotaDailyPercentage + '%' }"
16 [attr.aria-valuenow]="userVideoQuotaUsedDaily" aria-valuemin="0" [attr.aria-valuemax]="user.videoQuotaDaily"> 16 [attr.aria-valuenow]="userVideoQuotaUsedDaily" aria-valuemin="0" [attr.aria-valuemax]="user.videoQuotaDaily"></div>
17 {{ userVideoQuotaUsedDaily | bytes: 0 }}</div>
18 <span class="ml-auto mr-2">{{ userVideoQuotaDaily }}</span> 17 <span class="ml-auto mr-2">{{ userVideoQuotaDaily }}</span>
18 <span>{{ userVideoQuotaUsedDaily | bytes: 1 }}</span>
19 <span>{{ userVideoQuotaDaily }}</span>
19 </div> 20 </div>
20 </div> 21 </div>
21</div> \ No newline at end of file 22</div> \ No newline at end of file
diff --git a/client/src/app/shared/shared-main/users/user-quota.component.scss b/client/src/app/shared/shared-main/users/user-quota.component.scss
index 904add0f4..c670559d3 100644
--- a/client/src/app/shared/shared-main/users/user-quota.component.scss
+++ b/client/src/app/shared/shared-main/users/user-quota.component.scss
@@ -1,10 +1,12 @@
1@import '_variables'; 1@import '_variables';
2@import '_mixins'; 2@import '_mixins';
3 3
4.user-quota { 4label {
5 font-size: 15px; 5 font-weight: $font-regular;
6 margin-top: 20px; 6 font-size: 100%;
7}
7 8
9.user-quota {
8 label { 10 label {
9 margin-right: 5px; 11 margin-right: 5px;
10 } 12 }
@@ -13,12 +15,9 @@
13 width: 100% !important; 15 width: 100% !important;
14 } 16 }
15 17
16 .user-quota-title, .progress { 18 .progress {
17 @include disable-outline; 19 @include disable-outline;
18 @include button-focus(pvar(--mainColorLightest)); 20 @include button-focus(pvar(--mainColorLightest));
19 }
20
21 .progress {
22 @include progressbar; 21 @include progressbar;
23 22
24 height: 2rem; 23 height: 2rem;