bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-06 00:13:28 +00:00
Code Issues Releases Wiki Activity

[CL-925] add filled danger button (#17633)

Browse Source 
* add dangerPrimary button variant

* add dangerPrimary to small story
This commit is contained in:
Bryan Cunningham
2025-11-24 13:08:25 -05:00
committed by GitHub
parent 4c36a46ef2
commit 613e0c5461
3 changed files with 17 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
libs/components/src/button/button.component.ts
View File

@@ -54,6 +54,14 @@ const buttonStyles: Record<ButtonType, string[]> = {
"hover:!tw-text-contrast",
...focusRing,
],
dangerPrimary: [
"tw-border-danger-600",
"tw-bg-danger-600",
"!tw-text-contrast",
"hover:tw-bg-danger-700",
"hover:tw-border-danger-700",
...focusRing,
],
unstyled: [],
};

8
libs/components/src/button/button.stories.ts
View File

@@ -62,6 +62,13 @@ export const Primary: Story = {
},
};
export const DangerPrimary: Story = {
...Default,
args: {
buttonType: "dangerPrimary",
},
};
export const Danger: Story = {
...Default,
args: {
@@ -77,6 +84,7 @@ export const Small: Story = {
<button type="button" bitButton [disabled]="disabled" [loading]="loading" [buttonType]="'primary'" [size]="size" [block]="block">Primary small</button>
<button type="button" bitButton [disabled]="disabled" [loading]="loading" [buttonType]="'secondary'" [size]="size" [block]="block">Secondary small</button>
<button type="button" bitButton [disabled]="disabled" [loading]="loading" [buttonType]="'danger'" [size]="size" [block]="block">Danger small</button>
<button type="button" bitButton [disabled]="disabled" [loading]="loading" [buttonType]="'dangerPrimary'" [size]="size" [block]="block">Danger Primary small</button>
</div>
`,
}),

2
libs/components/src/shared/button-like.abstraction.ts
View File

@@ -1,6 +1,6 @@
import { ModelSignal } from "@angular/core";
export type ButtonType = "primary" | "secondary" | "danger" | "unstyled";
export type ButtonType = "primary" | "secondary" | "danger" | "dangerPrimary" | "unstyled";
export type ButtonSize = "default" | "small";