jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-30 12:46:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix alignment of switches positioned absolutely (#3812)

Browse Source 
* fix alignment of switches positioned absolutely

* wrap switches

* remove !important
This commit is contained in:
Ian Richardson 2019-09-30 14:27:19 -05:00 committed by Bram Kragten
parent c69585db98
commit 64366dc99a
3 changed files with 22 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/panels/config/cloud/account/cloud-alexa-pref.ts
View File

@ -32,10 +32,12 @@ export class CloudAlexaPref extends LitElement {
return html` return html`
<ha-card header="Alexa"> <ha-card header="Alexa">
<ha-switch <div class="switch">
.checked=${alexa_enabled} <ha-switch
@change=${this._enabledToggleChanged} .checked=${alexa_enabled}
></ha-switch> @change=${this._enabledToggleChanged}
></ha-switch>
</div>
<div class="card-content"> <div class="card-content">
With the Alexa integration for Home Assistant Cloud you'll be able to With the Alexa integration for Home Assistant Cloud you'll be able to
control all your Home Assistant devices via any Alexa-enabled device. control all your Home Assistant devices via any Alexa-enabled device.
@ -133,7 +135,7 @@ export class CloudAlexaPref extends LitElement {
a { a {
color: var(--primary-color); color: var(--primary-color);
} }
ha-card > ha-switch { .switch {
margin: -4px 0; margin: -4px 0;
position: absolute; position: absolute;
right: 8px; right: 8px;

14
src/panels/config/cloud/account/cloud-google-pref.ts
View File

@ -43,11 +43,13 @@ export class CloudGooglePref extends LitElement {
return html` return html`
<ha-card header="Google Assistant"> <ha-card header="Google Assistant">
<ha-switch <div class="switch">
id="google_enabled" <ha-switch
.checked="${google_enabled}" id="google_enabled"
@change="${this._toggleChanged}" .checked="${google_enabled}"
></ha-switch> @change="${this._toggleChanged}"
></ha-switch>
</div>
<div class="card-content"> <div class="card-content">
With the Google Assistant integration for Home Assistant Cloud you'll With the Google Assistant integration for Home Assistant Cloud you'll
be able to control all your Home Assistant devices via any Google be able to control all your Home Assistant devices via any Google
@ -138,7 +140,7 @@ export class CloudGooglePref extends LitElement {
a { a {
color: var(--primary-color); color: var(--primary-color);
} }
ha-card > ha-switch { .switch {
margin: -4px 0; margin: -4px 0;
position: absolute; position: absolute;
right: 8px; right: 8px;

12
src/panels/config/cloud/account/cloud-remote-pref.ts
View File

@ -59,10 +59,12 @@ export class CloudRemotePref extends LitElement {
return html` return html`
<ha-card header="Remote Control"> <ha-card header="Remote Control">
<ha-switch <div class="switch">
.checked="${remote_connected}" <ha-switch
@change="${this._toggleChanged}" .checked="${remote_connected}"
></ha-switch> @change="${this._toggleChanged}"
></ha-switch>
</div>
<div class="card-content"> <div class="card-content">
Home Assistant Cloud provides a secure remote connection to your Home Assistant Cloud provides a secure remote connection to your
instance while away from home. Your instance instance while away from home. Your instance
@ -118,7 +120,7 @@ export class CloudRemotePref extends LitElement {
a { a {
color: var(--primary-color); color: var(--primary-color);
} }
ha-card > ha-switch { .switch {
margin: -4px 0; margin: -4px 0;
position: absolute; position: absolute;
right: 8px; right: 8px;