| OLD | NEW |
|---|
| 1 Content-Type: text/plain | 1 Content-Type: text/plain |
| 2 <html lang="en"><head><style>template { display: none; }</style> | 2 <html lang="en"><head><style>template { display: none; }</style> |
| 3 <!-- | 3 <!-- |
| 4 This test runs the TodoMVC app, adds a few todos, marks some as done | 4 This test runs the TodoMVC app, adds a few todos, marks some as done |
| 5 programatically, and clicks on a checkbox to mark others via the UI. | 5 programatically, and clicks on a checkbox to mark others via the UI. |
| 6 --> | 6 --> |
| 7 <meta charset="utf-8"> | 7 <meta charset="utf-8"> |
| 8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | 8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
| 9 | 9 |
| 10 <link rel="stylesheet" href="../../../web/base.css"> | 10 <link rel="stylesheet" href="../../../web/base.css"> |
| 11 <script src="../../packages/polymer/testing/testing.js"></script> | 11 <script src="../../packages/polymer/testing/testing.js"></script> |
| 12 <title>Dart • TodoMVC</title> | 12 <title>Dart • TodoMVC</title> |
| 13 <style>template, | 13 <style>template, |
| 14 thead[template], | 14 thead[template], |
| 15 tbody[template], | 15 tbody[template], |
| 16 tfoot[template], | 16 tfoot[template], |
| 17 th[template], | 17 th[template], |
| 18 tr[template], | 18 tr[template], |
| 19 td[template], | 19 td[template], |
| 20 caption[template], | 20 caption[template], |
| 21 colgroup[template], | 21 colgroup[template], |
| 22 col[template], | 22 col[template], |
| 23 option[template] { | 23 option[template] { |
| 24 display: none; | 24 display: none; |
| 25 }</style></head><body><polymer-element name="todo-row" extends="li" attributes="
todo"> | 25 }</style></head><body><polymer-element name="todo-row" extends="li" attributes="
todo"> |
| 26 <template> | 26 <template> |
| 27 | 27 <style scoped=""> |
| 28 <style> | |
| 29 .todo-item { | 28 .todo-item { |
| 30 position: relative; | 29 position: relative; |
| 31 font-size: 24px; | 30 font-size: 24px; |
| 32 border-bottom: 1px dotted #ccc; | 31 border-bottom: 1px dotted #ccc; |
| 33 } | 32 } |
| 33 |
| 34 .todo-item.editing { | 34 .todo-item.editing { |
| 35 border-bottom: none; | 35 border-bottom: none; |
| 36 padding: 0; | 36 padding: 0; |
| 37 } | 37 } |
| 38 |
| 39 /* |
| 40 TODO(jmesserly): the ".todo-item label" selector does not work with real |
| 41 ShadowRoot because it crosses the shadow boundary. |
| 42 */ |
| 38 .todo-item.completed [is=editable-label] { | 43 .todo-item.completed [is=editable-label] { |
| 39 color: #a9a9a9; | 44 color: #a9a9a9; |
| 40 text-decoration: line-through; | 45 text-decoration: line-through; |
| 41 } | 46 } |
| 47 |
| 42 .todo-item .toggle { | 48 .todo-item .toggle { |
| 43 text-align: center; | 49 text-align: center; |
| 44 width: 40px; | 50 width: 40px; |
| 51 /* auto, since non-WebKit browsers don't support input styling */ |
| 45 height: auto; | 52 height: auto; |
| 46 position: absolute; | 53 position: absolute; |
| 47 top: 0; | 54 top: 0; |
| 48 bottom: 0; | 55 bottom: 0; |
| 49 margin: auto 0; | 56 margin: auto 0; |
| 50 border: none; | 57 border: none; /* Mobile Safari */ |
| 51 -webkit-appearance: none; | 58 -webkit-appearance: none; |
| 59 /*-moz-appearance: none;*/ |
| 52 -ms-appearance: none; | 60 -ms-appearance: none; |
| 53 -o-appearance: none; | 61 -o-appearance: none; |
| 54 appearance: none; | 62 appearance: none; |
| 55 } | 63 } |
| 64 |
| 56 .todo-item .toggle:after { | 65 .todo-item .toggle:after { |
| 57 content: "✔"; | 66 content: '✔'; |
| 58 line-height: 43px; | 67 line-height: 43px; /* 40 + a couple of pixels visual adjustment */ |
| 59 font-size: 20px; | 68 font-size: 20px; |
| 60 color: #d9d9d9; | 69 color: #d9d9d9; |
| 61 text-shadow: 0 -1px 0 #bfbfbf; | 70 text-shadow: 0 -1px 0 #bfbfbf; |
| 62 } | 71 } |
| 72 |
| 63 .todo-item .toggle:checked:after { | 73 .todo-item .toggle:checked:after { |
| 64 color: #85ada7; | 74 color: #85ada7; |
| 65 text-shadow: 0 1px 0 #669991; | 75 text-shadow: 0 1px 0 #669991; |
| 66 bottom: 1px; | 76 bottom: 1px; |
| 67 position: relative; | 77 position: relative; |
| 68 } | 78 } |
| 69 .todo-item .destroy { | 79 .todo-item .destroy { |
| 70 display: none; | 80 display: none; |
| 71 position: absolute; | 81 position: absolute; |
| 72 top: 0; | 82 top: 0; |
| 73 right: 10px; | 83 right: 10px; |
| 74 bottom: 0; | 84 bottom: 0; |
| 75 width: 40px; | 85 width: 40px; |
| 76 height: 40px; | 86 height: 40px; |
| 77 margin: auto 0; | 87 margin: auto 0; |
| 78 font-size: 22px; | 88 font-size: 22px; |
| 79 color: #a88a8a; | 89 color: #a88a8a; |
| 80 -webkit-transition: all 0.2s; | 90 -webkit-transition: all 0.2s; |
| 81 -moz-transition: all 0.2s; | 91 -moz-transition: all 0.2s; |
| 82 -ms-transition: all 0.2s; | 92 -ms-transition: all 0.2s; |
| 83 -o-transition: all 0.2s; | 93 -o-transition: all 0.2s; |
| 84 transition: all 0.2s; | 94 transition: all 0.2s; |
| 85 } | 95 } |
| 96 |
| 86 .todo-item .destroy:hover { | 97 .todo-item .destroy:hover { |
| 87 text-shadow: 0 0 1px #000, 0 0 10px rgba(199, 107, 107, 0.8); | 98 text-shadow: 0 0 1px #000, |
| 99 0 0 10px rgba(199, 107, 107, 0.8); |
| 88 -webkit-transform: scale(1.3); | 100 -webkit-transform: scale(1.3); |
| 89 -moz-transform: scale(1.3); | 101 -moz-transform: scale(1.3); |
| 90 -ms-transform: scale(1.3); | 102 -ms-transform: scale(1.3); |
| 91 -o-transform: scale(1.3); | 103 -o-transform: scale(1.3); |
| 92 transform: scale(1.3); | 104 transform: scale(1.3); |
| 93 } | 105 } |
| 106 |
| 94 .todo-item .destroy:after { | 107 .todo-item .destroy:after { |
| 95 content: "✖"; | 108 content: '✖'; |
| 96 } | 109 } |
| 110 |
| 97 .todo-item:hover .destroy { | 111 .todo-item:hover .destroy { |
| 98 display: block; | 112 display: block; |
| 99 } | 113 } |
| 100 .todo-item.editing .destroy, .todo-item.editing .toggle { | 114 |
| 115 .todo-item.editing .destroy, |
| 116 .todo-item.editing .toggle { |
| 101 display: none; | 117 display: none; |
| 102 } | 118 } |
| 119 |
| 103 .todo-item.editing:last-child { | 120 .todo-item.editing:last-child { |
| 104 margin-bottom: -1px; | 121 margin-bottom: -1px; |
| 105 } @media screen AND (-webkit-min-device-pixel-ratio:0) { | |
| 106 .todo-item .toggle { | |
| 107 background: none; | |
| 108 } | 122 } |
| 109 #todo-item .toggle { | 123 |
| 110 height: 40px; | 124 /* |
| 125 Hack to remove background from Mobile Safari. |
| 126 Can't use it globally since it destroys checkboxes in Firefox and Opera |
| 127 */ |
| 128 @media screen and (-webkit-min-device-pixel-ratio:0) { |
| 129 .todo-item .toggle { |
| 130 background: none; |
| 131 } |
| 132 #todo-item .toggle { |
| 133 height: 40px; |
| 134 } |
| 111 } | 135 } |
| 112 } | 136 </style> |
| 113 </style><div class="todo-item"> | 137 <div class="todo-item"> |
| 114 <input class="toggle" type="checkbox" checked="{{todo.done}}"> | 138 <input class="toggle" type="checkbox" checked="{{todo.done}}"> |
| 115 <div is="editable-label" id="label" value="{{todo.task}}"></div> | 139 <span is="editable-label" id="label" value="{{todo.task}}"></span> |
| 116 <button class="destroy" on-click="removeTodo"></button> | 140 <button class="destroy" on-click="removeTodo"></button> |
| 117 </div> | 141 </div> |
| 118 </template> | 142 </template> |
| 119 | 143 |
| 120 </polymer-element> | 144 </polymer-element> |
| 121 <polymer-element name="todo-app"> | 145 <polymer-element name="todo-app"> |
| 122 <template> | 146 <template> |
| 123 <section id="todoapp"> | 147 <section id="todoapp"> |
| 124 <header id="header"> | 148 <header id="header"> |
| 125 <h1 class="title">todos</h1> | 149 <h1 class="title">todos</h1> |
| 126 <form on-submit="addTodo"> | 150 <form on-submit="addTodo"> |
| 127 <input id="new-todo" placeholder="What needs to be done?" autofocus="" o
n-change="addTodo"> | 151 <input id="new-todo" placeholder="What needs to be done?" autofocus="" o
n-change="addTodo"> |
| 128 </form> | 152 </form> |
| 129 </header> | 153 </header> |
| 130 <section id="main"> | 154 <section id="main"> |
| 131 <input id="toggle-all" type="checkbox" checked="{{app.allChecked}}"> | 155 <input id="toggle-all" type="checkbox" checked="{{app.allChecked}}"> |
| 132 <label for="toggle-all"></label> | 156 <label for="toggle-all"></label> |
| 133 <ul id="todo-list"> | 157 <ul id="todo-list"> |
| 134 <template repeat="{{app.visibleTodos}}"> | 158 <template repeat="{{app.visibleTodos}}"> |
| 135 <li is="todo-row" todo="{{}}"></li> | 159 <li is="todo-row" todo="{{}}"></li> |
| 136 </template> | 160 </template> |
| 137 </ul> | 161 </ul> |
| 138 </section> | 162 </section> |
| 139 <template bind="" if="{{app.hasTodos}}"> | 163 <template bind="" if="{{app.todos.length > 0}}"> |
| 140 <footer id="footer"> | 164 <footer id="footer"> |
| 141 <span id="todo-count"><strong>{{app.remaining}}</strong></span> | 165 <span id="todo-count"><strong>{{app.remaining}}</strong></span> |
| 142 <ul is="router-options" id="filters"> | 166 <ul is="router-options" id="filters"> |
| 143 <li> <a href="#/">All</a> </li> | 167 <li> <a href="#/">All</a> </li> |
| 144 <li> <a href="#/active">Active</a> </li> | 168 <li> <a href="#/active">Active</a> </li> |
| 145 <li> <a href="#/completed">Completed</a> </li> | 169 <li> <a href="#/completed">Completed</a> </li> |
| 146 </ul> | 170 </ul> |
| 147 <template bind="" if="{{app.hasCompleteTodos}}"> | 171 <template bind="" if="{{app.hasCompleteTodos}}"> |
| 148 <button id="clear-completed" on-click="clear"> | 172 <button id="clear-completed" on-click="clear"> |
| 149 Clear completed ({{app.doneCount}}) | 173 Clear completed ({{app.doneCount}}) |
| (...skipping 13 matching lines...) Expand all Loading... |
| 163 </p> | 187 </p> |
| 164 <p>Part of <a href="http://todomvc.com">TodoMVC</a>.</p> | 188 <p>Part of <a href="http://todomvc.com">TodoMVC</a>.</p> |
| 165 </footer> | 189 </footer> |
| 166 </template> | 190 </template> |
| 167 | 191 |
| 168 </polymer-element> | 192 </polymer-element> |
| 169 <polymer-element name="router-options" extends="ul"> | 193 <polymer-element name="router-options" extends="ul"> |
| 170 <template><content></content></template> | 194 <template><content></content></template> |
| 171 | 195 |
| 172 </polymer-element> | 196 </polymer-element> |
| 173 <polymer-element name="editable-label" extends="div" attributes="value"> | 197 <polymer-element name="editable-label" attributes="value"> |
| 174 <template> | 198 <template> |
| 175 <template bind="" if="{{notEditing}}"> | 199 <template bind="" if="{{!editing}}"> |
| 176 <label class="edit-label" on-double-click="edit">{{value}}</label> | 200 <label class="edit-label" on-double-click="edit">{{value}}</label> |
| 177 </template> | 201 </template> |
| 178 <template bind="" if="{{editing}}"> | 202 <template bind="" if="{{editing}}"> |
| 179 <form on-submit="update"> | 203 <form on-submit="update"> |
| 180 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC
ancel"> | 204 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC
ancel"> |
| 181 </form> | 205 </form> |
| 182 </template> | 206 </template> |
| 183 </template> | 207 </template> |
| 184 | 208 |
| 185 </polymer-element> | 209 </polymer-element> |
| 186 | 210 |
| 187 <span is="todo-app"><shadow-root> | 211 <span is="todo-app"><shadow-root> |
| 188 <section id="todoapp"> | 212 <section id="todoapp"> |
| 189 <header id="header"> | 213 <header id="header"> |
| 190 <h1 class="title">todos</h1> | 214 <h1 class="title">todos</h1> |
| 191 <form on-submit="addTodo"> | 215 <form on-submit="addTodo"> |
| 192 <input id="new-todo" placeholder="What needs to be done?" autofocus="" o
n-change="addTodo"> | 216 <input id="new-todo" placeholder="What needs to be done?" autofocus="" o
n-change="addTodo"> |
| 193 </form> | 217 </form> |
| 194 </header> | 218 </header> |
| 195 <section id="main"> | 219 <section id="main"> |
| 196 <input id="toggle-all" type="checkbox"> | 220 <input id="toggle-all" type="checkbox"> |
| 197 <label for="toggle-all"></label> | 221 <label for="toggle-all"></label> |
| 198 <ul id="todo-list"> | 222 <ul id="todo-list"> |
| 199 <template repeat="{{app.visibleTodos}}"> | 223 <template repeat="{{app.visibleTodos}}"></template> |
| 200 <li is="todo-row" todo="{{}}"></li> | |
| 201 </template> | |
| 202 <li is="todo-row" todo="{{}}"><shadow-root> | 224 <li is="todo-row" todo="{{}}"><shadow-root> |
| 203 | 225 <style scoped=""> |
| 204 <style> | |
| 205 .todo-item { | 226 .todo-item { |
| 206 position: relative; | 227 position: relative; |
| 207 font-size: 24px; | 228 font-size: 24px; |
| 208 border-bottom: 1px dotted #ccc; | 229 border-bottom: 1px dotted #ccc; |
| 209 } | 230 } |
| 231 |
| 210 .todo-item.editing { | 232 .todo-item.editing { |
| 211 border-bottom: none; | 233 border-bottom: none; |
| 212 padding: 0; | 234 padding: 0; |
| 213 } | 235 } |
| 236 |
| 237 /* |
| 238 TODO(jmesserly): the ".todo-item label" selector does not work with real |
| 239 ShadowRoot because it crosses the shadow boundary. |
| 240 */ |
| 214 .todo-item.completed [is=editable-label] { | 241 .todo-item.completed [is=editable-label] { |
| 215 color: #a9a9a9; | 242 color: #a9a9a9; |
| 216 text-decoration: line-through; | 243 text-decoration: line-through; |
| 217 } | 244 } |
| 245 |
| 218 .todo-item .toggle { | 246 .todo-item .toggle { |
| 219 text-align: center; | 247 text-align: center; |
| 220 width: 40px; | 248 width: 40px; |
| 249 /* auto, since non-WebKit browsers don't support input styling */ |
| 221 height: auto; | 250 height: auto; |
| 222 position: absolute; | 251 position: absolute; |
| 223 top: 0; | 252 top: 0; |
| 224 bottom: 0; | 253 bottom: 0; |
| 225 margin: auto 0; | 254 margin: auto 0; |
| 226 border: none; | 255 border: none; /* Mobile Safari */ |
| 227 -webkit-appearance: none; | 256 -webkit-appearance: none; |
| 257 /*-moz-appearance: none;*/ |
| 228 -ms-appearance: none; | 258 -ms-appearance: none; |
| 229 -o-appearance: none; | 259 -o-appearance: none; |
| 230 appearance: none; | 260 appearance: none; |
| 231 } | 261 } |
| 262 |
| 232 .todo-item .toggle:after { | 263 .todo-item .toggle:after { |
| 233 content: "✔"; | 264 content: '✔'; |
| 234 line-height: 43px; | 265 line-height: 43px; /* 40 + a couple of pixels visual adjustment */ |
| 235 font-size: 20px; | 266 font-size: 20px; |
| 236 color: #d9d9d9; | 267 color: #d9d9d9; |
| 237 text-shadow: 0 -1px 0 #bfbfbf; | 268 text-shadow: 0 -1px 0 #bfbfbf; |
| 238 } | 269 } |
| 270 |
| 239 .todo-item .toggle:checked:after { | 271 .todo-item .toggle:checked:after { |
| 240 color: #85ada7; | 272 color: #85ada7; |
| 241 text-shadow: 0 1px 0 #669991; | 273 text-shadow: 0 1px 0 #669991; |
| 242 bottom: 1px; | 274 bottom: 1px; |
| 243 position: relative; | 275 position: relative; |
| 244 } | 276 } |
| 245 .todo-item .destroy { | 277 .todo-item .destroy { |
| 246 display: none; | 278 display: none; |
| 247 position: absolute; | 279 position: absolute; |
| 248 top: 0; | 280 top: 0; |
| 249 right: 10px; | 281 right: 10px; |
| 250 bottom: 0; | 282 bottom: 0; |
| 251 width: 40px; | 283 width: 40px; |
| 252 height: 40px; | 284 height: 40px; |
| 253 margin: auto 0; | 285 margin: auto 0; |
| 254 font-size: 22px; | 286 font-size: 22px; |
| 255 color: #a88a8a; | 287 color: #a88a8a; |
| 256 -webkit-transition: all 0.2s; | 288 -webkit-transition: all 0.2s; |
| 257 -moz-transition: all 0.2s; | 289 -moz-transition: all 0.2s; |
| 258 -ms-transition: all 0.2s; | 290 -ms-transition: all 0.2s; |
| 259 -o-transition: all 0.2s; | 291 -o-transition: all 0.2s; |
| 260 transition: all 0.2s; | 292 transition: all 0.2s; |
| 261 } | 293 } |
| 294 |
| 262 .todo-item .destroy:hover { | 295 .todo-item .destroy:hover { |
| 263 text-shadow: 0 0 1px #000, 0 0 10px rgba(199, 107, 107, 0.8); | 296 text-shadow: 0 0 1px #000, |
| 297 0 0 10px rgba(199, 107, 107, 0.8); |
| 264 -webkit-transform: scale(1.3); | 298 -webkit-transform: scale(1.3); |
| 265 -moz-transform: scale(1.3); | 299 -moz-transform: scale(1.3); |
| 266 -ms-transform: scale(1.3); | 300 -ms-transform: scale(1.3); |
| 267 -o-transform: scale(1.3); | 301 -o-transform: scale(1.3); |
| 268 transform: scale(1.3); | 302 transform: scale(1.3); |
| 269 } | 303 } |
| 304 |
| 270 .todo-item .destroy:after { | 305 .todo-item .destroy:after { |
| 271 content: "✖"; | 306 content: '✖'; |
| 272 } | 307 } |
| 308 |
| 273 .todo-item:hover .destroy { | 309 .todo-item:hover .destroy { |
| 274 display: block; | 310 display: block; |
| 275 } | 311 } |
| 276 .todo-item.editing .destroy, .todo-item.editing .toggle { | 312 |
| 313 .todo-item.editing .destroy, |
| 314 .todo-item.editing .toggle { |
| 277 display: none; | 315 display: none; |
| 278 } | 316 } |
| 317 |
| 279 .todo-item.editing:last-child { | 318 .todo-item.editing:last-child { |
| 280 margin-bottom: -1px; | 319 margin-bottom: -1px; |
| 281 } @media screen AND (-webkit-min-device-pixel-ratio:0) { | |
| 282 .todo-item .toggle { | |
| 283 background: none; | |
| 284 } | 320 } |
| 285 #todo-item .toggle { | 321 |
| 286 height: 40px; | 322 /* |
| 323 Hack to remove background from Mobile Safari. |
| 324 Can't use it globally since it destroys checkboxes in Firefox and Opera |
| 325 */ |
| 326 @media screen and (-webkit-min-device-pixel-ratio:0) { |
| 327 .todo-item .toggle { |
| 328 background: none; |
| 329 } |
| 330 #todo-item .toggle { |
| 331 height: 40px; |
| 332 } |
| 287 } | 333 } |
| 288 } | 334 </style> |
| 289 </style><div class="todo-item"> | 335 <div class="todo-item"> |
| 290 <input class="toggle" type="checkbox"> | 336 <input class="toggle" type="checkbox"> |
| 291 <div is="editable-label" id="label" value="{{todo.task}}"><shadow-root> | 337 <span is="editable-label" id="label" value="{{todo.task}}"><shadow-root> |
| 292 <template bind="" if="{{notEditing}}"> | 338 <template bind="" if="{{!editing}}"></template> |
| 293 <label class="edit-label" on-double-click="edit">{{value}}</label> | |
| 294 </template> | |
| 295 <label class="edit-label" on-double-click="edit">one (unchecked)</label> | 339 <label class="edit-label" on-double-click="edit">one (unchecked)</label> |
| 296 | 340 |
| 297 <template bind="" if="{{editing}}"> | 341 <template bind="" if="{{editing}}"></template> |
| 298 <form on-submit="update"> | 342 </shadow-root></span> |
| 299 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC
ancel"> | |
| 300 </form> | |
| 301 </template> | |
| 302 </shadow-root></div> | |
| 303 <button class="destroy" on-click="removeTodo"></button> | 343 <button class="destroy" on-click="removeTodo"></button> |
| 304 </div> | 344 </div> |
| 305 </shadow-root></li> | 345 </shadow-root></li> |
| 306 | 346 |
| 307 <li is="todo-row" todo="{{}}"><shadow-root> | 347 <li is="todo-row" todo="{{}}"><shadow-root> |
| 308 | 348 <style scoped=""> |
| 309 <style> | |
| 310 .todo-item { | 349 .todo-item { |
| 311 position: relative; | 350 position: relative; |
| 312 font-size: 24px; | 351 font-size: 24px; |
| 313 border-bottom: 1px dotted #ccc; | 352 border-bottom: 1px dotted #ccc; |
| 314 } | 353 } |
| 354 |
| 315 .todo-item.editing { | 355 .todo-item.editing { |
| 316 border-bottom: none; | 356 border-bottom: none; |
| 317 padding: 0; | 357 padding: 0; |
| 318 } | 358 } |
| 359 |
| 360 /* |
| 361 TODO(jmesserly): the ".todo-item label" selector does not work with real |
| 362 ShadowRoot because it crosses the shadow boundary. |
| 363 */ |
| 319 .todo-item.completed [is=editable-label] { | 364 .todo-item.completed [is=editable-label] { |
| 320 color: #a9a9a9; | 365 color: #a9a9a9; |
| 321 text-decoration: line-through; | 366 text-decoration: line-through; |
| 322 } | 367 } |
| 368 |
| 323 .todo-item .toggle { | 369 .todo-item .toggle { |
| 324 text-align: center; | 370 text-align: center; |
| 325 width: 40px; | 371 width: 40px; |
| 372 /* auto, since non-WebKit browsers don't support input styling */ |
| 326 height: auto; | 373 height: auto; |
| 327 position: absolute; | 374 position: absolute; |
| 328 top: 0; | 375 top: 0; |
| 329 bottom: 0; | 376 bottom: 0; |
| 330 margin: auto 0; | 377 margin: auto 0; |
| 331 border: none; | 378 border: none; /* Mobile Safari */ |
| 332 -webkit-appearance: none; | 379 -webkit-appearance: none; |
| 380 /*-moz-appearance: none;*/ |
| 333 -ms-appearance: none; | 381 -ms-appearance: none; |
| 334 -o-appearance: none; | 382 -o-appearance: none; |
| 335 appearance: none; | 383 appearance: none; |
| 336 } | 384 } |
| 385 |
| 337 .todo-item .toggle:after { | 386 .todo-item .toggle:after { |
| 338 content: "✔"; | 387 content: '✔'; |
| 339 line-height: 43px; | 388 line-height: 43px; /* 40 + a couple of pixels visual adjustment */ |
| 340 font-size: 20px; | 389 font-size: 20px; |
| 341 color: #d9d9d9; | 390 color: #d9d9d9; |
| 342 text-shadow: 0 -1px 0 #bfbfbf; | 391 text-shadow: 0 -1px 0 #bfbfbf; |
| 343 } | 392 } |
| 393 |
| 344 .todo-item .toggle:checked:after { | 394 .todo-item .toggle:checked:after { |
| 345 color: #85ada7; | 395 color: #85ada7; |
| 346 text-shadow: 0 1px 0 #669991; | 396 text-shadow: 0 1px 0 #669991; |
| 347 bottom: 1px; | 397 bottom: 1px; |
| 348 position: relative; | 398 position: relative; |
| 349 } | 399 } |
| 350 .todo-item .destroy { | 400 .todo-item .destroy { |
| 351 display: none; | 401 display: none; |
| 352 position: absolute; | 402 position: absolute; |
| 353 top: 0; | 403 top: 0; |
| 354 right: 10px; | 404 right: 10px; |
| 355 bottom: 0; | 405 bottom: 0; |
| 356 width: 40px; | 406 width: 40px; |
| 357 height: 40px; | 407 height: 40px; |
| 358 margin: auto 0; | 408 margin: auto 0; |
| 359 font-size: 22px; | 409 font-size: 22px; |
| 360 color: #a88a8a; | 410 color: #a88a8a; |
| 361 -webkit-transition: all 0.2s; | 411 -webkit-transition: all 0.2s; |
| 362 -moz-transition: all 0.2s; | 412 -moz-transition: all 0.2s; |
| 363 -ms-transition: all 0.2s; | 413 -ms-transition: all 0.2s; |
| 364 -o-transition: all 0.2s; | 414 -o-transition: all 0.2s; |
| 365 transition: all 0.2s; | 415 transition: all 0.2s; |
| 366 } | 416 } |
| 417 |
| 367 .todo-item .destroy:hover { | 418 .todo-item .destroy:hover { |
| 368 text-shadow: 0 0 1px #000, 0 0 10px rgba(199, 107, 107, 0.8); | 419 text-shadow: 0 0 1px #000, |
| 420 0 0 10px rgba(199, 107, 107, 0.8); |
| 369 -webkit-transform: scale(1.3); | 421 -webkit-transform: scale(1.3); |
| 370 -moz-transform: scale(1.3); | 422 -moz-transform: scale(1.3); |
| 371 -ms-transform: scale(1.3); | 423 -ms-transform: scale(1.3); |
| 372 -o-transform: scale(1.3); | 424 -o-transform: scale(1.3); |
| 373 transform: scale(1.3); | 425 transform: scale(1.3); |
| 374 } | 426 } |
| 427 |
| 375 .todo-item .destroy:after { | 428 .todo-item .destroy:after { |
| 376 content: "✖"; | 429 content: '✖'; |
| 377 } | 430 } |
| 431 |
| 378 .todo-item:hover .destroy { | 432 .todo-item:hover .destroy { |
| 379 display: block; | 433 display: block; |
| 380 } | 434 } |
| 381 .todo-item.editing .destroy, .todo-item.editing .toggle { | 435 |
| 436 .todo-item.editing .destroy, |
| 437 .todo-item.editing .toggle { |
| 382 display: none; | 438 display: none; |
| 383 } | 439 } |
| 440 |
| 384 .todo-item.editing:last-child { | 441 .todo-item.editing:last-child { |
| 385 margin-bottom: -1px; | 442 margin-bottom: -1px; |
| 386 } @media screen AND (-webkit-min-device-pixel-ratio:0) { | |
| 387 .todo-item .toggle { | |
| 388 background: none; | |
| 389 } | 443 } |
| 390 #todo-item .toggle { | 444 |
| 391 height: 40px; | 445 /* |
| 446 Hack to remove background from Mobile Safari. |
| 447 Can't use it globally since it destroys checkboxes in Firefox and Opera |
| 448 */ |
| 449 @media screen and (-webkit-min-device-pixel-ratio:0) { |
| 450 .todo-item .toggle { |
| 451 background: none; |
| 452 } |
| 453 #todo-item .toggle { |
| 454 height: 40px; |
| 455 } |
| 392 } | 456 } |
| 393 } | 457 </style> |
| 394 </style><div class="todo-item"> | 458 <div class="todo-item"> |
| 395 <input class="toggle" type="checkbox"> | 459 <input class="toggle" type="checkbox"> |
| 396 <div is="editable-label" id="label" value="{{todo.task}}"><shadow-root> | 460 <span is="editable-label" id="label" value="{{todo.task}}"><shadow-root> |
| 397 <template bind="" if="{{notEditing}}"> | 461 <template bind="" if="{{!editing}}"></template> |
| 398 <label class="edit-label" on-double-click="edit">{{value}}</label> | |
| 399 </template> | |
| 400 <label class="edit-label" on-double-click="edit">two (unchecked)</label> | 462 <label class="edit-label" on-double-click="edit">two (unchecked)</label> |
| 401 | 463 |
| 402 <template bind="" if="{{editing}}"> | 464 <template bind="" if="{{editing}}"></template> |
| 403 <form on-submit="update"> | 465 </shadow-root></span> |
| 404 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC
ancel"> | |
| 405 </form> | |
| 406 </template> | |
| 407 </shadow-root></div> | |
| 408 <button class="destroy" on-click="removeTodo"></button> | 466 <button class="destroy" on-click="removeTodo"></button> |
| 409 </div> | 467 </div> |
| 410 </shadow-root></li> | 468 </shadow-root></li> |
| 411 | 469 |
| 412 <li is="todo-row" todo="{{}}"><shadow-root> | 470 <li is="todo-row" todo="{{}}"><shadow-root> |
| 413 | 471 <style scoped=""> |
| 414 <style> | |
| 415 .todo-item { | 472 .todo-item { |
| 416 position: relative; | 473 position: relative; |
| 417 font-size: 24px; | 474 font-size: 24px; |
| 418 border-bottom: 1px dotted #ccc; | 475 border-bottom: 1px dotted #ccc; |
| 419 } | 476 } |
| 477 |
| 420 .todo-item.editing { | 478 .todo-item.editing { |
| 421 border-bottom: none; | 479 border-bottom: none; |
| 422 padding: 0; | 480 padding: 0; |
| 423 } | 481 } |
| 482 |
| 483 /* |
| 484 TODO(jmesserly): the ".todo-item label" selector does not work with real |
| 485 ShadowRoot because it crosses the shadow boundary. |
| 486 */ |
| 424 .todo-item.completed [is=editable-label] { | 487 .todo-item.completed [is=editable-label] { |
| 425 color: #a9a9a9; | 488 color: #a9a9a9; |
| 426 text-decoration: line-through; | 489 text-decoration: line-through; |
| 427 } | 490 } |
| 491 |
| 428 .todo-item .toggle { | 492 .todo-item .toggle { |
| 429 text-align: center; | 493 text-align: center; |
| 430 width: 40px; | 494 width: 40px; |
| 495 /* auto, since non-WebKit browsers don't support input styling */ |
| 431 height: auto; | 496 height: auto; |
| 432 position: absolute; | 497 position: absolute; |
| 433 top: 0; | 498 top: 0; |
| 434 bottom: 0; | 499 bottom: 0; |
| 435 margin: auto 0; | 500 margin: auto 0; |
| 436 border: none; | 501 border: none; /* Mobile Safari */ |
| 437 -webkit-appearance: none; | 502 -webkit-appearance: none; |
| 503 /*-moz-appearance: none;*/ |
| 438 -ms-appearance: none; | 504 -ms-appearance: none; |
| 439 -o-appearance: none; | 505 -o-appearance: none; |
| 440 appearance: none; | 506 appearance: none; |
| 441 } | 507 } |
| 508 |
| 442 .todo-item .toggle:after { | 509 .todo-item .toggle:after { |
| 443 content: "✔"; | 510 content: '✔'; |
| 444 line-height: 43px; | 511 line-height: 43px; /* 40 + a couple of pixels visual adjustment */ |
| 445 font-size: 20px; | 512 font-size: 20px; |
| 446 color: #d9d9d9; | 513 color: #d9d9d9; |
| 447 text-shadow: 0 -1px 0 #bfbfbf; | 514 text-shadow: 0 -1px 0 #bfbfbf; |
| 448 } | 515 } |
| 516 |
| 449 .todo-item .toggle:checked:after { | 517 .todo-item .toggle:checked:after { |
| 450 color: #85ada7; | 518 color: #85ada7; |
| 451 text-shadow: 0 1px 0 #669991; | 519 text-shadow: 0 1px 0 #669991; |
| 452 bottom: 1px; | 520 bottom: 1px; |
| 453 position: relative; | 521 position: relative; |
| 454 } | 522 } |
| 455 .todo-item .destroy { | 523 .todo-item .destroy { |
| 456 display: none; | 524 display: none; |
| 457 position: absolute; | 525 position: absolute; |
| 458 top: 0; | 526 top: 0; |
| 459 right: 10px; | 527 right: 10px; |
| 460 bottom: 0; | 528 bottom: 0; |
| 461 width: 40px; | 529 width: 40px; |
| 462 height: 40px; | 530 height: 40px; |
| 463 margin: auto 0; | 531 margin: auto 0; |
| 464 font-size: 22px; | 532 font-size: 22px; |
| 465 color: #a88a8a; | 533 color: #a88a8a; |
| 466 -webkit-transition: all 0.2s; | 534 -webkit-transition: all 0.2s; |
| 467 -moz-transition: all 0.2s; | 535 -moz-transition: all 0.2s; |
| 468 -ms-transition: all 0.2s; | 536 -ms-transition: all 0.2s; |
| 469 -o-transition: all 0.2s; | 537 -o-transition: all 0.2s; |
| 470 transition: all 0.2s; | 538 transition: all 0.2s; |
| 471 } | 539 } |
| 540 |
| 472 .todo-item .destroy:hover { | 541 .todo-item .destroy:hover { |
| 473 text-shadow: 0 0 1px #000, 0 0 10px rgba(199, 107, 107, 0.8); | 542 text-shadow: 0 0 1px #000, |
| 543 0 0 10px rgba(199, 107, 107, 0.8); |
| 474 -webkit-transform: scale(1.3); | 544 -webkit-transform: scale(1.3); |
| 475 -moz-transform: scale(1.3); | 545 -moz-transform: scale(1.3); |
| 476 -ms-transform: scale(1.3); | 546 -ms-transform: scale(1.3); |
| 477 -o-transform: scale(1.3); | 547 -o-transform: scale(1.3); |
| 478 transform: scale(1.3); | 548 transform: scale(1.3); |
| 479 } | 549 } |
| 550 |
| 480 .todo-item .destroy:after { | 551 .todo-item .destroy:after { |
| 481 content: "✖"; | 552 content: '✖'; |
| 482 } | 553 } |
| 554 |
| 483 .todo-item:hover .destroy { | 555 .todo-item:hover .destroy { |
| 484 display: block; | 556 display: block; |
| 485 } | 557 } |
| 486 .todo-item.editing .destroy, .todo-item.editing .toggle { | 558 |
| 559 .todo-item.editing .destroy, |
| 560 .todo-item.editing .toggle { |
| 487 display: none; | 561 display: none; |
| 488 } | 562 } |
| 563 |
| 489 .todo-item.editing:last-child { | 564 .todo-item.editing:last-child { |
| 490 margin-bottom: -1px; | 565 margin-bottom: -1px; |
| 491 } @media screen AND (-webkit-min-device-pixel-ratio:0) { | |
| 492 .todo-item .toggle { | |
| 493 background: none; | |
| 494 } | 566 } |
| 495 #todo-item .toggle { | 567 |
| 496 height: 40px; | 568 /* |
| 569 Hack to remove background from Mobile Safari. |
| 570 Can't use it globally since it destroys checkboxes in Firefox and Opera |
| 571 */ |
| 572 @media screen and (-webkit-min-device-pixel-ratio:0) { |
| 573 .todo-item .toggle { |
| 574 background: none; |
| 575 } |
| 576 #todo-item .toggle { |
| 577 height: 40px; |
| 578 } |
| 497 } | 579 } |
| 498 } | 580 </style> |
| 499 </style><div class="todo-item completed"> | 581 <div class="todo-item completed"> |
| 500 <input class="toggle" type="checkbox"> | 582 <input class="toggle" type="checkbox"> |
| 501 <div is="editable-label" id="label" value="{{todo.task}}"><shadow-root> | 583 <span is="editable-label" id="label" value="{{todo.task}}"><shadow-root> |
| 502 <template bind="" if="{{notEditing}}"> | 584 <template bind="" if="{{!editing}}"></template> |
| 503 <label class="edit-label" on-double-click="edit">{{value}}</label> | |
| 504 </template> | |
| 505 <label class="edit-label" on-double-click="edit">three (checked)</label> | 585 <label class="edit-label" on-double-click="edit">three (checked)</label> |
| 506 | 586 |
| 507 <template bind="" if="{{editing}}"> | 587 <template bind="" if="{{editing}}"></template> |
| 508 <form on-submit="update"> | 588 </shadow-root></span> |
| 509 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC
ancel"> | |
| 510 </form> | |
| 511 </template> | |
| 512 </shadow-root></div> | |
| 513 <button class="destroy" on-click="removeTodo"></button> | 589 <button class="destroy" on-click="removeTodo"></button> |
| 514 </div> | 590 </div> |
| 515 </shadow-root></li> | 591 </shadow-root></li> |
| 516 | 592 |
| 517 <li is="todo-row" todo="{{}}"><shadow-root> | 593 <li is="todo-row" todo="{{}}"><shadow-root> |
| 518 | 594 <style scoped=""> |
| 519 <style> | |
| 520 .todo-item { | 595 .todo-item { |
| 521 position: relative; | 596 position: relative; |
| 522 font-size: 24px; | 597 font-size: 24px; |
| 523 border-bottom: 1px dotted #ccc; | 598 border-bottom: 1px dotted #ccc; |
| 524 } | 599 } |
| 600 |
| 525 .todo-item.editing { | 601 .todo-item.editing { |
| 526 border-bottom: none; | 602 border-bottom: none; |
| 527 padding: 0; | 603 padding: 0; |
| 528 } | 604 } |
| 605 |
| 606 /* |
| 607 TODO(jmesserly): the ".todo-item label" selector does not work with real |
| 608 ShadowRoot because it crosses the shadow boundary. |
| 609 */ |
| 529 .todo-item.completed [is=editable-label] { | 610 .todo-item.completed [is=editable-label] { |
| 530 color: #a9a9a9; | 611 color: #a9a9a9; |
| 531 text-decoration: line-through; | 612 text-decoration: line-through; |
| 532 } | 613 } |
| 614 |
| 533 .todo-item .toggle { | 615 .todo-item .toggle { |
| 534 text-align: center; | 616 text-align: center; |
| 535 width: 40px; | 617 width: 40px; |
| 618 /* auto, since non-WebKit browsers don't support input styling */ |
| 536 height: auto; | 619 height: auto; |
| 537 position: absolute; | 620 position: absolute; |
| 538 top: 0; | 621 top: 0; |
| 539 bottom: 0; | 622 bottom: 0; |
| 540 margin: auto 0; | 623 margin: auto 0; |
| 541 border: none; | 624 border: none; /* Mobile Safari */ |
| 542 -webkit-appearance: none; | 625 -webkit-appearance: none; |
| 626 /*-moz-appearance: none;*/ |
| 543 -ms-appearance: none; | 627 -ms-appearance: none; |
| 544 -o-appearance: none; | 628 -o-appearance: none; |
| 545 appearance: none; | 629 appearance: none; |
| 546 } | 630 } |
| 631 |
| 547 .todo-item .toggle:after { | 632 .todo-item .toggle:after { |
| 548 content: "✔"; | 633 content: '✔'; |
| 549 line-height: 43px; | 634 line-height: 43px; /* 40 + a couple of pixels visual adjustment */ |
| 550 font-size: 20px; | 635 font-size: 20px; |
| 551 color: #d9d9d9; | 636 color: #d9d9d9; |
| 552 text-shadow: 0 -1px 0 #bfbfbf; | 637 text-shadow: 0 -1px 0 #bfbfbf; |
| 553 } | 638 } |
| 639 |
| 554 .todo-item .toggle:checked:after { | 640 .todo-item .toggle:checked:after { |
| 555 color: #85ada7; | 641 color: #85ada7; |
| 556 text-shadow: 0 1px 0 #669991; | 642 text-shadow: 0 1px 0 #669991; |
| 557 bottom: 1px; | 643 bottom: 1px; |
| 558 position: relative; | 644 position: relative; |
| 559 } | 645 } |
| 560 .todo-item .destroy { | 646 .todo-item .destroy { |
| 561 display: none; | 647 display: none; |
| 562 position: absolute; | 648 position: absolute; |
| 563 top: 0; | 649 top: 0; |
| 564 right: 10px; | 650 right: 10px; |
| 565 bottom: 0; | 651 bottom: 0; |
| 566 width: 40px; | 652 width: 40px; |
| 567 height: 40px; | 653 height: 40px; |
| 568 margin: auto 0; | 654 margin: auto 0; |
| 569 font-size: 22px; | 655 font-size: 22px; |
| 570 color: #a88a8a; | 656 color: #a88a8a; |
| 571 -webkit-transition: all 0.2s; | 657 -webkit-transition: all 0.2s; |
| 572 -moz-transition: all 0.2s; | 658 -moz-transition: all 0.2s; |
| 573 -ms-transition: all 0.2s; | 659 -ms-transition: all 0.2s; |
| 574 -o-transition: all 0.2s; | 660 -o-transition: all 0.2s; |
| 575 transition: all 0.2s; | 661 transition: all 0.2s; |
| 576 } | 662 } |
| 663 |
| 577 .todo-item .destroy:hover { | 664 .todo-item .destroy:hover { |
| 578 text-shadow: 0 0 1px #000, 0 0 10px rgba(199, 107, 107, 0.8); | 665 text-shadow: 0 0 1px #000, |
| 666 0 0 10px rgba(199, 107, 107, 0.8); |
| 579 -webkit-transform: scale(1.3); | 667 -webkit-transform: scale(1.3); |
| 580 -moz-transform: scale(1.3); | 668 -moz-transform: scale(1.3); |
| 581 -ms-transform: scale(1.3); | 669 -ms-transform: scale(1.3); |
| 582 -o-transform: scale(1.3); | 670 -o-transform: scale(1.3); |
| 583 transform: scale(1.3); | 671 transform: scale(1.3); |
| 584 } | 672 } |
| 673 |
| 585 .todo-item .destroy:after { | 674 .todo-item .destroy:after { |
| 586 content: "✖"; | 675 content: '✖'; |
| 587 } | 676 } |
| 677 |
| 588 .todo-item:hover .destroy { | 678 .todo-item:hover .destroy { |
| 589 display: block; | 679 display: block; |
| 590 } | 680 } |
| 591 .todo-item.editing .destroy, .todo-item.editing .toggle { | 681 |
| 682 .todo-item.editing .destroy, |
| 683 .todo-item.editing .toggle { |
| 592 display: none; | 684 display: none; |
| 593 } | 685 } |
| 686 |
| 594 .todo-item.editing:last-child { | 687 .todo-item.editing:last-child { |
| 595 margin-bottom: -1px; | 688 margin-bottom: -1px; |
| 596 } @media screen AND (-webkit-min-device-pixel-ratio:0) { | |
| 597 .todo-item .toggle { | |
| 598 background: none; | |
| 599 } | 689 } |
| 600 #todo-item .toggle { | 690 |
| 601 height: 40px; | 691 /* |
| 692 Hack to remove background from Mobile Safari. |
| 693 Can't use it globally since it destroys checkboxes in Firefox and Opera |
| 694 */ |
| 695 @media screen and (-webkit-min-device-pixel-ratio:0) { |
| 696 .todo-item .toggle { |
| 697 background: none; |
| 698 } |
| 699 #todo-item .toggle { |
| 700 height: 40px; |
| 701 } |
| 602 } | 702 } |
| 603 } | 703 </style> |
| 604 </style><div class="todo-item completed"> | 704 <div class="todo-item completed"> |
| 605 <input class="toggle" type="checkbox"> | 705 <input class="toggle" type="checkbox"> |
| 606 <div is="editable-label" id="label" value="{{todo.task}}"><shadow-root> | 706 <span is="editable-label" id="label" value="{{todo.task}}"><shadow-root> |
| 607 <template bind="" if="{{notEditing}}"> | 707 <template bind="" if="{{!editing}}"></template> |
| 608 <label class="edit-label" on-double-click="edit">{{value}}</label> | |
| 609 </template> | |
| 610 <label class="edit-label" on-double-click="edit">four (checked)</label> | 708 <label class="edit-label" on-double-click="edit">four (checked)</label> |
| 611 | 709 |
| 612 <template bind="" if="{{editing}}"> | 710 <template bind="" if="{{editing}}"></template> |
| 613 <form on-submit="update"> | 711 </shadow-root></span> |
| 614 <input id="edit" class="edit editing" on-blur="update" on-key-up="maybeC
ancel"> | |
| 615 </form> | |
| 616 </template> | |
| 617 </shadow-root></div> | |
| 618 <button class="destroy" on-click="removeTodo"></button> | 712 <button class="destroy" on-click="removeTodo"></button> |
| 619 </div> | 713 </div> |
| 620 </shadow-root></li> | 714 </shadow-root></li> |
| 621 | 715 |
| 622 </ul> | 716 </ul> |
| 623 </section> | 717 </section> |
| 624 <template bind="" if="{{app.hasTodos}}"> | 718 <template bind="" if="{{app.todos.length > 0}}"></template> |
| 625 <footer id="footer"> | |
| 626 <span id="todo-count"><strong>{{app.remaining}}</strong></span> | |
| 627 <ul is="router-options" id="filters"> | |
| 628 <li> <a href="#/">All</a> </li> | |
| 629 <li> <a href="#/active">Active</a> </li> | |
| 630 <li> <a href="#/completed">Completed</a> </li> | |
| 631 </ul> | |
| 632 <template bind="" if="{{app.hasCompleteTodos}}"> | |
| 633 <button id="clear-completed" on-click="clear"> | |
| 634 Clear completed ({{app.doneCount}}) | |
| 635 </button> | |
| 636 </template> | |
| 637 </footer> | |
| 638 </template> | |
| 639 <footer id="footer"> | 719 <footer id="footer"> |
| 640 <span id="todo-count"><strong>2</strong></span> | 720 <span id="todo-count"><strong>2</strong></span> |
| 641 <ul is="router-options" id="filters"><shadow-root><content></content></s
hadow-root> | 721 <ul is="router-options" id="filters"><shadow-root><content></content></s
hadow-root> |
| 642 <li> <a href="#/" class="selected">All</a> </li> | 722 <li> <a href="#/" class="selected">All</a> </li> |
| 643 <li> <a href="#/active" class="">Active</a> </li> | 723 <li> <a href="#/active" class="">Active</a> </li> |
| 644 <li> <a href="#/completed" class="">Completed</a> </li> | 724 <li> <a href="#/completed" class="">Completed</a> </li> |
| 645 </ul> | 725 </ul> |
| 646 <template bind="" if="{{app.hasCompleteTodos}}"></template> | 726 <template bind="" if="{{app.hasCompleteTodos}}"></template> |
| 647 <button id="clear-completed" on-click="clear"> | 727 <button id="clear-completed" on-click="clear"> |
| 648 Clear completed (2) | 728 Clear completed (2) |
| (...skipping 12 matching lines...) Expand all Loading... |
| 661 <a href="https://github.com/dart-lang/web-ui/tree/master/example/todomvc">
view the source</a>. | 741 <a href="https://github.com/dart-lang/web-ui/tree/master/example/todomvc">
view the source</a>. |
| 662 </p> | 742 </p> |
| 663 <p>Part of <a href="http://todomvc.com">TodoMVC</a>.</p> | 743 <p>Part of <a href="http://todomvc.com">TodoMVC</a>.</p> |
| 664 </footer> | 744 </footer> |
| 665 </shadow-root></span> | 745 </shadow-root></span> |
| 666 | 746 |
| 667 | 747 |
| 668 | 748 |
| 669 <script type="text/javascript" src="packages/shadow_dom/shadow_dom.debug.js"></s
cript> | 749 <script type="text/javascript" src="packages/shadow_dom/shadow_dom.debug.js"></s
cript> |
| 670 <script type="application/dart" src="todomvc_markdone_test.html_bootstrap.dart">
</script></body></html> | 750 <script type="application/dart" src="todomvc_markdone_test.html_bootstrap.dart">
</script></body></html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 22962005:
Merge pull request #581 from kevmoo/polymer (Closed)
Base URL: https://github.com/dart-lang/web-ui.git@polymer