| OLD | NEW |
| 1 <link rel="import" href="chrome://resources/html/polymer.html"> | 1 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 2 <link rel="import" href="chrome://resources/polymer/v1_0/iron-media-query/iron-m
edia-query.html"> | 2 <link rel="import" href="chrome://resources/polymer/v1_0/iron-media-query/iron-m
edia-query.html"> |
| 3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> | 3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper
-icon-button.html"> |
| 4 <link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar_se
arch_field.html"> | 4 <link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar_se
arch_field.html"> |
| 5 | 5 |
| 6 <dom-module id="cr-toolbar"> | 6 <dom-module id="cr-toolbar"> |
| 7 <template> | 7 <template> |
| 8 <style> | 8 <style> |
| 9 :host { | 9 :host { |
| 10 --cr-toolbar-field-width: 580px; | 10 --cr-toolbar-field-width: 580px; |
| (...skipping 41 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 52 #centeredContent { | 52 #centeredContent { |
| 53 display: flex; | 53 display: flex; |
| 54 flex: 1 1 0; | 54 flex: 1 1 0; |
| 55 justify-content: center; | 55 justify-content: center; |
| 56 } | 56 } |
| 57 | 57 |
| 58 #rightContent { | 58 #rightContent { |
| 59 -webkit-margin-end: 12px; | 59 -webkit-margin-end: 12px; |
| 60 } | 60 } |
| 61 | 61 |
| 62 :host([narrow_]) #centeredContent { | 62 :host([narrow]) #centeredContent { |
| 63 justify-content: flex-end; | 63 justify-content: flex-end; |
| 64 } | 64 } |
| 65 | 65 |
| 66 :host([narrow_][showing-search_]) #leftContent { | 66 :host([narrow][showing-search_]) #leftContent { |
| 67 position: absolute; | 67 position: absolute; |
| 68 opacity: 0; | 68 opacity: 0; |
| 69 } | 69 } |
| 70 | 70 |
| 71 :host(:not([narrow_])) #leftContent { | 71 :host(:not([narrow])) #leftContent { |
| 72 flex: 1 1 var(--cr-toolbar-field-margin, 0); | 72 flex: 1 1 var(--cr-toolbar-field-margin, 0); |
| 73 } | 73 } |
| 74 | 74 |
| 75 :host(:not([narrow_])) #rightContent { | 75 :host(:not([narrow])) #rightContent { |
| 76 flex: 1 1 0; | 76 flex: 1 1 0; |
| 77 text-align: end; | 77 text-align: end; |
| 78 } | 78 } |
| 79 | 79 |
| 80 #menuPromo { | 80 #menuPromo { |
| 81 -webkit-padding-end: 12px; | 81 -webkit-padding-end: 12px; |
| 82 -webkit-padding-start: 8px; | 82 -webkit-padding-start: 8px; |
| 83 align-items: center; | 83 align-items: center; |
| 84 background: #616161; | 84 background: #616161; |
| 85 border-radius: 2px; | 85 border-radius: 2px; |
| (...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 141 <button id="closePromo" on-tap="onClosePromoTap_" | 141 <button id="closePromo" on-tap="onClosePromoTap_" |
| 142 aria-label$="[[closeMenuPromo]]">✕</button> | 142 aria-label$="[[closeMenuPromo]]">✕</button> |
| 143 </paper-tooltip> | 143 </paper-tooltip> |
| 144 </template> | 144 </template> |
| 145 </template> | 145 </template> |
| 146 <h1>[[pageName]]</h1> | 146 <h1>[[pageName]]</h1> |
| 147 </div> | 147 </div> |
| 148 </div> | 148 </div> |
| 149 | 149 |
| 150 <div id="centeredContent"> | 150 <div id="centeredContent"> |
| 151 <cr-toolbar-search-field id="search" narrow="[[narrow_]]" | 151 <cr-toolbar-search-field id="search" narrow="[[narrow]]" |
| 152 label="[[searchPrompt]]" clear-label="[[clearLabel]]" | 152 label="[[searchPrompt]]" clear-label="[[clearLabel]]" |
| 153 spinner-active="[[spinnerActive]]" | 153 spinner-active="[[spinnerActive]]" |
| 154 showing-search="{{showingSearch_}}"> | 154 showing-search="{{showingSearch_}}"> |
| 155 </cr-toolbar-search-field> | 155 </cr-toolbar-search-field> |
| 156 <iron-media-query query="(max-width: 900px)" query-matches="{{narrow_}}"> | 156 <iron-media-query query="(max-width: 900px)" query-matches="{{narrow}}"> |
| 157 </iron-media-query> | 157 </iron-media-query> |
| 158 </div> | 158 </div> |
| 159 | 159 |
| 160 <div id="rightContent"> | 160 <div id="rightContent"> |
| 161 <content select=".more-actions"></content> | 161 <content select=".more-actions"></content> |
| 162 </div> | 162 </div> |
| 163 </template> | 163 </template> |
| 164 <script src="cr_toolbar.js"></script> | 164 <script src="cr_toolbar.js"></script> |
| 165 </dom-module> | 165 </dom-module> |
| OLD | NEW |