From 79ae4f1377aed39e9bb2c7e01e032c5e60653364 Mon Sep 17 00:00:00 2001
From: finity69x2 <32221243+finity69x2@users.noreply.github.com>
Date: Wed, 24 Mar 2021 14:46:11 -0400
Subject: [PATCH] Update fan-percent-button-row.js

---
 dist/fan-percent-button-row.js | 26 ++++++++++++++++++--------
 1 file changed, 18 insertions(+), 8 deletions(-)

diff --git a/dist/fan-percent-button-row.js b/dist/fan-percent-button-row.js
index fca1792..da125c7 100644
--- a/dist/fan-percent-button-row.js
+++ b/dist/fan-percent-button-row.js
@@ -8,9 +8,6 @@ class CustomFanPercentRow extends Polymer.Element {
 					line-height: inherit;
 				}
 				.percentage {
-					min-width: 30px;
-					max-width: 30px;
-					height: 30px;
 					margin-left: 2px;
 					margin-right: 2px;
 					background-color: #759aaa;
@@ -29,25 +26,25 @@ class CustomFanPercentRow extends Polymer.Element {
 						<div class='horizontal justified layout' on-click="stopPropagation">
 							<button
 								class='percentage'
-								style='[[_leftColor]]'
+								style='[[_leftColor]];min-width:[[_width]];max-width:[[_width]];height:[[_height]]'
 								toggles name="[[_leftName]]"
 								on-click='setPercentage'
 								disabled='[[_leftState]]'>[[_leftText]]</button>
 							<button
 								class='percentage'
-								style='[[_midLeftColor]]'
+								style='[[_midLeftColor]];min-width:[[_width]];max-width:[[_width]];height:[[_height]]'
 								toggles name="[[_midLeftName]]"
 								on-click='setPercentage'
 								disabled='[[_midLeftState]]'>[[_midLeftText]]</button>
 							<button
 								class='percentage'
-								style='[[_midRightColor]]'
+								style='[[_midRightColor]];min-width:[[_width]];max-width:[[_width]];height:[[_height]]'
 								toggles name="[[_midRightName]]"
 								on-click='setPercentage'
 								disabled='[[_midRightState]]'>[[_midRightText]]</button>
 							<button
 								class='percentage'
-								style='[[_rightColor]]'
+								style='[[_rightColor]];min-width:[[_width]];max-width:[[_width]];height:[[_height]]'
 								toggles name="[[_rightName]]"
 								on-click='setPercentage'
 								disabled='[[_rightState]]'>[[_rightText]]</button>
@@ -68,6 +65,8 @@ class CustomFanPercentRow extends Polymer.Element {
 				_lowSP: Number,
 				_medSP: Number,
 				_highSP: Number,
+				_width: String,
+				_height: String,
 				_leftColor: String,
 				_midLeftColor: String,
 				_midRightColor: String,
@@ -99,6 +98,8 @@ class CustomFanPercentRow extends Polymer.Element {
 			lowPercentage: 33,
 			medPercentage: 66,
 			hiPercentage: 100,
+			width: '30px',
+			height: '30px',
 			isOffColor: '#f44c09',
 			isOnLowColor: '#43A047',
 			isOnMedColor: '#43A047',
@@ -119,6 +120,8 @@ class CustomFanPercentRow extends Polymer.Element {
 		const custTheme = config.customTheme;
 		const custSetpoint = config.customSetpoints;
 		const revButtons = config.reverseButtons;
+		const buttonWidth = config.width;
+		const buttonHeight = config.height;
 		const OnLowClr = config.isOnLowColor;
 		const OnMedClr = config.isOnMedColor;
 		const OnHiClr = config.isOnHiColor;
@@ -237,7 +240,10 @@ class CustomFanPercentRow extends Polymer.Element {
 		let offtext = custOffTxt;
 		let lowtext = custLowTxt;
 		let medtext = custMedTxt;
-		let hitext = custHiTxt;	
+		let hitext = custHiTxt;
+		
+		let buttonwidth = buttonWidth;
+		let buttonheight = buttonHeight;
 		
 		let offname = 'off'
 		let lowname = 'low'
@@ -251,6 +257,8 @@ class CustomFanPercentRow extends Polymer.Element {
 				_midLeftState: low === 'on',
 				_midRightState: med === 'on',
 				_rightState: high === 'on',
+				_width: buttonwidth,
+				_height: buttonheight,
 				_leftColor: offcolor,
 				_midLeftColor: lowcolor,
 				_midRightColor: medcolor,
@@ -276,6 +284,8 @@ class CustomFanPercentRow extends Polymer.Element {
 				_midLeftState: med === 'on',
 				_midRightState: low === 'on',
 				_rightState: offstate === 'on',
+				_width: buttonwidth,
+				_height: buttonheight,
 				_leftColor: hicolor,
 				_midLeftColor: medcolor,
 				_midRightColor: lowcolor,