mirror of
https://github.com/bitwarden/browser
synced 2026-02-05 11:13:44 +00:00
* Updated callout styles * Added default callout variant * Refactored component to support icon + content variants (with no header) --------- Co-authored-by: Vicki League <vleague@bitwarden.com> Co-authored-by: Bryan Cunningham <bryan.cunningham@me.com>
27 lines
724 B
HTML
27 lines
724 B
HTML
<aside
|
|
class="tw-mb-4 tw-box-border tw-border tw-border-solid tw-rounded-lg tw-bg-background tw-ps-4 tw-pe-4 tw-py-3 tw-leading-5 tw-flex tw-gap-2"
|
|
[ngClass]="[calloutClass()]"
|
|
[attr.aria-labelledby]="titleId"
|
|
>
|
|
@let title = titleComputed();
|
|
@let icon = iconComputed();
|
|
|
|
@if (icon) {
|
|
<i
|
|
class="bwi tw-relative"
|
|
[ngClass]="[icon, title ? 'tw-top-[3px] tw-self-start' : 'tw-top-[1px]']"
|
|
aria-hidden="true"
|
|
></i>
|
|
}
|
|
<div class="tw-flex tw-flex-col tw-gap-0.5">
|
|
@if (title) {
|
|
<header id="{{ titleId }}" class="tw-text-base tw-font-semibold">
|
|
{{ title }}
|
|
</header>
|
|
}
|
|
<div bitTypography="body2">
|
|
<ng-content></ng-content>
|
|
</div>
|
|
</div>
|
|
</aside>
|