1
0
mirror of https://github.com/home-assistant/frontend.git synced 2025-12-19 18:28:42 +00:00
Files
frontend/src/components/ha-sidebar.html
Paulus Schoutsen 8e143c2e44 ES6 Polymer version
2015-07-12 17:31:41 -07:00

129 lines
4.1 KiB
HTML

<link rel='import' href='../../bower_components/polymer/polymer.html'>
<link rel='import' href='../../bower_components/layout/layout.html'>
<link rel='import' href='../../bower_components/paper-header-panel/paper-header-panel.html'>
<link rel='import' href='../../bower_components/paper-toolbar/paper-toolbar.html'>
<!--
Too broken for now.
<link rel='import' href='../../bower_components/paper-menu/paper-menu.html'> -->
<link rel='import' href='../../bower_components/iron-icon/iron-icon.html'>
<link rel='import' href='../../bower_components/paper-item/paper-item.html'>
<link rel='import' href='../../bower_components/paper-item/paper-icon-item.html'>
<link rel='import' href='../../bower_components/paper-icon-button/paper-icon-button.html'>
<link rel='import' href='../components/stream-status.html'>
<dom-module id='ha-sidebar'>
<style>
.sidenav {
background: #fafafa;
box-shadow: 1px 0 1px rgba(0, 0, 0, 0.1);
overflow: hidden;
white-space: nowrap;
-ms-user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
}
/*.sidenav paper-menu {
--paper-menu-color: var(--secondary-text-color);
--paper-menu-background-color: #fafafa;
}*/
div.menu {
color: var(--secondary-text-color);
background-color: #fafafa;
}
paper-icon-item {
cursor: pointer;
}
paper-icon-item.selected {
font-weight: bold;
}
paper-icon-item.logout {
margin-top: 16px;
}
.divider {
border-top: 1px solid #e0e0e0;
}
.text {
padding: 16px;
font-size: 14px;
}
.dev-tools {
padding: 0 8px;
}
</style>
<template>
<paper-header-panel mode='scroll' class='sidenav fit'>
<paper-toolbar>
<!-- forces paper toolbar to style title appropriate -->
<paper-icon-button hidden></paper-icon-button>
<div class="title">Home Assistant</div>
</paper-toolbar>
<!-- <paper-menu id='menu' selected='{{menuSelected}}'
selectable='[data-panel]' attr-for-selected='data-panel'> -->
<div class='menu'>
<paper-icon-item on-click='menuClicked' data-panel='states'>
<iron-icon item-icon icon='apps'></iron-icon> States
</paper-icon-item>
<template is='dom-repeat' items='{{possibleFilters}}'>
<paper-icon-item on-click='menuClicked' data-panel$='[[filterType(item)]]'>
<iron-icon item-icon icon='[[filterIcon(item)]]'></iron-icon>
<span>[[filterName(item)]]</span>
</paper-icon-item>
</template>
<template is='dom-if' if='[[hasHistoryComponent]]'>
<paper-icon-item on-click='menuClicked' data-panel='history'>
<iron-icon item-icon icon='assessment'></iron-icon>
History
</paper-icon-item>
</template>
<template is='dom-if' if='[[hasLogbookComponent]]'>
<paper-icon-item on-click='menuClicked' data-panel='logbook'>
<iron-icon item-icon icon='list'></iron-icon>
Logbook
</paper-icon-item>
</template>
<paper-icon-item on-click='menuClicked' data-panel='logout' class='logout'>
<iron-icon item-icon icon='exit-to-app'></iron-icon>
Log Out
</paper-icon-item>
<paper-item class='divider horizontal layout justified'>
<div>Streaming updates</div>
<stream-status></stream-status>
</paper-item>
<div class='text label divider'>Developer Tools</div>
<div class='dev-tools layout horizontal justified'>
<paper-icon-button
icon='settings-remote' data-panel='devService'
on-click='handleDevClick'></paper-icon-button>
<paper-icon-button
icon='settings-ethernet' data-panel='devState'
on-click='handleDevClick'></paper-icon-button>
<paper-icon-button
icon='settings-input-antenna' data-panel='devEvent'
on-click='handleDevClick'></paper-icon-button>
</div>
<!-- </paper-menu> -->
</div>
</paper-header-panel>
</template>
</dom-module>