Highlight block

A highlight block is a container to let certain content standout on a page.

API

API reference for Blue Web Highlight Block Component

import { BwcHighlightBlockComponent } from '@aviato/components/highlight-block';

Directives

BwcHighlightBlock

Represents a custom html element that creates a highlighted block of content with different background colors.
selector:bwc-highlight-block

Properties

Name

Description

@Input()

type

(Optional)

An optional @input which defines your background color of highlight block

Examples

Type

Background color

null ( when type is not defined )

default color blue

VariantYellow

Yellow

VariantRed

Red

VariantGreen

Green

 


Examples

Highlight block with text

Storybook failed to load. Please connect to the VPN to access.

 

Highlight block with image

Storybook failed to load. Please connect to the VPN to access.