57 lines
1.4 KiB
HTML
57 lines
1.4 KiB
HTML
<link rel="import" href="../bower_components/polymer/polymer.html">
|
|
<link rel="import" href="../bower_components/paper-item/paper-item.html">
|
|
|
|
<link rel="import" href="../bower_components/iron-flex-layout/iron-flex-layout.html">
|
|
<dom-module id="xinu-email-unread">
|
|
<style>
|
|
/* TODO(polyup): For speed, consider reworking these styles with .classes
|
|
and #ids rather than [attributes].
|
|
*/
|
|
[layout] {
|
|
@apply(--layout);
|
|
}
|
|
[layout][horizontal] {
|
|
@apply(--layout-horizontal);
|
|
}
|
|
</style>
|
|
<style>
|
|
a {
|
|
color: #000;
|
|
text-decoration: none;
|
|
}
|
|
|
|
/*
|
|
.item {
|
|
background: linear-gradient(#fff, #f8f8f8);
|
|
padding: .5em;
|
|
}
|
|
|
|
.item:hover {
|
|
background: linear-gradient(#e8e8e8, #eee);
|
|
}
|
|
*/
|
|
</style>
|
|
<template>
|
|
|
|
<template is="dom-repeat" items="{{boxes}}" as="box">
|
|
<paper-item>
|
|
<a target="_self" href$="{{computeHref(box)}}">
|
|
<div horizontal="" layout="">
|
|
<div flex="">{{box.name}}</div>
|
|
<div end="">{{box.count}}</div>
|
|
</div>
|
|
</a>
|
|
</paper-item>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
Polymer({
|
|
is: 'xinu-email-unread',
|
|
properties: { boxes: { notify: true } },
|
|
computeHref: function (box) {
|
|
return '#' + box.name;
|
|
}
|
|
});
|
|
</script>
|
|
</dom-module>
|