1.2.1

* Fixed alignment of title when icon and title are positioned outside of the bar.
custom-cards · May 21, 2019 · 1df034a · 1df034a
1 parent dd24696
commit 1df034a
Showing 1 changed file with 14 additions and 5 deletions.
diff --git a/bar-card.js b/bar-card.js
@@ -298,12 +298,14 @@ class BarCard extends HTMLElement {
     switch (config.icon_position) {
       case 'left':
         titleWidth = 'width: calc(100% - ' + config.width + ');'
-        titleAlign = 'justify-content: center;'
+        if (config.title_position == 'off' || config.title_position == 'inside') titleAlign = 'justify-content: center;'
+        else titleAlign = 'justify-content: flex-start;'
         titleflexDirection = 'flex-direction: row;'
         break
       case 'right':
         titleWidth = 'width: calc(100% - ' + config.width + ');'
-        titleAlign = 'justify-content: center;'
+        if (config.title_position == 'off' || config.title_position == 'inside') titleAlign = 'justify-content: center;'
+        else titleAlign = 'justify-content: flex-start;'
         titleflexDirection = 'flex-direction: row-reverse;'
         break
       case 'top':
@@ -386,6 +388,12 @@ class BarCard extends HTMLElement {
       overflow: hidden;
       `      
     }
+    let iconMarginStyle = ''
+    if (config.icon_position !== 'inside' && config.title_position !== 'off' && config.title_position !== 'inside') {
+      iconMarginStyle = `
+      margin-left: 8px;
+      `
+    }
 
     let justifyContent
     let alignItems
@@ -415,7 +423,7 @@ class BarCard extends HTMLElement {
         justifyContent = 'space-between'
         alignItems = 'flex-start'
         if (config.icon_position != 'off') textAlign = 'center'
-        if (config.icon_position == 'inside') textAlign = 'left'
+        if (config.icon_position == 'inside') textAlign = 'center'
         else textAlign = 'left'
         break
       case 'bottom':
@@ -429,15 +437,15 @@ class BarCard extends HTMLElement {
         justifyContent = 'space-between'
         alignItems = 'flex-end'
         if (config.icon_position != 'off') textAlign = 'center'
-        if (config.icon_position == 'inside') textAlign = 'left'
+        if (config.icon_position == 'inside') textAlign = 'center'
         else textAlign = 'left'
         break
       case 'split':
         alignItems = 'center'
         flexDirection = 'row'
         justifyContent = 'space-between'
         if (config.icon_position != 'off') textAlign = 'center'
-        if (config.icon_position == 'inside') textAlign = 'left'
+        if (config.icon_position == 'inside') textAlign = 'center'
         else textAlign = 'left'
         break
       case 'left-split':
@@ -542,6 +550,7 @@ class BarCard extends HTMLElement {
         font-weight: bold;
         color: #FFF;
         filter: drop-shadow(1px 1px #0005);
+        ${iconMarginStyle}
         ${iconStyle}
       }
       #title_${id} {