| Index: example/todomvc/test/expected/todomvc_mainpage_test.html.txt
|
| diff --git a/example/todomvc/test/expected/todomvc_mainpage_test.html.txt b/example/todomvc/test/expected/todomvc_mainpage_test.html.txt
|
| index 8548eb36ef1df9bba1037697f2b74dcbb28e7498..1ab9ce234a0ea3193a90478ede292c166183cb93 100644
|
| --- a/example/todomvc/test/expected/todomvc_mainpage_test.html.txt
|
| +++ b/example/todomvc/test/expected/todomvc_mainpage_test.html.txt
|
| @@ -23,42 +23,52 @@ option[template] {
|
| display: none;
|
| }</style></head><body><polymer-element name="todo-row" extends="li" attributes="todo">
|
| <template>
|
| -
|
| - <style>
|
| + <style scoped="">
|
| .todo-item {
|
| position: relative;
|
| font-size: 24px;
|
| border-bottom: 1px dotted #ccc;
|
| }
|
| +
|
| .todo-item.editing {
|
| border-bottom: none;
|
| padding: 0;
|
| }
|
| +
|
| +/*
|
| +TODO(jmesserly): the ".todo-item label" selector does not work with real
|
| +ShadowRoot because it crosses the shadow boundary.
|
| +*/
|
| .todo-item.completed [is=editable-label] {
|
| color: #a9a9a9;
|
| text-decoration: line-through;
|
| }
|
| +
|
| .todo-item .toggle {
|
| text-align: center;
|
| width: 40px;
|
| + /* auto, since non-WebKit browsers don't support input styling */
|
| height: auto;
|
| position: absolute;
|
| top: 0;
|
| bottom: 0;
|
| margin: auto 0;
|
| - border: none;
|
| + border: none; /* Mobile Safari */
|
| -webkit-appearance: none;
|
| + /*-moz-appearance: none;*/
|
| -ms-appearance: none;
|
| -o-appearance: none;
|
| appearance: none;
|
| }
|
| +
|
| .todo-item .toggle:after {
|
| - content: "✔";
|
| - line-height: 43px;
|
| + content: '✔';
|
| + line-height: 43px; /* 40 + a couple of pixels visual adjustment */
|
| font-size: 20px;
|
| color: #d9d9d9;
|
| text-shadow: 0 -1px 0 #bfbfbf;
|
| }
|
| +
|
| .todo-item .toggle:checked:after {
|
| color: #85ada7;
|
| text-shadow: 0 1px 0 #669991;
|
| @@ -82,36 +92,50 @@ option[template] {
|
| -o-transition: all 0.2s;
|
| transition: all 0.2s;
|
| }
|
| +
|
| .todo-item .destroy:hover {
|
| - text-shadow: 0 0 1px #000, 0 0 10px rgba(199, 107, 107, 0.8);
|
| + text-shadow: 0 0 1px #000,
|
| + 0 0 10px rgba(199, 107, 107, 0.8);
|
| -webkit-transform: scale(1.3);
|
| -moz-transform: scale(1.3);
|
| -ms-transform: scale(1.3);
|
| -o-transform: scale(1.3);
|
| transform: scale(1.3);
|
| }
|
| +
|
| .todo-item .destroy:after {
|
| - content: "✖";
|
| + content: '✖';
|
| }
|
| +
|
| .todo-item:hover .destroy {
|
| display: block;
|
| }
|
| -.todo-item.editing .destroy, .todo-item.editing .toggle {
|
| +
|
| +.todo-item.editing .destroy,
|
| +.todo-item.editing .toggle {
|
| display: none;
|
| }
|
| +
|
| .todo-item.editing:last-child {
|
| margin-bottom: -1px;
|
| -} @media screen AND (-webkit-min-device-pixel-ratio:0) {
|
| -.todo-item .toggle {
|
| - background: none;
|
| -}
|
| -#todo-item .toggle {
|
| - height: 40px;
|
| }
|
| +
|
| +/*
|
| + Hack to remove background from Mobile Safari.
|
| + Can't use it globally since it destroys checkboxes in Firefox and Opera
|
| +*/
|
| +@media screen and (-webkit-min-device-pixel-ratio:0) {
|
| + .todo-item .toggle {
|
| + background: none;
|
| + }
|
| + #todo-item .toggle {
|
| + height: 40px;
|
| + }
|
| }
|
| -</style><div class="todo-item">
|
| + </style>
|
| + <div class="todo-item">
|
| <input class="toggle" type="checkbox" checked="{{todo.done}}">
|
| - <div is="editable-label" id="label" value="{{todo.task}}"></div>
|
| + <span is="editable-label" id="label" value="{{todo.task}}"></span>
|
| <button class="destroy" on-click="removeTodo"></button>
|
| </div>
|
| </template>
|
| @@ -135,7 +159,7 @@ option[template] {
|
| </template>
|
| </ul>
|
| </section>
|
| - <template bind="" if="{{app.hasTodos}}">
|
| + <template bind="" if="{{app.todos.length > 0}}">
|
| <footer id="footer">
|
| <span id="todo-count"><strong>{{app.remaining}}</strong></span>
|
| <ul is="router-options" id="filters">
|
| @@ -169,9 +193,9 @@ option[template] {
|
| <template><content></content></template>
|
|
|
| </polymer-element>
|
| -<polymer-element name="editable-label" extends="div" attributes="value">
|
| +<polymer-element name="editable-label" attributes="value">
|
| <template>
|
| - <template bind="" if="{{notEditing}}">
|
| + <template bind="" if="{{!editing}}">
|
| <label class="edit-label" on-double-click="edit">{{value}}</label>
|
| </template>
|
| <template bind="" if="{{editing}}">
|
| @@ -195,26 +219,10 @@ option[template] {
|
| <input id="toggle-all" type="checkbox">
|
| <label for="toggle-all"></label>
|
| <ul id="todo-list">
|
| - <template repeat="{{app.visibleTodos}}">
|
| - <li is="todo-row" todo="{{}}"></li>
|
| - </template>
|
| + <template repeat="{{app.visibleTodos}}"></template>
|
| </ul>
|
| </section>
|
| - <template bind="" if="{{app.hasTodos}}">
|
| - <footer id="footer">
|
| - <span id="todo-count"><strong>{{app.remaining}}</strong></span>
|
| - <ul is="router-options" id="filters">
|
| - <li> <a href="#/">All</a> </li>
|
| - <li> <a href="#/active">Active</a> </li>
|
| - <li> <a href="#/completed">Completed</a> </li>
|
| - </ul>
|
| - <template bind="" if="{{app.hasCompleteTodos}}">
|
| - <button id="clear-completed" on-click="clear">
|
| - Clear completed ({{app.doneCount}})
|
| - </button>
|
| - </template>
|
| - </footer>
|
| - </template>
|
| + <template bind="" if="{{app.todos.length > 0}}"></template>
|
| </section>
|
| <footer id="info">
|
| <p>Double-click to edit a todo.</p>
|
|
|
Chromium Code Reviews
Issue 22962005:
Merge pull request #581 from kevmoo/polymer (Closed)
Base URL: https://github.com/dart-lang/web-ui.git@polymer