| <link rel="import" href="chrome://resources/html/polymer.html"> |
| |
| <link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_lazy_render/cr_lazy_render.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html"> |
| <link rel="import" href="chrome://bookmarks/edit_dialog.html"> |
| <link rel="import" href="chrome://bookmarks/shared_style.html"> |
| <link rel="stylesheet" href="chrome://resources/css/md_colors.css"> |
| |
| <dom-module id="bookmarks-toolbar"> |
| <template> |
| <style include="shared-style"> |
| :host { |
| background: var(--md-toolbar-color); |
| transition: background-color 150ms; |
| } |
| |
| :host([show-selection-overlay]) { |
| background: var(--interactive-color); |
| } |
| |
| button.more-actions { |
| margin: 4px; |
| } |
| |
| button.more-vert-button div { |
| border-color: white; |
| } |
| |
| cr-toolbar, |
| cr-toolbar-selection-overlay { |
| color: #fff; |
| flex: 1; |
| } |
| |
| cr-toolbar { |
| --cr-toolbar-field-margin: |
| calc(var(--sidebar-width) + var(--splitter-width)); |
| } |
| |
| :host(:not([narrow_])) cr-toolbar-selection-overlay { |
| --selection-overlay-padding: var(--card-padding-side); |
| --cr-toolbar-field-margin: var(--sidebar-width); |
| --selection-overlay-max-width: var(--card-max-width); |
| } |
| </style> |
| <dialog is="cr-action-menu" id="dropdown"> |
| <button class="dropdown-item" on-tap="onSortTap_" |
| disabled="[[hasSearchTerm_(searchTerm_)]]"> |
| $i18n{menuSort} |
| </button> |
| <hr> |
| <button class="dropdown-item" on-tap="onAddBookmarkTap_" |
| disabled="[[hasSearchTerm_(searchTerm_)]]"> |
| $i18n{menuAddBookmark} |
| </button> |
| <button class="dropdown-item" on-tap="onAddFolderTap_" |
| disabled="[[hasSearchTerm_(searchTerm_)]]"> |
| $i18n{menuAddFolder} |
| </button> |
| <hr> |
| <button class="dropdown-item" on-tap="onImportTap_"> |
| $i18n{menuImport} |
| </button> |
| <button class="dropdown-item" on-tap="onExportTap_"> |
| $i18n{menuExport} |
| </button> |
| </dialog> |
| <cr-toolbar page-name="$i18n{title}" |
| clear-label="$i18n{clearSearch}" |
| search-prompt="$i18n{searchPrompt}" |
| hidden$="[[showSelectionOverlay]]" |
| narrow="{{narrow_}}" |
| on-search-changed="onSearchChanged_"> |
| <button is="paper-icon-button-light" class="more-actions more-vert-button" |
| on-tap="onMenuButtonOpenTap_"> |
| <div></div> |
| <div></div> |
| <div></div> |
| </button> |
| </cr-toolbar> |
| <template is="cr-lazy-render" id="addDialog"> |
| <bookmarks-edit-dialog></bookmarks-edit-dialog> |
| </template> |
| <template is="dom-if" if="[[showSelectionOverlay]]"> |
| <cr-toolbar-selection-overlay delete-label="$i18n{delete}" |
| cancel-label="$i18n{cancel}" |
| selection-label="[[getItemsSelectedString_(selectedCount_)]]" |
| on-delete-selected-items="onDeleteSelectionTap_" |
| on-clear-selected-items="onClearSelectionTap_"> |
| </cr-toolbar-selection-overlay> |
| </template> |
| </template> |
| <script src="chrome://bookmarks/toolbar.js"></script> |
| </dom-module> |