ha-frontend-cdce8p/src/components/entity/ha-entity-marker.html
2015-09-25 07:43:35 -07:00

40 lines
1.1 KiB
HTML

<link rel='import' href='../../../bower_components/polymer/polymer.html'>
<link rel='import' href='../../../bower_components/iron-image/iron-image.html'>
<link rel='import' href='../../../bower_components/iron-icon/iron-icon.html'>
<dom-module id='ha-entity-marker'>
<style>
.marker {
display: inline-block;
text-align: center;
vertical-align: top;
position: relative;
display: block;
margin: 0 auto;
width: 2.5em;
text-align: center;
height: 2.5em;
line-height: 2.5em;
font-size: 1.5em;
border-radius: 50%;
border: 0.1em solid var(--ha-marker-color, --default-primary-color);
color: rgb(76, 76, 76);
background-color: white;
}
iron-image {
border-radius: 50%;
}
</style>
<template>
<div class='marker'>
<template is='dom-if' if='[[icon]]'>
<iron-icon icon='[[icon]]'></iron-icon>
</template>
<template is='dom-if' if='[[value]]'>[[value]]</template>
<template is='dom-if' if='[[image]]'>
<iron-image sizing='cover' class='fit'src='[[image]]'></iron-image>
</template>
</div>
</template>
</dom-module>