blob: a408a4b8208bad1201645e4fd4d467f8ae4987db [file] [log] [blame]
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/shadow.html">
<link rel="import" href="chrome://bookmarks/item.html">
<link rel="import" href="chrome://bookmarks/shared_style.html">
<link rel="import" href="chrome://bookmarks/store_client.html">
<link rel="import" href="chrome://bookmarks/util.html">
<dom-module id="bookmarks-list">
<template>
<style include="shared-style">
:host {
overflow-y: auto;
padding: 20px var(--card-padding-side) 20px
calc(var(--card-padding-side) - var(--splitter-width));
}
#bookmarksCard {
@apply(--shadow-elevation-2dp);
background-color: #fff;
margin: 0 auto;
max-width: var(--card-max-width);
padding: 8px 0;
}
.centered-message {
align-items: center;
color: #6e6e6e;
display: flex;
font-size: 14px;
font-weight: 500;
height: 100%;
justify-content: center;
}
</style>
<div id="bookmarksCard" hidden$="[[isEmptyList_(displayedList_.length)]]">
<template is="dom-repeat" items="[[displayedList_]]" as="id">
<bookmarks-item item-id="[[id]]" draggable="true">
</bookmarks-item>
</template>
</div>
<div id="message" class="centered-message"
hidden$="[[!isEmptyList_(displayedList_.length)]]">
[[emptyListMessage_(searchTerm_)]]
</div>
</template>
<script src="chrome://bookmarks/list.js"></script>
</dom-module>