jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-19 15:26:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Lovelace map: hide overflow, reset focus button (#1421)

Browse Source 
* Lovelace map: hide overflow, reset focus button

* Increase margin for better clicking
This commit is contained in:
c727 2018-07-08 15:03:56 +02:00 committed by Paulus Schoutsen
parent c17f390f58
commit b0f29744bf
1 changed files with 21 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/panels/lovelace/cards/hui-map-card.js
View File

@ -1,5 +1,6 @@
import { html } from '@polymer/polymer/lib/utils/html-tag.js'; import { html } from '@polymer/polymer/lib/utils/html-tag.js';
import { PolymerElement } from '@polymer/polymer/polymer-element.js'; import { PolymerElement } from '@polymer/polymer/polymer-element.js';
import '@polymer/paper-icon-button/paper-icon-button.js';
import Leaflet from 'leaflet'; import Leaflet from 'leaflet';
import '../../map/ha-entity-marker.js'; import '../../map/ha-entity-marker.js';
@ -21,13 +22,17 @@ class HuiMapCard extends PolymerElement {
top: 0; top: 0;
width: 100%; width: 100%;
/** /**
* In panel mode we want a full height map. Since parent #view * In panel mode we want a full height map. Since parent #view
* only sets min-height, we need absolute positioning here * only sets min-height, we need absolute positioning here
*/ */
height: 100%; height: 100%;
position: absolute; position: absolute;
} }
ha-card {
overflow: hidden;
}
#map { #map {
z-index: 0; z-index: 0;
border: none; border: none;
@ -37,19 +42,30 @@ class HuiMapCard extends PolymerElement {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
paper-icon-button {
position: absolute;
top: 75px;
left: 7px;
}
#root { #root {
position: relative; position: relative;
} }
:host([is-panel]) #root { :host([is-panel]) #root {
height: 100%; height: 100%;
} }
</style> </style>
<ha-card id="card" header="[[_config.title]]"> <ha-card id="card" header="[[_config.title]]">
<div id="root"> <div id="root">
<div id="map"></div> <div id="map"></div>
<paper-icon-button
on-click="_fitMap"
icon="hass:image-filter-center-focus"
title="Reset focus"
></paper-icon-button>
</div> </div>
</ha-card> </ha-card>