# box

box is a component which provides a container for content and optionally a title

<div>
    <va-box>
        <box-title>This is a title!</box-title>
        <h3>This is a subtitle in the content</h3>
        This is some content! We can put Angular2 components in here!
    </va-box>
</div>

## Requirements

* Install the component to your project

```bash
npm install @vendasta/fec-box [--save]
```

* Next, you will need to import your box in whatever module you wish to use it in:

```javascript
import { BoxModule } from '@vendasta/fec-box/box.module';
...
@NgModule({
    ...
    imports: [
        BoxModule
    ]
})
```

## Usage
The above will provide the bare minimum to reach compilation. To use the box, we must then include the va-box tag.

```javascript
import {Component} from "@angular/core";

@Component({
    ...
    template: `
        <va-box>
            <box-title>This is a title!</box-title>
            <h3>This is a subtitle in the content</h3>
            This is some content! We can put Angular2 components in here!
            <va-btn va-btn-primary></va-btn>
        </va-box>
    `
})
...
```

You may wish to style the content inside your box, in which case the following scss will target it:

```scss
va-box {
    background-color: aliceblue;
}
```