| OLD | NEW |
|---|
| (Empty) | |
| 1 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 2 <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
| 3 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.htm
l"> |
| 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> |
| 5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html
"> |
| 6 <link rel="import" href="chrome://bookmarks/icons.html"> |
| 7 <link rel="import" href="chrome://bookmarks/shared_style.html"> |
| 8 |
| 9 <dom-module id="bookmarks-folder-node"> |
| 10 <template> |
| 11 <style include="shared-style"> |
| 12 :host { |
| 13 display: block; |
| 14 } |
| 15 |
| 16 .v-centered { |
| 17 align-items: center; |
| 18 display: flex; |
| 19 flex-direction: row; |
| 20 } |
| 21 |
| 22 .menu-label { |
| 23 -webkit-margin-start: 24px; |
| 24 color: var(--folder-inactive-color); |
| 25 font-weight: 500; |
| 26 overflow: hidden; |
| 27 text-overflow: ellipsis; |
| 28 white-space: nowrap; |
| 29 } |
| 30 |
| 31 #container { |
| 32 height: 40px; |
| 33 } |
| 34 |
| 35 #descendants { |
| 36 -webkit-padding-start: 40.5px; |
| 37 } |
| 38 |
| 39 #folder-label { |
| 40 color: var(--secondary-text-color); |
| 41 cursor: pointer; |
| 42 flex-grow: 1; |
| 43 overflow: hidden; |
| 44 } |
| 45 |
| 46 :host([is-selected]) .menu-label, |
| 47 :host([is-selected]) #folder-label { |
| 48 color: var(--folder-active-color); |
| 49 } |
| 50 |
| 51 iron-icon { |
| 52 --iron-icon-height: 20px; |
| 53 --iron-icon-width: 20px; |
| 54 min-width: 20px; |
| 55 } |
| 56 |
| 57 paper-icon-button { |
| 58 color: var(--secondary-text-color); |
| 59 height: 36px; |
| 60 min-width: 36px; |
| 61 padding: 8px; |
| 62 width: 36px; |
| 63 } |
| 64 </style> |
| 65 |
| 66 <div id="container" class="v-centered"> |
| 67 <div id="folder-label" class="v-centered" on-tap="selectFolder_"> |
| 68 <iron-icon icon="[[getFolderIcon_(isSelected)]]"></iron-icon> |
| 69 <div class="menu-label">[[item.title]]</div> |
| 70 </div> |
| 71 <template is="dom-if" if="[[hasChildFolder_(item.children)]]"> |
| 72 <paper-icon-button icon="[[getArrowIcon_(item.isOpen)]]" |
| 73 on-tap="toggleFolder_"></paper-icon-button> |
| 74 </template> |
| 75 </div> |
| 76 <div id="descendants" hidden$="[[!item.isOpen]]"> |
| 77 <template is="dom-repeat" items="[[item.children]]" as="child"> |
| 78 <template is="dom-if" if="[[!child.url]]"> |
| 79 <bookmarks-folder-node item="[[child]]" |
| 80 is-selected="[[child.isSelected]]"></bookmarks-folder-node> |
| 81 </template> |
| 82 </template> |
| 83 </div> |
| 84 </template> |
| 85 <script src="chrome://bookmarks/folder_node.js"></script> |
| 86 </dom-module> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2603303002:
[MD Bookmarks] Add UI for Material Bookmarks. (Closed)
