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

[CL-712] Update icon button, components using it, and affected virtual scroll heights (#15683)

Browse Source
This commit is contained in:
Vicki League
2025-08-05 10:58:49 -04:00
committed by GitHub
parent 40a1a0a2b7
commit 26c0176e2e
34 changed files with 90 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
libs/components/src/item/item-action.component.ts
View File

@@ -10,7 +10,7 @@ import { Component } from "@angular/core";
* `top` and `bottom` units should be kept in sync with `item-content.component.ts`'s y-axis padding.
* we want this `:after` element to be the same height as the `item-content`
*/
"[&>button]:tw-relative [&>button:not([bit-item-content])]:after:tw-content-[''] [&>button]:after:tw-absolute [&>button]:after:tw-block bit-compact:[&>button]:after:tw-top-[-0.7rem] bit-compact:[&>button]:after:tw-bottom-[-0.7rem] [&>button]:after:tw-top-[-0.8rem] [&>button]:after:tw-bottom-[-0.80rem] [&>button]:after:tw-right-[-0.25rem] [&>button]:after:tw-left-[-0.25rem]",
"[&>button]:tw-relative [&>button:not([bit-item-content])]:after:tw-content-[''] [&>button]:after:tw-absolute [&>button]:after:tw-block bit-compact:[&>button]:after:tw-top-[-0.7rem] bit-compact:[&>button]:after:tw-bottom-[-0.7rem] [&>button]:after:tw-top-[-0.8rem] [&>button]:after:tw-bottom-[-0.80rem] [&>button]:after:tw-right-0 [&>button]:after:tw-left-0",
},
})
export class ItemActionComponent {}

2
libs/components/src/item/item.component.html
View File

@@ -4,7 +4,7 @@
<div
#endSlot
class="tw-p-2 tw-flex tw-gap-1 tw-items-center"
class="tw-px-2 tw-flex tw-items-center tw-gap-2 [&_button[biticonbutton]]:-tw-mx-1"
[hidden]="endSlot.childElementCount === 0"
>
<ng-content select="[slot=end]"></ng-content>

2
libs/components/src/item/item.stories.ts
View File

@@ -397,7 +397,7 @@ export const VirtualScrolling: Story = {
data: Array.from(Array(100000).keys()),
},
template: /*html*/ `
<cdk-virtual-scroll-viewport [itemSize]="59" class="tw-h-[500px]">
<cdk-virtual-scroll-viewport [itemSize]="54" class="tw-h-[500px]">
<bit-item-group aria-label="Virtual Scrolling">
<bit-item *cdkVirtualFor="let item of data">
<button bit-item-content>