1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-23 11:43:46 +00:00

[CL-847] Card consolidation (#16952)

* created shared card directive

* WIP

* use base card in anon layout

* use bit-card for pricing card component

* add base card to integration cards

* add base card to reports cards

* add base card to integration card

* use card content on report card

* use base card directive on base component

* update dirt card to use bit-card

* run prettier. fix whitespace

* add missing imports to report list stories

* add base card story and docs
This commit is contained in:
Bryan Cunningham
2025-10-27 11:14:42 -04:00
committed by GitHub
parent af6e19335d
commit f452f39f3c
21 changed files with 184 additions and 57 deletions

View File

@@ -1,5 +1,5 @@
<div
class="tw-block tw-h-full tw-overflow-hidden tw-rounded tw-border tw-border-solid tw-border-secondary-600 tw-relative tw-transition-all hover:tw-scale-105 focus-within:tw-outline-none focus-within:tw-ring focus-within:tw-ring-primary-700 focus-within:tw-ring-offset-2"
<bit-base-card
class="tw-block tw-h-full tw-overflow-hidden tw-relative tw-transition-all hover:tw-scale-105 focus-within:tw-outline-none focus-within:tw-ring focus-within:tw-ring-primary-700 focus-within:tw-ring-offset-2"
>
<div class="tw-flex tw-bg-secondary-100 tw-items-center tw-justify-end tw-pt-4 tw-pr-4">
<i class="bwi bwi-external-link"></i>
@@ -27,8 +27,8 @@
</a>
}
</div>
<div class="tw-p-5">
<h3 class="tw-text-main tw-text-lg tw-font-semibold">
<bit-card-content>
<h3 class="tw-text-main tw-m-0 tw-text-lg tw-font-semibold">
{{ name }}
@if (showConnectedBadge()) {
<span class="tw-ml-3">
@@ -41,8 +41,9 @@
</span>
}
</h3>
<p class="tw-mb-0 tw-font-semibold">{{ description }}</p>
@if (description) {
<p class="tw-mb-0 tw-mt-2 tw-font-semibold">{{ description }}</p>
}
@if (canSetupConnection) {
<button type="button" class="tw-mt-3" bitButton (click)="setupConnection()">
@if (isUpdateAvailable) {
@@ -58,5 +59,5 @@
{{ "new" | i18n }}
</span>
}
</div>
</div>
</bit-card-content>
</bit-base-card>

View File

@@ -20,7 +20,13 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
import { ThemeType } from "@bitwarden/common/platform/enums";
import { ThemeStateService } from "@bitwarden/common/platform/theming/theme-state.service";
import { OrganizationId } from "@bitwarden/common/types/guid";
import { DialogRef, DialogService, ToastService } from "@bitwarden/components";
import {
BaseCardComponent,
CardContentComponent,
DialogRef,
DialogService,
ToastService,
} from "@bitwarden/components";
import { SharedModule } from "@bitwarden/web-vault/app/shared";
import {
@@ -37,7 +43,7 @@ import {
@Component({
selector: "app-integration-card",
templateUrl: "./integration-card.component.html",
imports: [SharedModule],
imports: [SharedModule, BaseCardComponent, CardContentComponent],
})
export class IntegrationCardComponent implements AfterViewInit, OnDestroy {
private destroyed$: Subject<void> = new Subject();