Add right-to-left layout option

This commit is contained in:
Thomas Lovén 2019-03-03 17:15:06 +01:00
parent b012ea66cc
commit 70a1986b64
2 changed files with 9 additions and 0 deletions

View File

@ -164,6 +164,7 @@ cards:
column_width: <column width> column_width: <column width>
max_width: <max column width> max_width: <max column width>
min_height: <min height> min_height: <min height>
ltr: <ltr>
cards: cards:
<cards> <cards>
``` ```
@ -209,6 +210,11 @@ Optional. Default: 5
The number of units needed before a column is considered not empty. The number of units needed before a column is considered not empty.
### `<rtl>`
Optional. Default: false
If set to true, columns will be placed right-to-left.
### `<cards>` ### `<cards>`
Required. Required.

View File

@ -10,6 +10,7 @@ class LayoutCard extends cardTools.LitElement {
this.colWidth = config.column_width || 300; this.colWidth = config.column_width || 300;
this.maxWidth = config.max_width || 500; this.maxWidth = config.max_width || 500;
this.minHeight = config.min_height || 5; this.minHeight = config.min_height || 5;
this.rtl = config.rtl || false;
this.cardSize = 1; this.cardSize = 1;
window.addEventListener('resize', () => this.build()); window.addEventListener('resize', () => this.build());
@ -28,6 +29,8 @@ class LayoutCard extends cardTools.LitElement {
{ {
this.style.padding = "0"; this.style.padding = "0";
} }
if(this.rtl)
this.shadowRoot.querySelector("#columns").style.flexDirection = 'row-reverse';
this.build(); this.build();
this._cardModder = { this._cardModder = {
target: this, target: this,