| 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/paper-styles/color.html
"> | 2 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html
"> |
| 3 | 3 |
| 4 <dom-module id="md-select"> | 4 <dom-module id="md-select"> |
| 5 <template> | 5 <template> |
| 6 <style> | 6 <style> |
| 7 .md-select { | 7 .md-select { |
| 8 --md-arrow-width: 0.9em; | 8 --md-arrow-width: 0.9em; |
| 9 -webkit-appearance: none; | 9 -webkit-appearance: none; |
| 10 /* Ensure that the text does not overlap with the down arrow. */ | 10 /* Ensure that the text does not overlap with the down arrow. */ |
| (...skipping 14 matching lines...) Expand all Loading... |
| 25 outline: none; | 25 outline: none; |
| 26 padding-bottom: 3px; | 26 padding-bottom: 3px; |
| 27 padding-top: 3px; | 27 padding-top: 3px; |
| 28 width: var(--md-select-width, 200px); | 28 width: var(--md-select-width, 200px); |
| 29 } | 29 } |
| 30 | 30 |
| 31 /* Mirroring paper-dropdown-menu disabled style. */ | 31 /* Mirroring paper-dropdown-menu disabled style. */ |
| 32 .md-select[disabled] { | 32 .md-select[disabled] { |
| 33 border-bottom: 1px dashed var(--secondary-text-color); | 33 border-bottom: 1px dashed var(--secondary-text-color); |
| 34 color: var(--secondary-text-color); | 34 color: var(--secondary-text-color); |
| 35 opacity: 0.33; | 35 opacity: 0.65; |
| 36 pointer-events: none; | 36 pointer-events: none; |
| 37 } | 37 } |
| 38 | 38 |
| 39 :host-context([dir=rtl]) .md-select { | 39 :host-context([dir=rtl]) .md-select { |
| 40 background-position-x: 3%; | 40 background-position-x: 3%; |
| 41 } | 41 } |
| 42 | 42 |
| 43 .md-select-underline { | 43 .md-select-underline { |
| 44 border-top: 2px solid var(--google-blue-500); | 44 border-top: 2px solid var(--google-blue-500); |
| 45 display: block; | 45 display: block; |
| 46 position: relative; | 46 position: relative; |
| 47 top: -1px; | 47 top: -1px; |
| 48 transform: scale3d(0, 1, 1); | 48 transform: scale3d(0, 1, 1); |
| 49 transition: transform 200ms ease-in; | 49 transition: transform 200ms ease-in; |
| 50 width: 100%; | 50 width: 100%; |
| 51 } | 51 } |
| 52 | 52 |
| 53 .md-select:focus + .md-select-underline { | 53 .md-select:focus + .md-select-underline { |
| 54 transform: scale3d(1, 1, 1); | 54 transform: scale3d(1, 1, 1); |
| 55 transition: transform 200ms ease-out; | 55 transition: transform 200ms ease-out; |
| 56 } | 56 } |
| 57 | 57 |
| 58 .md-select-wrapper { | 58 .md-select-wrapper { |
| 59 display: inline-block; | 59 display: inline-block; |
| 60 max-width: 100%; | 60 max-width: 100%; |
| 61 } | 61 } |
| 62 </style> | 62 </style> |
| 63 </template> | 63 </template> |
| 64 </dom-module> | 64 </dom-module> |
| OLD | NEW |