[](https://www.npmjs.com/package/l2t-fab-footer)
[](https://www.webcomponents.org/element/l2t-fab-footer)
]
## <l2t-fab-footer>
`l2t-fab-footer` is a footer toolbar with a cut out for a FAB in the centre.
```html
```
See: [Documentation](https://www.webcomponents.org/element/l2t-fab-footer), [Demo](https://www.webcomponents.org/element/l2t-fab-footer/demo/demo/index.html).
## Usage
### Installation
```
npm install --save link2twenty/l2t-fab-footer
```
### In an html file
```html
```
### In a Polymer 3 element
```js
import {PolymerElement, html} from '@polymer/polymer';
import './l2t-fab-footer/l2t-fab-footer.js';
import '@polymer/iron-icons/iron-icons.html';
class SampleElement extends PolymerElement {
static get template() {
return html`
`;
}
}
customElements.define('sample-element', SampleElement);
```
## Styling
The following custom properties are available for styling:
| Custom property | Description | Default |
|----------------|-------------|-------------|
| --fab-footer-height | The height of the footer element | 42px |
| --fab-footer-background | The color of the footer element's background | --primary-color |
| --fab-footer-color | The color of the footer element's text/icons | --dark-theme-text-color |
## Contributing
If you want to send a PR to this element, here are
the instructions for running the tests and demo locally:
### Installation
```sh
git clone https://github.com/link2twenty/l2t-fab-footer
cd l2t-fab-footer
npm install
npm install -g polymer-cli
```
### Running the demo locally
```sh
polymer serve --npm
open http://localhost:/demo/
```