• Use new license checker and bump major version #79

• You can use dom-repeat and dom-if inside the vaadin-board-row #60.
• Adding support to have a template inside board #61.
• Add elements definition to Vaadin namespace. Now you can access Board and BoardRow classes #62:

    window.Vaadin.BoardElement
    window.Vaadin.BoardRowElement

Fixes:

• You can use dom-repeat and dom-if inside the vaadin-board-row #60.
• Adding support to have a template inside board #61.
• Add elements definition to Vaadin namespace. Now you can access Board and BoardRow classes #62:

    window.Vaadin.BoardElement
    window.Vaadin.BoardRowElement

All dependencies changed to ^2.0.0

Overview

The vaadin-board is a Polymer element for creating flexible responsive layouts and building nice looking dashboards. The vaadin-board key feature is how it effectively reorders the widgets on different screen sizes, maximizing the use of space and looking stunning. Vaadin Board is using Polymer 2.

Features

• Four and three columns based layout for laying out things the way you like it.
• Responsive design, works on all screen sizes, it rearranges child elements based on available space.
• Element responsiveness. Not only is the component itself responsive, but each row reacts individually to the space given to it in a responsive way.
• Allows to divide you layout into regions by using vaadin-board-row.
• board-cols attribute makes one widget flow over multiple slots. This way you can build row configurations where for example you have one widget that takes 75% of the space and another that takes 25%, 25-50-25 or 33-67.
• Supports nested regions. You can put a new row within another row to build how ever complex layouts that you want in a simple way.

Changes since v1.0.0-beta1

• 281066c Remove Polymer.dom.flush() from vaadin-board-row resize behavior.

Resources

Product Page ↗
Getting Started ↗
Documentation ↗
Live Demo ↗

Known Issues

• Because Vaadin Board uses flexbox, there is a limited support for IE11.
  If you want to have a border for the direct child of the vaadin-board-row you need to create a wrapper
  div and add a border there, but not to the direct child of the vaadin-board-row.
  The description of the bug can be found here.

Overview

The vaadin-board is a Polymer element for creating flexible responsive layouts and building nice looking dashboards. The vaadin-board key feature is how it effectively reorders the widgets on different screen sizes, maximizing the use of space and looking stunning. Vaadin Board is using Polymer 2.

Features

• Four and three columns based layout for laying out things the way you like it.
• Responsive design, works on all screen sizes, it rearranges child elements based on available space.
• Element responsiveness. Not only is the component itself responsive, but each row reacts individually to the space given to it in a responsive way.
• Allows to divide you layout into regions by using vaadin-board-row.
• board-cols attribute makes one widget flow over multiple slots. This way you can build row configurations where for example you have one widget that takes 75% of the space and another that takes 25%, 25-50-25 or 33-67.
• Supports nested regions. You can put a new row within another row to build how ever complex layouts that you want in a simple way.

Resources

Product Page ↗
Getting Started ↗
Documentation ↗
Live Demo ↗

Known Issues

• Because Vaadin Board uses flexbox, there is a limited support for IE11.
  If you want to have a border for the direct child of the vaadin-board-row you need to create a wrapper
  div and add a border there, but not to the direct child of the vaadin-board-row.
  The description of the bug can be found here.

vaadin-board is a Polymer element for creating flexible responsive layouts and building nice looking dashboards.