# Educal Banner Area Block

A volto block for banner area in educal theme.

## Customizable properties

<details>
  <summary>Click to expand!</summary>

1. `tag` (_string_): Tag for the banner.
1. `headingLine1` (_string_): Heading line number one.
1. `headingLine2` (_string_): Heading line number two.
1. `showActionButton` (_boolean_): Toggle the button.
1. `actionButtonText` (_string_): Button label.
1. `actionButtonUrl` (_string_): URL which is navigated onClick of button.
1. `foregroundImage` (_image_): The foreground image for the banner. Displayed on the right side.
1. `backgroundImage` (_image_): The background image for the block.

</details>

## Example

### Configuration

```txt
tag: 'New'
headingLine1: 'Online Courses'
headingLine2: 'From Educal'
showActionButton: true
actionButtonText: 'View Courses'
actionButtonUrl: '/'
foregroundImage: '/banner-img-2.png'
backgroundImage: '/banner-bg-2.jpg'
```

### Output

<img src="/assets/github/banner_area_preview.png" width="50%">