| OLD | NEW |
| 1 <link rel="import" href="chrome://resources/cr_elements/icons.html"> | 1 <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
| 2 <link rel="import" href="chrome://resources/html/polymer.html"> | 2 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog-behavior/p
aper-dialog-behavior.html"> | 3 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog-behavior/p
aper-dialog-behavior.html"> |
| 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog-behavior/p
aper-dialog-shared-styles.html"> | 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog-behavior/p
aper-dialog-shared-styles.html"> |
| 5 <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-icon-button/paper
-icon-button.html"> |
| 6 | 6 |
| 7 <dom-module id="settings-dialog"> | 7 <dom-module id="settings-dialog"> |
| 8 <template> | 8 <template> |
| 9 <style include="paper-dialog-shared-styles"></style> | 9 <style include="paper-dialog-shared-styles"> |
| 10 <style> | |
| 11 :host { | 10 :host { |
| 12 border-radius: 2px; | 11 border-radius: 2px; |
| 13 } | 12 } |
| 14 | 13 |
| 15 :host ::content > * { | 14 :host ::content > * { |
| 16 /* Overrides paper-dialog-shared-styles. */ | 15 /* Overrides paper-dialog-shared-styles. */ |
| 17 -webkit-padding-end: 0; | 16 -webkit-padding-end: 0; |
| 18 -webkit-padding-start: 0; | 17 -webkit-padding-start: 0; |
| 19 margin-bottom: 0; | 18 margin-bottom: 0; |
| 20 margin-top: 0; | 19 margin-top: 0; |
| 21 } | 20 } |
| 22 | 21 |
| 23 .title-container { | 22 .title-container { |
| 24 align-items: center; | 23 align-items: center; |
| 25 /* TODO(dbeam): should this be a --settings-separator-line? */ | 24 /* TODO(dbeam): should this be a --settings-separator-line? */ |
| 26 border-bottom: 1px solid rgba(0, 0, 0, 0.14); | 25 border-bottom: 1px solid rgba(0, 0, 0, 0.14); |
| 27 display: flex; | 26 display: flex; |
| 28 min-height: 52px; | 27 min-height: 52px; |
| 29 } | 28 } |
| 30 | 29 |
| 31 :host ::content .title { | 30 :host ::content .title { |
| 32 font-size: 114.28%; /* (16px / 14px) * 100 */ | 31 font-size: 114.28%; /* (16px / 14px) * 100 */ |
| 33 } | 32 } |
| 34 | 33 |
| 35 #close { | 34 #close { |
| 36 height: 20px; | 35 --paper-icon-button: { |
| 37 margin: 16px; | 36 height: 40px; |
| 38 padding: 0; | 37 width: 40px; |
| 39 width: 20px; | 38 }; |
| 39 -webkit-margin-end: 6px; |
| 40 /* <paper-icon-button> overrides --iron-icon-{height,width}, so this |
| 41 * padding essentially reduces 40x40 to 20x20. */ |
| 42 padding: 10px; |
| 40 } | 43 } |
| 41 | 44 |
| 42 .body-container { | 45 .body-container { |
| 43 display: flex; | 46 display: flex; |
| 44 flex-direction: column; | 47 flex-direction: column; |
| 45 max-width: 800px; | 48 max-width: 800px; |
| 46 min-width: 512px; | 49 min-width: 512px; |
| 47 /* TODO(dbeam): use <paper-dialog-scrollable> to get dividers? */ | 50 /* TODO(dbeam): use <paper-dialog-scrollable> to get dividers? */ |
| 48 overflow: auto; | 51 overflow: auto; |
| 49 } | 52 } |
| (...skipping 43 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 93 </paper-icon-button> | 96 </paper-icon-button> |
| 94 </div> | 97 </div> |
| 95 <div class="body-container"> | 98 <div class="body-container"> |
| 96 <content select=".body"></content> | 99 <content select=".body"></content> |
| 97 </div> | 100 </div> |
| 98 <content select=".button-container"></content> | 101 <content select=".button-container"></content> |
| 99 <content select=".footer"></content> | 102 <content select=".footer"></content> |
| 100 </template> | 103 </template> |
| 101 <script src="settings_dialog.js"></script> | 104 <script src="settings_dialog.js"></script> |
| 102 </dom-module> | 105 </dom-module> |
| OLD | NEW |