Remove secondary color theme
This commit is contained in:
parent
60d3601371
commit
1fef6bccd9
|
@ -139,7 +139,7 @@
|
||||||
|
|
||||||
<td *ngIf="isSelected('quotaDaily')">
|
<td *ngIf="isSelected('quotaDaily')">
|
||||||
<div class="progress" i18n-title title="Total daily video quota">
|
<div class="progress" i18n-title title="Total daily video quota">
|
||||||
<div class="progress-bar secondary" role="progressbar" [style]="{ width: getUserVideoQuotaDailyPercentage(user) + '%' }"
|
<div class="progress-bar" role="progressbar" [style]="{ width: getUserVideoQuotaDailyPercentage(user) + '%' }"
|
||||||
[attr.aria-valuenow]="user.rawVideoQuotaUsedDaily" aria-valuemin="0" [attr.aria-valuemax]="user.rawVideoQuotaDaily">
|
[attr.aria-valuenow]="user.rawVideoQuotaUsedDaily" aria-valuemin="0" [attr.aria-valuemax]="user.rawVideoQuotaDaily">
|
||||||
</div>
|
</div>
|
||||||
<span>{{ user.videoQuotaUsedDaily }}</span>
|
<span>{{ user.videoQuotaUsedDaily }}</span>
|
||||||
|
|
|
@ -190,6 +190,7 @@ export class UserListComponent extends RestTable implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
getUserVideoQuotaDailyPercentage (user: UserForList) {
|
getUserVideoQuotaDailyPercentage (user: UserForList) {
|
||||||
|
console.log(user.rawVideoQuotaUsedDaily * 100 / user.rawVideoQuotaDaily)
|
||||||
return user.rawVideoQuotaUsedDaily * 100 / user.rawVideoQuotaDaily
|
return user.rawVideoQuotaUsedDaily * 100 / user.rawVideoQuotaDaily
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,14 +1,5 @@
|
||||||
@use '_mixins' as *;
|
@use '_mixins' as *;
|
||||||
|
|
||||||
@mixin secondary {
|
|
||||||
height: 60%;
|
|
||||||
width: 60%;
|
|
||||||
position: absolute;
|
|
||||||
bottom: -5px;
|
|
||||||
right: -5px;
|
|
||||||
background-color: rgba(0, 0, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
@include margin-right(5px);
|
@include margin-right(5px);
|
||||||
|
|
||||||
|
@ -16,6 +7,11 @@
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
|
|
||||||
.second-avatar {
|
.second-avatar {
|
||||||
@include secondary();
|
height: 60%;
|
||||||
|
width: 60%;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -5px;
|
||||||
|
right: -5px;
|
||||||
|
background-color: rgba(0, 0, 0, 0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
<div *ngIf="hasDailyQuota()" class="mt-3">
|
<div *ngIf="hasDailyQuota()" class="mt-3">
|
||||||
<label class="user-quota-title" tabindex="0" i18n>Daily video quota</label>
|
<label class="user-quota-title" tabindex="0" i18n>Daily video quota</label>
|
||||||
<div class="progress" tabindex="0" [ngbTooltip]="titleVideoQuotaDaily()">
|
<div class="progress" tabindex="0" [ngbTooltip]="titleVideoQuotaDaily()">
|
||||||
<div class="progress-bar secondary" role="progressbar" [style]="{ width: userVideoQuotaDailyPercentage + '%' }"
|
<div class="progress-bar" role="progressbar" [style]="{ width: userVideoQuotaDailyPercentage + '%' }"
|
||||||
[attr.aria-valuenow]="userVideoQuotaUsedDaily" aria-valuemin="0" [attr.aria-valuemax]="user.videoQuotaDaily"></div>
|
[attr.aria-valuenow]="userVideoQuotaUsedDaily" aria-valuemin="0" [attr.aria-valuemax]="user.videoQuotaDaily"></div>
|
||||||
<span>{{ userVideoQuotaUsedDaily | bytes: 1 }}</span>
|
<span>{{ userVideoQuotaUsedDaily | bytes: 1 }}</span>
|
||||||
<span>{{ userVideoQuotaDaily }}</span>
|
<span>{{ userVideoQuotaDaily }}</span>
|
||||||
|
|
|
@ -37,8 +37,6 @@ body {
|
||||||
--mainBackgroundColor: #{$bg-color};
|
--mainBackgroundColor: #{$bg-color};
|
||||||
--mainForegroundColor: #{$fg-color};
|
--mainForegroundColor: #{$fg-color};
|
||||||
|
|
||||||
--secondaryColor: #{$secondary-color};
|
|
||||||
|
|
||||||
--greyForegroundColor: #{$grey-foreground-color};
|
--greyForegroundColor: #{$grey-foreground-color};
|
||||||
--greyBackgroundColor: #{$grey-background-color};
|
--greyBackgroundColor: #{$grey-background-color};
|
||||||
--greySecondaryBackgroundColor: #{$grey-background-hover-color};
|
--greySecondaryBackgroundColor: #{$grey-background-hover-color};
|
||||||
|
|
|
@ -264,18 +264,6 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-outline-tertiary {
|
|
||||||
color: pvar(--secondaryColor);
|
|
||||||
border-color: pvar(--secondaryColor);
|
|
||||||
|
|
||||||
&:focus-within,
|
|
||||||
&:focus,
|
|
||||||
&:hover {
|
|
||||||
color: pvar(--mainBackgroundColor);
|
|
||||||
background-color: pvar(--secondaryColor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-group.select-button {
|
.btn-group.select-button {
|
||||||
font-weight: $font-semibold;
|
font-weight: $font-semibold;
|
||||||
|
|
||||||
|
|
|
@ -678,10 +678,6 @@
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
transition: width 0.6s ease;
|
transition: width 0.6s ease;
|
||||||
|
|
||||||
&.secondary {
|
|
||||||
background-color: pvar(--secondaryColor);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.red {
|
&.red {
|
||||||
background-color: lighten($color: #c54130, $amount: 10);
|
background-color: lighten($color: #c54130, $amount: 10);
|
||||||
}
|
}
|
||||||
|
|
|
@ -23,8 +23,6 @@ $main-color-lightest: lighten($main-color, 40%);
|
||||||
$main-hover-color: lighten($main-color, 5%);
|
$main-hover-color: lighten($main-color, 5%);
|
||||||
$main-background-hover-color: #e9ecef;
|
$main-background-hover-color: #e9ecef;
|
||||||
|
|
||||||
$secondary-color: hsl(187, 77%, 34%);
|
|
||||||
|
|
||||||
$support-button: inherit;
|
$support-button: inherit;
|
||||||
$support-button-heart: #e83e8c;
|
$support-button-heart: #e83e8c;
|
||||||
|
|
||||||
|
@ -118,8 +116,6 @@ $variables: (
|
||||||
--mainBackgroundColor: var(--mainBackgroundColor),
|
--mainBackgroundColor: var(--mainBackgroundColor),
|
||||||
--mainForegroundColor: var(--mainForegroundColor),
|
--mainForegroundColor: var(--mainForegroundColor),
|
||||||
|
|
||||||
--secondaryColor: var(--secondaryColor),
|
|
||||||
|
|
||||||
--greyForegroundColor: var(--greyForegroundColor),
|
--greyForegroundColor: var(--greyForegroundColor),
|
||||||
--greyBackgroundColor: var(--greyBackgroundColor),
|
--greyBackgroundColor: var(--greyBackgroundColor),
|
||||||
--greySecondaryBackgroundColor: var(--greySecondaryBackgroundColor),
|
--greySecondaryBackgroundColor: var(--greySecondaryBackgroundColor),
|
||||||
|
|
Loading…
Reference in New Issue