Updates alarm more-info dialog button styles to match lovelace card (#3955)

* Updates alarm more-info dialog button styles to match lovelace card

* Use flex for controlling button size

* Limit max-width of alarm buttons

This matches the width of the code input field
This commit is contained in:
Josh McCarty 2019-10-15 12:04:29 -07:00 committed by Bram Kragten
parent 49d69f65ad
commit a39e47cced

View File

@ -29,8 +29,9 @@ class MoreInfoAlarmControlPanel extends LocalizeMixin(PolymerElement) {
width: 80px; width: 80px;
} }
.actions mwc-button { .actions mwc-button {
min-width: 160px; flex: 1 0 50%;
margin-bottom: 16px; margin: 0 4px 16px;
max-width: 200px;
} }
mwc-button.disarm { mwc-button.disarm {
color: var(--google-red-500); color: var(--google-red-500);
@ -137,7 +138,7 @@ class MoreInfoAlarmControlPanel extends LocalizeMixin(PolymerElement) {
<div class="layout horizontal center-justified actions"> <div class="layout horizontal center-justified actions">
<template is="dom-if" if="[[_disarmVisible]]"> <template is="dom-if" if="[[_disarmVisible]]">
<mwc-button <mwc-button
raised outlined
class="disarm" class="disarm"
on-click="_callService" on-click="_callService"
data-service="alarm_disarm" data-service="alarm_disarm"
@ -148,7 +149,7 @@ class MoreInfoAlarmControlPanel extends LocalizeMixin(PolymerElement) {
</template> </template>
<template is="dom-if" if="[[_armVisible]]"> <template is="dom-if" if="[[_armVisible]]">
<mwc-button <mwc-button
raised outlined
on-click="_callService" on-click="_callService"
data-service="alarm_arm_home" data-service="alarm_arm_home"
disabled="[[!_codeValid]]" disabled="[[!_codeValid]]"
@ -156,7 +157,7 @@ class MoreInfoAlarmControlPanel extends LocalizeMixin(PolymerElement) {
[[localize('ui.card.alarm_control_panel.arm_home')]] [[localize('ui.card.alarm_control_panel.arm_home')]]
</mwc-button> </mwc-button>
<mwc-button <mwc-button
raised outlined
on-click="_callService" on-click="_callService"
data-service="alarm_arm_away" data-service="alarm_arm_away"
disabled="[[!_codeValid]]" disabled="[[!_codeValid]]"