| OLD | NEW |
| 1 <html><head> | 1 <html><head> |
| 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/iron-a11y-keys-behavior
/iron-a11y-keys-behavior.html"> | 3 <link rel="import" href="chrome://resources/polymer/v1_0/iron-a11y-keys-behavior
/iron-a11y-keys-behavior.html"> |
| 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-behaviors/paper-i
nky-focus-behavior.html"> | 4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-behaviors/paper-i
nky-focus-behavior.html"> |
| 5 <link rel="import" href="../prefs/prefs_behavior.html"> | 5 <link rel="import" href="../prefs/prefs_behavior.html"> |
| 6 <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> |
| 6 </head><body><dom-module id="night-light-slider"> | 7 </head><body><dom-module id="night-light-slider"> |
| 7 <template> | 8 <template> |
| 8 <style> | 9 <style> |
| 9 :host { | 10 :host { |
| 10 cursor: default; | 11 cursor: default; |
| 12 font-family: 'Roboto', sans-serif; |
| 11 text-align: center; | 13 text-align: center; |
| 12 user-select: none; | 14 user-select: none; |
| 13 } | 15 } |
| 14 | 16 |
| 15 #sliderContainer { | 17 #sliderContainer { |
| 16 display: inline-block; | 18 display: inline-block; |
| 17 position: relative; | 19 position: relative; |
| 18 user-select: none; | 20 user-select: none; |
| 19 width: 570px; | 21 width: 570px; |
| 20 } | 22 } |
| (...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 72 } | 74 } |
| 73 | 75 |
| 74 #labelContainer { | 76 #labelContainer { |
| 75 height: 2em; | 77 height: 2em; |
| 76 } | 78 } |
| 77 | 79 |
| 78 .label { | 80 .label { |
| 79 background: var(--google-blue-700); | 81 background: var(--google-blue-700); |
| 80 border-radius: 14px; | 82 border-radius: 14px; |
| 81 color: white; | 83 color: white; |
| 82 font-family: Roboto-Bold; | |
| 83 font-size: 12px; | 84 font-size: 12px; |
| 84 left: 0; | 85 left: 0; |
| 85 line-height: 1.5em; | 86 line-height: 1.5em; |
| 86 margin-left: -2.5em; | 87 margin-left: -2.5em; |
| 87 position: absolute; | 88 position: absolute; |
| 88 text-align: center; | 89 text-align: center; |
| 89 vertical-align: middle; | 90 vertical-align: middle; |
| 90 width: 5em; | 91 width: 5em; |
| 91 } | 92 } |
| 92 | 93 |
| (...skipping 22 matching lines...) Expand all Loading... |
| 115 } | 116 } |
| 116 | 117 |
| 117 #legendContainer { | 118 #legendContainer { |
| 118 height: 10px; | 119 height: 10px; |
| 119 position: relative; | 120 position: relative; |
| 120 width: inherit; | 121 width: inherit; |
| 121 } | 122 } |
| 122 | 123 |
| 123 #legendContainer > div { | 124 #legendContainer > div { |
| 124 color: rgb(100, 100, 100); | 125 color: rgb(100, 100, 100); |
| 125 font-family: Roboto-Regular; | |
| 126 font-size: 12px; | 126 font-size: 12px; |
| 127 margin-left: -2.5em; | 127 margin-left: -2.5em; |
| 128 position: absolute; | 128 position: absolute; |
| 129 text-align: center; | 129 text-align: center; |
| 130 top: 5px; | 130 top: 5px; |
| 131 width: 5em; | 131 width: 5em; |
| 132 } | 132 } |
| 133 | 133 |
| 134 paper-ripple { | 134 paper-ripple { |
| 135 color: var(--google-blue-700); | 135 color: var(--google-blue-700); |
| (...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 171 <div style="left: 50%;">[[getLocaleTimeString_(6, 0)]]</div> | 171 <div style="left: 50%;">[[getLocaleTimeString_(6, 0)]]</div> |
| 172 <div style="left: 75%;">[[getLocaleTimeString_(12, 0)]]</div> | 172 <div style="left: 75%;">[[getLocaleTimeString_(12, 0)]]</div> |
| 173 <div style="left: 100%;">[[getLocaleTimeString_(18, 0)]]</div> | 173 <div style="left: 100%;">[[getLocaleTimeString_(18, 0)]]</div> |
| 174 </div> | 174 </div> |
| 175 <div id="dummyRippleContainer" hidden></div> | 175 <div id="dummyRippleContainer" hidden></div> |
| 176 </div> | 176 </div> |
| 177 | 177 |
| 178 </template> | 178 </template> |
| 179 </dom-module> | 179 </dom-module> |
| 180 <script src="night_light_slider.js"></script></body></html> | 180 <script src="night_light_slider.js"></script></body></html> |
| OLD | NEW |