bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-18 01:03:35 +00:00
Code Issues Releases Wiki Activity

[CL-451] Add option for full width chip select (#11135)

Browse Source
This commit is contained in:
Victoria League
2024-09-20 09:52:12 -04:00
committed by GitHub
parent c13131acd1
commit 1262623fac
3 changed files with 48 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
libs/components/src/chip-select/chip-select.component.html
View File

@@ -1,17 +1,18 @@
<div
bitTypography="body2"
class="tw-inline-flex tw-items-center tw-rounded-full tw-max-w-52 tw-border-solid tw-border tw-border-text-muted"
class="tw-inline-flex tw-items-center tw-rounded-full tw-border-solid tw-border tw-border-text-muted"
[ngClass]="[
selectedOption
? 'tw-bg-text-muted tw-text-contrast tw-gap-1'
: 'tw-bg-transparent tw-text-muted tw-gap-1.5',
focusVisibleWithin() ? 'tw-ring-2 tw-ring-primary-500 tw-ring-offset-1' : '',
fullWidth ? 'tw-w-full' : 'tw-max-w-52',
]"
>
<!-- Primary button -->
<button
type="button"
class="fvw-target tw-inline-flex tw-gap-1.5 tw-items-center tw-bg-transparent hover:tw-bg-transparent tw-border-none tw-outline-none tw-max-w-full tw-py-1 tw-pl-3 last:tw-pr-3 tw-truncate tw-text-[inherit]"
class="fvw-target tw-inline-flex tw-gap-1.5 tw-items-center tw-justify-between tw-bg-transparent hover:tw-bg-transparent tw-border-none tw-outline-none tw-w-full tw-py-1 tw-pl-3 last:tw-pr-3 tw-truncate tw-text-[inherit]"
[ngClass]="{
'tw-cursor-not-allowed': disabled,
}"
@@ -20,8 +21,10 @@
[title]="label"
#menuTrigger="menuTrigger"
>
<i class="bwi !tw-text-[inherit]" [ngClass]="icon"></i>
<span class="tw-truncate">{{ label }}</span>
<span class="tw-inline-flex tw-items-center tw-gap-1.5 tw-truncate">
<i class="bwi !tw-text-[inherit]" [ngClass]="icon"></i>
<span class="tw-truncate">{{ label }}</span>
</span>
<i
*ngIf="!selectedOption"
class="bwi"