Info drawer layout component

Displays a sidebar-style information panel.

Basic usage

Transclusions

There are three regions where you can add your own content using <div> elements with the following names:

• info-drawer-title
• info-drawer-buttons
• info-drawer-content

<adf-info-drawer-layout [showHeader]="true">
    <div info-drawer-title>File info</div>

    <div info-drawer-buttons>
        <mat-icon>clear</mat-icon>
    </div>

    <div info-drawer-content>
        <mat-card>
            Lorem ipsum dolor sit amet...
        </mat-card>
    </div>
</adf-info-drawer-layout>

Class members

Properties

Details

As the name suggests, this is basically just a layout with CSS styling.

See the Info drawer tab component for an alternative approach that uses tabs to structure the content of the info drawer.

See also

• Info drawer component
• Info drawer tab component