bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2026-02-19 19:04:01 +00:00
Code Issues Releases Wiki Activity

[CL-1022] Update Berry Styles (#18799)

Browse Source 
* created 'berry' component

* added 'bit-berry' to 'popup-tab-navigation'

* simplified - removed null checks

* changed 'effectiveSize' to 'computedSize'

* fixed 'accentPrimary' color

* updated to not render berry if 'count' is 0 or negative number

* simplified checking count undefined

* updated computed padding

* switched from `[ngClass]` to `[class]`

* updated 'popup-tab-navigation' berry to use 'danger' variant

* fixed berry positioning in popup-tab-navigation

* updated content logic

* cleanup unused 'ngClass'

* updated conditional rendering of berry

* updated story 'Usage'

* updates with adding berry 'type'

* added type "status" to popup-tab-navigation

* fixed type error

* updated 'Count Behavior' description
This commit is contained in:
Leslie Xiong
2026-02-11 12:21:33 -05:00
committed by jaasen-livefront
parent 9c0365f6d1
commit 03875dcf05
9 changed files with 305 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/browser/src/platform/popup/layout/popup-tab-navigation.component.html
View File

@@ -27,8 +27,8 @@
{{ button.label | i18n }}
</span>
</button>
<div *ngIf="button.showBerry" class="tw-absolute tw-top-1.5 tw-left-[calc(50%+5px)]">
<div class="tw-bg-notification-600 tw-size-2.5 tw-rounded-full"></div>
<div *ngIf="button.showBerry" class="tw-absolute tw-top-0 tw-left-[calc(50%+5px)]">
<bit-berry type="status" variant="danger"></bit-berry>
</div>
</li>
</ul>

4
apps/browser/src/platform/popup/layout/popup-tab-navigation.component.ts
View File

@@ -5,7 +5,7 @@ import { RouterModule } from "@angular/router";
import { JslibModule } from "@bitwarden/angular/jslib.module";
import { BitSvg } from "@bitwarden/assets/svg";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
import { SvgModule, LinkModule } from "@bitwarden/components";
import { SvgModule, LinkModule, BerryComponent } from "@bitwarden/components";
export type NavButton = {
label: string;
@@ -20,7 +20,7 @@ export type NavButton = {
@Component({
selector: "popup-tab-navigation",
templateUrl: "popup-tab-navigation.component.html",
imports: [CommonModule, LinkModule, RouterModule, JslibModule, SvgModule],
imports: [CommonModule, LinkModule, RouterModule, JslibModule, SvgModule, BerryComponent],
host: {
class: "tw-block tw-size-full tw-flex tw-flex-col",
},