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

[PM-17717] Improve extension section header hover state (#13192)

Browse Source
This commit is contained in:
Vicki League
2025-02-04 11:14:35 -05:00
committed by GitHub
parent aeb4e21f69
commit 4be290837a
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
apps/browser/src/vault/popup/components/vault-v2/vault-list-items-container/vault-list-items-container.component.html
View File

@@ -1,9 +1,10 @@
<bit-section *ngIf="ciphers?.length > 0 || description" [disableMargin]="disableSectionMargin"> <bit-section *ngIf="ciphers?.length > 0 || description" [disableMargin]="disableSectionMargin">
<ng-container *ngIf="collapsibleKey"> <ng-container *ngIf="collapsibleKey">
<button <button
class="tw-group/vault-section-header hover:tw-bg-secondary-100 tw-pl-1 tw-w-full tw-border-x-0 tw-border-t-0 tw-border-b tw-border-solid focus-visible:tw-outline-none focus-visible:tw-rounded-md focus-visible:tw-ring-inset focus-visible:tw-ring-2 focus-visible:tw-ring-primary-600" class="tw-group/vault-section-header hover:tw-bg-primary-100 tw-rounded-md tw-pl-1 tw-w-full tw-border-x-0 tw-border-t-0 tw-border-b tw-border-solid focus-visible:tw-outline-none focus-visible:tw-ring-inset focus-visible:tw-ring-2 focus-visible:tw-ring-primary-600"
[ngClass]="{ [ngClass]="{
'tw-border-b-secondary-300': !sectionOpenState(), 'tw-border-b-secondary-300 tw-rounded-b-none [&:is(:hover,:focus-visible)]:tw-border-b-transparent [&:is(:hover,:focus-visible)]:tw-rounded-b-md':
!sectionOpenState(),
'tw-border-b-transparent': sectionOpenState(), 'tw-border-b-transparent': sectionOpenState(),
}" }"
type="button" type="button"
@@ -27,7 +28,7 @@
</bit-section> </bit-section>
<ng-template #sectionHeader> <ng-template #sectionHeader>
<bit-section-header class="tw-p-0.5 -tw-mt-0.5 -tw-mx-0.5"> <bit-section-header class="tw-p-0.5 -tw-mx-0.5">
<h2 bitTypography="h6"> <h2 bitTypography="h6">
{{ title }} {{ title }}
</h2> </h2>
@@ -51,7 +52,7 @@
</span> </span>
<span class="tw-pr-1" *ngIf="collapsibleKey"> <span class="tw-pr-1" *ngIf="collapsibleKey">
<i <i
class="bwi" class="bwi tw-text-main"
[ngClass]="{ [ngClass]="{
'bwi-angle-down tw-inline-block': !sectionOpenState(), 'bwi-angle-down tw-inline-block': !sectionOpenState(),
'bwi-angle-up tw-hidden group-hover/vault-section-header:tw-inline-block group-focus-visible/vault-section-header:tw-inline-block': 'bwi-angle-up tw-hidden group-hover/vault-section-header:tw-inline-block group-focus-visible/vault-section-header:tw-inline-block':