Add horizontal version

Close #39
ofekashery · Mar 23, 2020 · 50bb429 · 50bb429
1 parent 150f290
commit 50bb429
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -12,6 +12,7 @@ Vertical Stack In Card allows you to group multiple cards in one card.
 | type | string | **Required** | `custom:vertical-stack-in-card`
 | cards | list | **Required** | List of cards
 | title | string | **Optional** | Card title
+| horizontal | boolean | **Optional** | Default: ``false``
 
 ## Installation
 
@@ -27,7 +28,7 @@ mv vertical-stack-in-card.js /config/www/
 
 ```yaml
 resources:
-  - url: /local/vertical-stack-in-card.js?v=0.3.0
+  - url: /local/vertical-stack-in-card.js?v=0.3.1
     type: js
 ```
 

diff --git a/VERSION b/VERSION
@@ -1 +1 @@
-0.3.0
+0.3.1
diff --git a/changelog.md b/changelog.md
@@ -1,3 +1,6 @@
+## 0.3.1
+- Add horizontal version
+
 ## 0.3.0
 - Fix [#75](https://github.com/ofekashery/vertical-stack-in-card/issues/75), [#78](https://github.com/ofekashery/vertical-stack-in-card/issues/78).
 

diff --git a/vertical-stack-in-card.js b/vertical-stack-in-card.js
@@ -34,6 +34,13 @@ class VerticalStackInCard extends HTMLElement {
             const cardContent = document.createElement('div');
             card.header = config.title;
             cards.forEach(card => cardContent.appendChild(card));
+            if (config.horizontal) {
+                cardContent.style.display = 'flex';
+                cardContent.childNodes.forEach(card => {
+                    card.style.flex = '1 1 0';
+                    card.style.minWidth = 0;
+                });
+            }
             card.appendChild(cardContent);
 
             while (this.hasChildNodes()) {