vaultwarden
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

[SM-71] Update all badges to use component library (#2999)

This commit is contained in:
Oscar Hinton 2022-07-04 11:00:13 +02:00 committed by GitHub
parent 6bcde3a84c
commit c1ace45915
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 74 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
apps/web/src/app/modules/organizations/manage/entity-users.component.html
View File

@ -64,9 +64,7 @@
(click)="filterSelected(true)" (click)="filterSelected(true)"
> >
{{ "selected" | i18n }} {{ "selected" | i18n }}
<span class="badge badge-pill badge-info" *ngIf="selectedCount">{{ <span bitBadge badgeType="info" *ngIf="selectedCount">{{ selectedCount }}</span>
selectedCount
}}</span>
</button> </button>
</div> </div>
</div> </div>
@ -115,12 +113,14 @@
<td> <td>
{{ u.email }} {{ u.email }}
<span <span
class="badge badge-secondary" bitBadge
badgeType="secondary"
*ngIf="u.status === organizationUserStatusType.Invited" *ngIf="u.status === organizationUserStatusType.Invited"
>{{ "invited" | i18n }}</span >{{ "invited" | i18n }}</span
> >
<span <span
class="badge badge-warning" bitBadge
badgeType="warning"
*ngIf="u.status === organizationUserStatusType.Accepted" *ngIf="u.status === organizationUserStatusType.Accepted"
>{{ "accepted" | i18n }}</span >{{ "accepted" | i18n }}</span
> >

18
apps/web/src/app/organizations/manage/people.component.html
View File

@ -9,7 +9,7 @@
(click)="filter(null)" (click)="filter(null)"
> >
{{ "all" | i18n }} {{ "all" | i18n }}
<span class="badge badge-pill badge-info" *ngIf="allCount">{{ allCount }}</span> <span bitBadge badgeType="info" *ngIf="allCount">{{ allCount }}</span>
</button> </button>
<button <button
type="button" type="button"
@ -18,7 +18,7 @@
(click)="filter(userStatusType.Invited)" (click)="filter(userStatusType.Invited)"
> >
{{ "invited" | i18n }} {{ "invited" | i18n }}
<span class="badge badge-pill badge-info" *ngIf="invitedCount">{{ invitedCount }}</span> <span bitBadge badgeType="info" *ngIf="invitedCount">{{ invitedCount }}</span>
</button> </button>
<button <button
type="button" type="button"
@ -27,9 +27,7 @@
(click)="filter(userStatusType.Accepted)" (click)="filter(userStatusType.Accepted)"
> >
{{ "accepted" | i18n }} {{ "accepted" | i18n }}
<span class="badge badge-pill badge-warning" *ngIf="acceptedCount">{{ <span bitBadge badgeType="warning" *ngIf="acceptedCount">{{ acceptedCount }}</span>
acceptedCount
}}</span>
</button> </button>
<button <button
type="button" type="button"
@ -38,9 +36,7 @@
(click)="filter(userStatusType.Deactivated)" (click)="filter(userStatusType.Deactivated)"
> >
{{ "deactivated" | i18n }} {{ "deactivated" | i18n }}
<span class="badge badge-pill badge-info" *ngIf="deactivatedCount">{{ <span bitBadge badgeType="info" *ngIf="deactivatedCount">{{ deactivatedCount }}</span>
deactivatedCount
}}</span>
</button> </button>
</div> </div>
<div class="ml-3"> <div class="ml-3">
@ -156,13 +152,13 @@
</td> </td>
<td> <td>
<a href="#" appStopClick (click)="edit(u)">{{ u.email }}</a> <a href="#" appStopClick (click)="edit(u)">{{ u.email }}</a>
<span class="badge badge-secondary" *ngIf="u.status === userStatusType.Invited">{{ <span bitBadge badgeType="secondary" *ngIf="u.status === userStatusType.Invited">{{
"invited" | i18n "invited" | i18n
}}</span> }}</span>
<span class="badge badge-warning" *ngIf="u.status === userStatusType.Accepted">{{ <span bitBadge badgeType="warning" *ngIf="u.status === userStatusType.Accepted">{{
"accepted" | i18n "accepted" | i18n
}}</span> }}</span>
<span class="badge badge-secondary" *ngIf="u.status === userStatusType.Deactivated">{{ <span bitBadge badgeType="secondary" *ngIf="u.status === userStatusType.Deactivated">{{
"deactivated" | i18n "deactivated" | i18n
}}</span> }}</span>
<small class="text-muted d-block" *ngIf="u.name">{{ u.name }}</small> <small class="text-muted d-block" *ngIf="u.name">{{ u.name }}</small>

2
apps/web/src/app/organizations/manage/policies.component.html
View File

@ -14,7 +14,7 @@
<tr *ngFor="let p of policies"> <tr *ngFor="let p of policies">
<td *ngIf="p.display(organization)"> <td *ngIf="p.display(organization)">
<a href="#" appStopClick (click)="edit(p)">{{ p.name | i18n }}</a> <a href="#" appStopClick (click)="edit(p)">{{ p.name | i18n }}</a>
<span class="badge badge-success" *ngIf="policiesEnabledMap.get(p.type)">{{ <span bitBadge badgeType="success" *ngIf="policiesEnabledMap.get(p.type)">{{
"enabled" | i18n "enabled" | i18n
}}</span> }}</span>
<small class="text-muted d-block">{{ p.description | i18n }}</small> <small class="text-muted d-block">{{ p.description | i18n }}</small>

4
apps/web/src/app/organizations/manage/user-add-edit.component.html
View File

@ -11,7 +11,9 @@
<h2 class="modal-title" id="userAddEditTitle"> <h2 class="modal-title" id="userAddEditTitle">
{{ title }} {{ title }}
<small class="text-muted" *ngIf="name">{{ name }}</small> <small class="text-muted" *ngIf="name">{{ name }}</small>
<span class="badge badge-dark" *ngIf="isDeactivated">{{ "deactivated" | i18n }}</span> <span bitBadge badgeType="secondary" *ngIf="isDeactivated">{{
"deactivated" | i18n
}}</span>
</h2> </h2>
<button <button
type="button" type="button"

2
apps/web/src/app/organizations/settings/organization-subscription.component.html
View File

@ -62,7 +62,7 @@
<span class="text-capitalize">{{ <span class="text-capitalize">{{
isSponsoredSubscription ? "sponsored" : subscription.status || "-" isSponsoredSubscription ? "sponsored" : subscription.status || "-"
}}</span> }}</span>
<span class="badge badge-warning" *ngIf="subscriptionMarkedForCancel">{{ <span bitBadge badgeType="warning" *ngIf="subscriptionMarkedForCancel">{{
"pendingCancellation" | i18n "pendingCancellation" | i18n
}}</span> }}</span>
</dd> </dd>

2
apps/web/src/app/organizations/tools/tools.component.html
View File

@ -28,7 +28,7 @@
<a <a
href="#" href="#"
appStopClick appStopClick
class="badge badge-primary" bitBadge
*ngIf="!accessReports" *ngIf="!accessReports"
(click)="upgradeOrganization()" (click)="upgradeOrganization()"
> >

8
apps/web/src/app/oss.module.ts
View File

@ -18,7 +18,13 @@ import { OrganizationBadgeModule } from "./modules/vault/modules/organization-ba
OrganizationManageModule, OrganizationManageModule,
OrganizationUserModule, OrganizationUserModule,
], ],
exports: [LooseComponentsModule, VaultFilterModule, OrganizationBadgeModule, PipesModule], exports: [
SharedModule,
LooseComponentsModule,
VaultFilterModule,
OrganizationBadgeModule,
PipesModule,
],
bootstrap: [], bootstrap: [],
}) })
export class OssModule {} export class OssModule {}

2
apps/web/src/app/reports/exposed-passwords-report.component.html
View File

@ -50,7 +50,7 @@
<small>{{ c.subTitle }}</small> <small>{{ c.subTitle }}</small>
</td> </td>
<td class="text-right"> <td class="text-right">
<span class="badge badge-warning"> <span bitBadge badgeType="warning">
{{ "exposedXTimes" | i18n: (exposedPasswordMap.get(c.id) | number) }} {{ "exposedXTimes" | i18n: (exposedPasswordMap.get(c.id) | number) }}
</span> </span>
</td> </td>

2
apps/web/src/app/reports/inactive-two-factor-report.component.html
View File

@ -61,7 +61,7 @@
</td> </td>
<td class="text-right"> <td class="text-right">
<a <a
class="badge badge-primary" bitBadge
href="{{ cipherDocs.get(c.id) }}" href="{{ cipherDocs.get(c.id) }}"
target="_blank" target="_blank"
rel="noopener" rel="noopener"

2
apps/web/src/app/reports/reused-passwords-report.component.html
View File

@ -65,7 +65,7 @@
<small>{{ c.subTitle }}</small> <small>{{ c.subTitle }}</small>
</td> </td>
<td class="text-right"> <td class="text-right">
<span class="badge badge-warning"> <span bitBadge badgeType="warning">
{{ "reusedXTimes" | i18n: passwordUseMap.get(c.login.password) }} {{ "reusedXTimes" | i18n: passwordUseMap.get(c.login.password) }}
</span> </span>
</td> </td>

2
apps/web/src/app/reports/weak-passwords-report.component.html
View File

@ -65,7 +65,7 @@
<small>{{ c.subTitle }}</small> <small>{{ c.subTitle }}</small>
</td> </td>
<td class="text-right"> <td class="text-right">
<span class="badge badge-{{ passwordStrengthMap.get(c.id)[1] }}"> <span bitBadge [badgeType]="passwordStrengthMap.get(c.id)[1]">
{{ passwordStrengthMap.get(c.id)[0] | i18n }} {{ passwordStrengthMap.get(c.id)[0] | i18n }}
</span> </span>
</td> </td>

56
apps/web/src/app/settings/emergency-access.component.html
View File

@ -46,28 +46,29 @@
<td> <td>
<a href="#" appStopClick (click)="edit(c)">{{ c.email }}</a> <a href="#" appStopClick (click)="edit(c)">{{ c.email }}</a>
<span <span
class="badge badge-secondary" bitBadge
badgeType="secondary"
*ngIf="c.status === emergencyAccessStatusType.Invited" *ngIf="c.status === emergencyAccessStatusType.Invited"
>{{ "invited" | i18n }}</span >{{ "invited" | i18n }}</span
> >
<span class="badge badge-warning" *ngIf="c.status === emergencyAccessStatusType.Accepted">{{
"accepted" | i18n
}}</span>
<span <span
class="badge badge-warning" bitBadge
badgeType="warning"
*ngIf="c.status === emergencyAccessStatusType.Accepted"
>{{ "accepted" | i18n }}</span
>
<span
bitBadge
badgeType="warning"
*ngIf="c.status === emergencyAccessStatusType.RecoveryInitiated" *ngIf="c.status === emergencyAccessStatusType.RecoveryInitiated"
>{{ "emergencyAccessRecoveryInitiated" | i18n }}</span >{{ "emergencyAccessRecoveryInitiated" | i18n }}</span
> >
<span <span bitBadge *ngIf="c.status === emergencyAccessStatusType.RecoveryApproved">{{
class="badge badge-success" "emergencyAccessRecoveryApproved" | i18n
*ngIf="c.status === emergencyAccessStatusType.RecoveryApproved"
>{{ "emergencyAccessRecoveryApproved" | i18n }}</span
>
<span class="badge badge-primary" *ngIf="c.type === emergencyAccessType.View">{{
"view" | i18n
}}</span> }}</span>
<span class="badge badge-primary" *ngIf="c.type === emergencyAccessType.Takeover">{{
<span bitBadge *ngIf="c.type === emergencyAccessType.View">{{ "view" | i18n }}</span>
<span bitBadge *ngIf="c.type === emergencyAccessType.Takeover">{{
"takeover" | i18n "takeover" | i18n
}}</span> }}</span>
@ -159,29 +160,30 @@
</td> </td>
<td> <td>
<span>{{ c.email }}</span> <span>{{ c.email }}</span>
<span <span bitBadge *ngIf="c.status === emergencyAccessStatusType.Invited">{{
class="badge badge-secondary" "invited" | i18n
*ngIf="c.status === emergencyAccessStatusType.Invited"
>{{ "invited" | i18n }}</span
>
<span class="badge badge-warning" *ngIf="c.status === emergencyAccessStatusType.Accepted">{{
"accepted" | i18n
}}</span> }}</span>
<span <span
class="badge badge-warning" bitBadge
badgeType="warning"
*ngIf="c.status === emergencyAccessStatusType.Accepted"
>{{ "accepted" | i18n }}</span
>
<span
bitBadge
badgeType="warning"
*ngIf="c.status === emergencyAccessStatusType.RecoveryInitiated" *ngIf="c.status === emergencyAccessStatusType.RecoveryInitiated"
>{{ "emergencyAccessRecoveryInitiated" | i18n }}</span >{{ "emergencyAccessRecoveryInitiated" | i18n }}</span
> >
<span <span
class="badge badge-success" bitBadge
badgeType="success"
*ngIf="c.status === emergencyAccessStatusType.RecoveryApproved" *ngIf="c.status === emergencyAccessStatusType.RecoveryApproved"
>{{ "emergencyAccessRecoveryApproved" | i18n }}</span >{{ "emergencyAccessRecoveryApproved" | i18n }}</span
> >
<span class="badge badge-primary" *ngIf="c.type === emergencyAccessType.View">{{ <span bitBadge *ngIf="c.type === emergencyAccessType.View">{{ "view" | i18n }}</span>
"view" | i18n <span bitBadge *ngIf="c.type === emergencyAccessType.Takeover">{{
}}</span>
<span class="badge badge-primary" *ngIf="c.type === emergencyAccessType.Takeover">{{
"takeover" | i18n "takeover" | i18n
}}</span> }}</span>

4
apps/web/src/app/vault/add-edit.component.html
View File

@ -194,7 +194,9 @@
<a <a
href="#" href="#"
appStopClick appStopClick
class="badge badge-primary ml-3" bitBadge
badgeType="primary"
class="tw-ml-4"
(click)="upgradeOrganization()" (click)="upgradeOrganization()"
*ngIf=" *ngIf="
(organization && !organization.useTotp) || (organization && !organization.useTotp) ||

49
apps/web/src/scss/buttons.scss
View File

@ -202,52 +202,3 @@ button.no-btn {
color: inherit; color: inherit;
} }
} }
.badge-primary {
@include themify($themes) {
background-color: themed("badgePrimaryBackground");
color: themed("badgePrimaryText");
}
&:hover {
@include themify($themes) {
background-color: themed("badgePrimaryBackgroundHover");
color: themed("badgePrimaryText");
}
}
}
.badge-secondary {
@include themify($themes) {
background-color: themed("badgeSecondaryBackground");
color: themed("badgeSecondaryText");
}
}
.badge-info {
@include themify($themes) {
background-color: themed("badgeInfoBackground");
color: themed("badgeInfoText");
}
}
.badge-danger {
@include themify($themes) {
background-color: themed("badgeDangerBackground");
color: themed("badgeDangerText");
}
}
.badge-warning {
@include themify($themes) {
background-color: themed("warning");
color: themed("textWarningColor");
}
}
.badge-success {
@include themify($themes) {
background-color: themed("success");
color: themed("textSuccessColor");
}
}

17
apps/web/src/scss/styles.scss
View File

@ -21,25 +21,24 @@
@import "~bootstrap/scss/_dropdown"; @import "~bootstrap/scss/_dropdown";
@import "~bootstrap/scss/_button-group"; @import "~bootstrap/scss/_button-group";
@import "~bootstrap/scss/_input-group"; @import "~bootstrap/scss/_input-group";
@import "~bootstrap/scss/_custom-forms"; // @import "~bootstrap/scss/_custom-forms";
@import "~bootstrap/scss/_nav"; @import "~bootstrap/scss/_nav";
@import "~bootstrap/scss/_navbar"; @import "~bootstrap/scss/_navbar";
@import "~bootstrap/scss/_card"; @import "~bootstrap/scss/_card";
@import "~bootstrap/scss/_breadcrumb"; // @import "~bootstrap/scss/_breadcrumb";
@import "~bootstrap/scss/_pagination"; // @import "~bootstrap/scss/_pagination";
@import "~bootstrap/scss/_badge"; // @import "~bootstrap/scss/_jumbotron";
@import "~bootstrap/scss/_jumbotron"; // @import "~bootstrap/scss/_alert";
@import "~bootstrap/scss/_alert";
@import "~bootstrap/scss/_progress"; @import "~bootstrap/scss/_progress";
@import "~bootstrap/scss/_media"; // @import "~bootstrap/scss/_media";
@import "~bootstrap/scss/_list-group"; @import "~bootstrap/scss/_list-group";
@import "~bootstrap/scss/_close"; @import "~bootstrap/scss/_close";
//@import "~bootstrap/scss/_toasts"; //@import "~bootstrap/scss/_toasts";
@import "~bootstrap/scss/_modal"; @import "~bootstrap/scss/_modal";
@import "~bootstrap/scss/_tooltip"; @import "~bootstrap/scss/_tooltip";
@import "~bootstrap/scss/_popover"; @import "~bootstrap/scss/_popover";
@import "~bootstrap/scss/_carousel"; // @import "~bootstrap/scss/_carousel";
@import "~bootstrap/scss/_spinners"; // @import "~bootstrap/scss/_spinners";
@import "~bootstrap/scss/_utilities"; @import "~bootstrap/scss/_utilities";
@import "~bootstrap/scss/_print"; @import "~bootstrap/scss/_print";

12
bitwarden_license/bit-web/src/app/providers/manage/people.component.html
View File

@ -9,7 +9,7 @@
(click)="filter(null)" (click)="filter(null)"
> >
{{ "all" | i18n }} {{ "all" | i18n }}
<span class="badge badge-pill badge-info" *ngIf="allCount">{{ allCount }}</span> <span bitBadge badgeType="info" *ngIf="allCount">{{ allCount }}</span>
</button> </button>
<button <button
type="button" type="button"
@ -18,7 +18,7 @@
(click)="filter(userStatusType.Invited)" (click)="filter(userStatusType.Invited)"
> >
{{ "invited" | i18n }} {{ "invited" | i18n }}
<span class="badge badge-pill badge-info" *ngIf="invitedCount">{{ invitedCount }}</span> <span bitBadge badgeType="info" *ngIf="invitedCount">{{ invitedCount }}</span>
</button> </button>
<button <button
type="button" type="button"
@ -27,9 +27,7 @@
(click)="filter(userStatusType.Accepted)" (click)="filter(userStatusType.Accepted)"
> >
{{ "accepted" | i18n }} {{ "accepted" | i18n }}
<span class="badge badge-pill badge-warning" *ngIf="acceptedCount">{{ <span bitBadge badgeType="warning" *ngIf="acceptedCount">{{ acceptedCount }}</span>
acceptedCount
}}</span>
</button> </button>
</div> </div>
<div class="ml-3"> <div class="ml-3">
@ -137,10 +135,10 @@
</td> </td>
<td> <td>
<a href="#" appStopClick (click)="edit(u)">{{ u.email }}</a> <a href="#" appStopClick (click)="edit(u)">{{ u.email }}</a>
<span class="badge badge-secondary" *ngIf="u.status === userStatusType.Invited">{{ <span bitBadge badgeType="secondary" *ngIf="u.status === userStatusType.Invited">{{
"invited" | i18n "invited" | i18n
}}</span> }}</span>
<span class="badge badge-warning" *ngIf="u.status === userStatusType.Accepted">{{ <span bitBadge badgeType="warning" *ngIf="u.status === userStatusType.Accepted">{{
"accepted" | i18n "accepted" | i18n
}}</span> }}</span>
<small class="text-muted d-block" *ngIf="u.name">{{ u.name }}</small> <small class="text-muted d-block" *ngIf="u.name">{{ u.name }}</small>