Merge pull request #1245 from arthurvr/completedCount

Remove completed count from first apps

browser-tests/test.js

@@ -262,12 +262,10 @@ module.exports.todoMVCTest = function (frameworkName, baseUrl, speedMode, laxMod
 
 
 		test.describe('Clear completed button', function () {
-			test.it('should display the number of completed items', function () {
+			test.it('should display the correct text', function () {
 				createStandardItems();
 				page.toggleItemAtIndex(1);
-				testOps.assertClearCompleteButtonText('Clear completed (1)');
-				page.toggleItemAtIndex(2);
-				testOps.assertClearCompleteButtonText('Clear completed (2)');
+				testOps.assertClearCompleteButtonText('Clear completed');
 			});
 
 			test.it('should remove completed items when clicked', function () {

examples/ampersand/index.html

@@ -30,7 +30,7 @@
                         <a href="#/completed" data-hook="completed-mode">Completed</a>
                     </li>
                 </ul>
-                <button id="clear-completed" data-hook="clear-completed">Clear completed (<span data-hook="completed-count">1</span>)</button>
+                <button id="clear-completed" data-hook="clear-completed">Clear completed</button>
             </footer>
         </section>
         <footer id="info">

examples/ampersand/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/angular-dart/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/angular-dart/web/index.html

@@ -39,7 +39,7 @@
 				<span id="todo-count"><strong>{{todo.remaining()}}</strong>
 					<ng-pluralize count="todo.remaining()" when="{ one: 'item left', other: 'items left' }"></ng-pluralize>
 				</span>
-				<button id="clear-completed" ng-click="todo.clearCompleted()" ng-if="todo.completed() > 0">Clear completed ({{todo.completed()}})</button>
+				<button id="clear-completed" ng-click="todo.clearCompleted()" ng-if="todo.completed() > 0">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/angularjs-perf/index.html

@@ -46,7 +46,7 @@
 						<a ng-class="{selected: location.path() == '/completed'}" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" ng-click="clearCompletedTodos()" ng-show="remainingCount < todos.length">Clear completed ({{todos.length - remainingCount}})</button>
+				<button id="clear-completed" ng-click="clearCompletedTodos()" ng-show="remainingCount < todos.length">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/angularjs-perf/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/angularjs/index.html

@@ -49,7 +49,7 @@
 							<a ng-class="{selected: status == 'completed'}" href="#/completed">Completed</a>
 						</li>
 					</ul>
-					<button id="clear-completed" ng-click="clearCompletedTodos()" ng-show="completedCount">Clear completed ({{completedCount}})</button>
+					<button id="clear-completed" ng-click="clearCompletedTodos()" ng-show="completedCount">Clear completed</button>
 				</footer>
 			</section>
 			<footer id="info">

examples/angularjs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/angularjs_require/index.html

@@ -49,7 +49,7 @@
 						<a ng-class="{selected: location.path() == '/completed'}" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" ng-click="clearDoneTodos()" ng-show="remainingCount < todos.length">Clear completed ({{todos.length - remainingCount}})</button>
+				<button id="clear-completed" ng-click="clearDoneTodos()" ng-show="remainingCount < todos.length">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/angularjs_require/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/ariatemplates/js/view/Todo.tpl

@@ -98,7 +98,7 @@
 
 	{macro itemsclear()}
 		{if data.itemscompleted > 0}
-			<button id="clear-completed" {on click "clearCompleted"/}>Clear completed (${data.itemscompleted})</button>
+			<button id="clear-completed" {on click "clearCompleted"/}>Clear completed</button>
 		{/if}
 	{/macro}
 

examples/ariatemplates/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/atmajs/js/app.mask

@@ -24,7 +24,7 @@ section #todoapp {
 
 			+if (status.completedCount > 0) {
 				button #clear-completed x-signal = 'click: removeAllCompleted' >
-					'Clear completed (~[bind:status.completedCount])'
+					'Clear completed'
 			}
 		}
 	}

examples/atmajs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/atmajs/package.json

@@ -7,6 +7,6 @@
     "maskjs": "^0.10.1",
     "ruta": "^0.1.12",
     "todomvc-common": "^1.0.1",
-    "todomvc-app-css": "^1.0.0",
+    "todomvc-app-css": "^1.0.0"
   }
 }

examples/backbone/index.html

@@ -46,7 +46,7 @@
 				</li>
 			</ul>
 			<% if (completed) { %>
-			<button id="clear-completed">Clear completed (<%= completed %>)</button>
+			<button id="clear-completed">Clear completed</button>
 			<% } %>
 		</script>
 		<script src="node_modules/todomvc-common/base.js"></script>

examples/backbone/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/backbone_marionette/index.html

@@ -37,7 +37,7 @@
 					<a href="#/completed">Completed</a>
 				</li>
 			</ul>
-			<button id="clear-completed" <% if (!completedCount) { %>class="hidden"<% } %>>Clear completed (<%= completedCount %>)</button>
+			<button id="clear-completed" <% if (!completedCount) { %>class="hidden"<% } %>>Clear completed</button>
 		</script>
 		<script type="text/html" id="template-header">
 			<h1>todos</h1>

examples/backbone_marionette/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/backbone_require/js/templates/stats.html

@@ -11,5 +11,5 @@
 	</li>
 </ul>
 <% if ( completed ) { %>
-<button id="clear-completed">Clear completed (<%= completed %>)</button>
+<button id="clear-completed">Clear completed</button>
 <% } %>

examples/backbone_require/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/canjs/index.html

@@ -48,7 +48,7 @@
 						<li>{{{link "Completed" "completed"}}}</li>
 					</ul>
 					<button id="clear-completed" class="{{^if todos.completed.length}}hidden{{/if}}" can-click="clearCompleted">
-						Clear completed ({{todos.completed.length}})
+						Clear completed
 					</button>
 				</footer>
 			</todo-app>

examples/canjs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/canjs_require/index.html

@@ -46,7 +46,7 @@
 						<li>{{{link "Completed" "completed"}}}</li>
 					</ul>
 					<button id="clear-completed" class="{{^if todos.completed.length}}hidden{{/if}}" can-click="clearCompleted">
-						Clear completed ({{todos.completed.length}})
+						Clear completed
 					</button>
 				</footer>
 			</todo-app>

examples/canjs_require/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/chaplin-brunch/app/views/footer-view.coffee

@@ -32,7 +32,6 @@ module.exports = class FooterView extends View
     countDescription = (if active is 1 then 'item' else 'items')
     @find('.todo-count-title').textContent = countDescription
 
-    @find('#completed-count').textContent = "(#{completed})"
     utils.toggle @find('#clear-completed'), completed > 0
     utils.toggle @el, total > 0
 

examples/chaplin-brunch/app/views/templates/footer.hbs

@@ -14,4 +14,4 @@
     <a href="#/completed">Completed</a>
   </li>
 </ul>
-<button id="clear-completed">Clear completed <span id="completed-count"></span></button>
+<button id="clear-completed">Clear completed</button>

examples/chaplin-brunch/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/chaplin-brunch/public/app.js

@@ -417,7 +417,6 @@ module.exports = FooterView = (function(_super) {
     this.find('#todo-count > strong').textContent = active;
     countDescription = (active === 1 ? 'item' : 'items');
     this.find('.todo-count-title').textContent = countDescription;
-    this.find('#completed-count').textContent = "(" + completed + ")";
     utils.toggle(this.find('#clear-completed'), completed > 0);
     return utils.toggle(this.el, total > 0);
   };
@@ -481,7 +480,7 @@ helpers = this.merge(helpers, Handlebars.helpers); data = data || {};
   
 
 
-  return "<span id=\"todo-count\">\n  <strong></strong>\n  <span class=\"todo-count-title\">items</span>\n  left\n</span>\n<ul id=\"filters\">\n  <li>\n    <a href=\"#/\">All</a>\n  </li>\n  <li>\n    <a href=\"#/active\">Active</a>\n  </li>\n  <li>\n    <a href=\"#/completed\">Completed</a>\n  </li>\n</ul>\n<button id=\"clear-completed\">Clear completed <span id=\"completed-count\"></span></button>\n";
+  return "<span id=\"todo-count\">\n  <strong></strong>\n  <span class=\"todo-count-title\">items</span>\n  left\n</span>\n<ul id=\"filters\">\n  <li>\n    <a href=\"#/\">All</a>\n  </li>\n  <li>\n    <a href=\"#/active\">Active</a>\n  </li>\n  <li>\n    <a href=\"#/completed\">Completed</a>\n  </li>\n</ul>\n<button id=\"clear-completed\">Clear completed</button>\n";
   });
 if (typeof define === 'function' && define.amd) {
   define([], function() {

examples/chaplin-brunch/public/app.js.map

-{"version":3,"sources":["app/application.coffee","app/controllers/index-controller.coffee","app/initialize.coffee","app/lib/utils.coffee","app/mediator.coffee","app/models/todo.coffee","app/models/todos.coffee","app/routes.coffee","app/views/base/collection-view.coffee","app/views/base/view.coffee","app/views/footer-view.coffee","app/views/header-view.coffee","app/views/templates/footer.hbs","app/views/templates/header.hbs","app/views/templates/todo.hbs","app/views/templates/todos.hbs","app/views/todo-view.coffee","app/views/todos-view.coffee"],"names":[],"mappings":"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","file":"public/app.js","sourcesContent":["mediator = require 'mediator'\nTodos = require 'models/todos'\n\n# The application object\nmodule.exports = class Application extends Chaplin.Application\n  # Set your application name here so the document title is set to\n  # “Controller title – Site title” (see Layout#adjustTitle)\n  title: 'Chaplin • TodoMVC'\n\n  # Create additional mediator properties\n  # -------------------------------------\n  initMediator: ->\n    # Add additional application-specific properties and methods\n    mediator.todos = new Todos()\n    # Seal the mediator\n    super\n\n  start: ->\n    # If todos are fetched from server, we will need to wait for them.\n    mediator.todos.fetch()\n    super\n","HeaderView = require '../views/header-view'\nFooterView = require '../views/footer-view'\nTodosView = require '../views/todos-view'\nmediator = require 'mediator'\n\nmodule.exports = class IndexController extends Chaplin.Controller\n  # The method is executed before any controller actions.\n  # We compose structure in order for it to be rendered only once.\n  beforeAction: ->\n    @reuse 'structure', ->\n      params = collection: mediator.todos\n      @header = new HeaderView params\n      @footer = new FooterView params\n\n  # On each new load, old @view will be disposed and\n  # new @view will be created. This is idiomatic Chaplin memory management:\n  # one controller per screen.\n  list: (params) ->\n    filterer = params.filterer?.trim() ? 'all'\n    @publishEvent 'todos:filter', filterer\n    @view = new TodosView collection: mediator.todos, filterer: (model) ->\n      switch filterer\n        when 'completed' then model.get('completed')\n        when 'active' then not model.get('completed')\n        else true\n","Application = require 'application'\nroutes = require 'routes'\n\n# Initialize the application on DOM ready event.\ndocument.addEventListener 'DOMContentLoaded', ->\n  new Application\n    controllerSuffix: '-controller', pushState: false, routes: routes\n, false\n","# Application-specific utilities\n# ------------------------------\n\n# Delegate to Chaplin’s utils module.\nutils = Chaplin.utils.beget Chaplin.utils\n\nBackbone.utils.extend utils,\n  toggle: (elem, visible) ->\n    elem.style.display = (if visible then '' else 'none')\n\n# Prevent creating new properties and stuff.\nObject.seal? utils\n\nmodule.exports = utils\n","module.exports = Chaplin.mediator\n","# It is a very good idea to have base Model / Collection\n# e.g. Model = require 'models/base/model'\n# But in this particular app since we only have one\n# model type, we will inherit directly from Chaplin Model.\nmodule.exports = class Todo extends Chaplin.Model\n  defaults:\n    title: ''\n    completed: no\n\n  initialize: ->\n    super\n    @set 'created', Date.now() if @isNew()\n\n  toggle: ->\n    @set completed: not @get('completed')\n\n  isVisible: ->\n    isCompleted = @get('completed')\n","Todo = require 'models/todo'\n\nmodule.exports = class Todos extends Chaplin.Collection\n  model: Todo\n  localStorage: new Store 'todos-chaplin'\n\n  allAreCompleted: ->\n    @getCompleted().length is @length\n\n  getCompleted: ->\n    @where completed: yes\n\n  getActive: ->\n    @where completed: no\n\n  comparator: (todo) ->\n    todo.get('created')\n","module.exports = (match) ->\n  match ':filterer', 'index#list'\n  match '', 'index#list'\n","View = require 'views/base/view'\n\nmodule.exports = class CollectionView extends Chaplin.CollectionView\n  # This class doesn’t inherit from the application-specific View class,\n  # so we need to borrow the method from the View prototype:\n  getTemplateFunction: View::getTemplateFunction\n  useCssAnimation: true\n","module.exports = class View extends Chaplin.View\n  # Precompiled templates function initializer.\n  getTemplateFunction: ->\n    @template\n","View = require './base/view'\nutils = require 'lib/utils'\n\nmodule.exports = class FooterView extends View\n  autoRender: true\n  el: '#footer'\n  events:\n    'click #clear-completed': 'clearCompleted'\n  listen:\n    'todos:filter mediator': 'updateFilterer'\n    'all collection': 'renderCounter'\n  template: require './templates/footer'\n\n  render: ->\n    super\n    @renderCounter()\n\n  updateFilterer: (filterer) ->\n    filterer = '' if filterer is 'all'\n    selector = \"[href='#/#{filterer}']\"\n    cls = 'selected'\n    @findAll('#filters a').forEach (link) =>\n      link.classList.remove cls\n      link.classList.add cls if Backbone.utils.matchesSelector link, selector\n\n  renderCounter: ->\n    total = @collection.length\n    active = @collection.getActive().length\n    completed = @collection.getCompleted().length\n\n    @find('#todo-count > strong').textContent = active\n    countDescription = (if active is 1 then 'item' else 'items')\n    @find('.todo-count-title').textContent = countDescription\n\n    @find('#completed-count').textContent = \"(#{completed})\"\n    utils.toggle @find('#clear-completed'), completed > 0\n    utils.toggle @el, total > 0\n\n  clearCompleted: ->\n    @publishEvent 'todos:clear'\n","View = require './base/view'\n\nmodule.exports = class HeaderView extends View\n  autoRender: true\n  el: '#header'\n  events:\n    'keypress #new-todo': 'createOnEnter'\n  template: require './templates/header'\n\n  createOnEnter: (event) ->\n    ENTER_KEY = 13\n    title = event.delegateTarget.value.trim()\n    return if event.keyCode isnt ENTER_KEY or not title\n    @collection.create {title}\n    @find('#new-todo').value = ''\n","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  \n\n\n  return \"<span id=\\\"todo-count\\\">\\n  <strong></strong>\\n  <span class=\\\"todo-count-title\\\">items</span>\\n  left\\n</span>\\n<ul id=\\\"filters\\\">\\n  <li>\\n    <a href=\\\"#/\\\">All</a>\\n  </li>\\n  <li>\\n    <a href=\\\"#/active\\\">Active</a>\\n  </li>\\n  <li>\\n    <a href=\\\"#/completed\\\">Completed</a>\\n  </li>\\n</ul>\\n<button id=\\\"clear-completed\\\">Clear completed <span id=\\\"completed-count\\\"></span></button>\\n\";\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  \n\n\n  return \"<h1>todos</h1>\\n<input id=\\\"new-todo\\\" placeholder=\\\"What needs to be done?\\\" autofocus>\\n\";\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  var buffer = \"\", stack1, helper, self=this, functionType=\"function\", escapeExpression=this.escapeExpression;\n\nfunction program1(depth0,data) {\n  \n  \n  return \" checked\";\n  }\n\n  buffer += \"<div class=\\\"view\\\">\\n  <input class=\\\"toggle\\\" type=\\\"checkbox\\\"\";\n  stack1 = helpers['if'].call(depth0, (depth0 && depth0.completed), {hash:{},inverse:self.noop,fn:self.program(1, program1, data),data:data});\n  if(stack1 || stack1 === 0) { buffer += stack1; }\n  buffer += \">\\n  <label>\";\n  if (helper = helpers.title) { stack1 = helper.call(depth0, {hash:{},data:data}); }\n  else { helper = (depth0 && depth0.title); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }\n  buffer += escapeExpression(stack1)\n    + \"</label>\\n  <button class=\\\"destroy\\\"></button>\\n</div>\\n<input class=\\\"edit\\\" value=\\\"\";\n  if (helper = helpers.title) { stack1 = helper.call(depth0, {hash:{},data:data}); }\n  else { helper = (depth0 && depth0.title); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }\n  buffer += escapeExpression(stack1)\n    + \"\\\">\\n\";\n  return buffer;\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  \n\n\n  return \"<input id=\\\"toggle-all\\\" type=\\\"checkbox\\\">\\n<label for=\\\"toggle-all\\\">Mark all as complete</label>\\n<ul id=\\\"todo-list\\\"></ul>\\n\";\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","View = require './base/view'\n\nmodule.exports = class TodoView extends View\n  events:\n    'click .toggle': 'toggle'\n    'dblclick label': 'edit'\n    'keyup .edit': 'save'\n    'focusout .edit': 'save'\n    'click .destroy': 'clear'\n\n  listen:\n    'change model': 'render'\n\n  template: require './templates/todo'\n  tagName: 'li'\n\n  render: ->\n    super\n    @toggleClass()\n\n  toggleClass: ->\n    isCompleted = @model.get('completed')\n    @el.classList.toggle 'completed', isCompleted\n\n  clear: ->\n    @model.destroy()\n\n  toggle: ->\n    @model.toggle().save()\n\n  edit: ->\n    @el.classList.add 'editing'\n    input = @find('.edit')\n    input.focus()\n    input.value = input.value;\n\n  save: (event) ->\n    ENTER_KEY = 13\n    title = event.delegateTarget.value.trim()\n    return @model.destroy() unless title\n    return if event.type is 'keyup' and event.keyCode isnt ENTER_KEY\n    @model.save {title}\n    @el.classList.remove 'editing'\n","CollectionView = require './base/collection-view'\nTodoView = require './todo-view'\nutils = require 'lib/utils'\n\nmodule.exports = class TodosView extends CollectionView\n  container: '#main'\n  events:\n    'click #toggle-all': 'toggleCompleted'\n  itemView: TodoView\n  listSelector: '#todo-list'\n  listen:\n    'all collection': 'renderCheckbox'\n    'todos:clear mediator': 'clear'\n  template: require './templates/todos'\n\n  render: ->\n    super\n    @renderCheckbox()\n\n  renderCheckbox: ->\n    @find('#toggle-all').checked = @collection.allAreCompleted()\n    utils.toggle @el, @collection.length isnt 0\n\n  toggleCompleted: (event) ->\n    isChecked = event.delegateTarget.checked\n    @collection.forEach (todo) -> todo.save completed: isChecked\n\n  clear: ->\n    @collection.getCompleted().forEach (model) ->\n      model.destroy()\n"]}
\ No newline at end of file
+{"version":3,"sources":["app/application.coffee","app/controllers/index-controller.coffee","app/initialize.coffee","app/lib/utils.coffee","app/mediator.coffee","app/models/todo.coffee","app/models/todos.coffee","app/routes.coffee","app/views/base/collection-view.coffee","app/views/base/view.coffee","app/views/footer-view.coffee","app/views/header-view.coffee","app/views/templates/footer.hbs","app/views/templates/header.hbs","app/views/templates/todo.hbs","app/views/templates/todos.hbs","app/views/todo-view.coffee","app/views/todos-view.coffee"],"names":[],"mappings":"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","file":"public/app.js","sourcesContent":["mediator = require 'mediator'\nTodos = require 'models/todos'\n\n# The application object\nmodule.exports = class Application extends Chaplin.Application\n  # Set your application name here so the document title is set to\n  # “Controller title – Site title” (see Layout#adjustTitle)\n  title: 'Chaplin • TodoMVC'\n\n  # Create additional mediator properties\n  # -------------------------------------\n  initMediator: ->\n    # Add additional application-specific properties and methods\n    mediator.todos = new Todos()\n    # Seal the mediator\n    super\n\n  start: ->\n    # If todos are fetched from server, we will need to wait for them.\n    mediator.todos.fetch()\n    super\n","HeaderView = require '../views/header-view'\nFooterView = require '../views/footer-view'\nTodosView = require '../views/todos-view'\nmediator = require 'mediator'\n\nmodule.exports = class IndexController extends Chaplin.Controller\n  # The method is executed before any controller actions.\n  # We compose structure in order for it to be rendered only once.\n  beforeAction: ->\n    @reuse 'structure', ->\n      params = collection: mediator.todos\n      @header = new HeaderView params\n      @footer = new FooterView params\n\n  # On each new load, old @view will be disposed and\n  # new @view will be created. This is idiomatic Chaplin memory management:\n  # one controller per screen.\n  list: (params) ->\n    filterer = params.filterer?.trim() ? 'all'\n    @publishEvent 'todos:filter', filterer\n    @view = new TodosView collection: mediator.todos, filterer: (model) ->\n      switch filterer\n        when 'completed' then model.get('completed')\n        when 'active' then not model.get('completed')\n        else true\n","Application = require 'application'\nroutes = require 'routes'\n\n# Initialize the application on DOM ready event.\ndocument.addEventListener 'DOMContentLoaded', ->\n  new Application\n    controllerSuffix: '-controller', pushState: false, routes: routes\n, false\n","# Application-specific utilities\n# ------------------------------\n\n# Delegate to Chaplin’s utils module.\nutils = Chaplin.utils.beget Chaplin.utils\n\nBackbone.utils.extend utils,\n  toggle: (elem, visible) ->\n    elem.style.display = (if visible then '' else 'none')\n\n# Prevent creating new properties and stuff.\nObject.seal? utils\n\nmodule.exports = utils\n","module.exports = Chaplin.mediator\n","# It is a very good idea to have base Model / Collection\n# e.g. Model = require 'models/base/model'\n# But in this particular app since we only have one\n# model type, we will inherit directly from Chaplin Model.\nmodule.exports = class Todo extends Chaplin.Model\n  defaults:\n    title: ''\n    completed: no\n\n  initialize: ->\n    super\n    @set 'created', Date.now() if @isNew()\n\n  toggle: ->\n    @set completed: not @get('completed')\n\n  isVisible: ->\n    isCompleted = @get('completed')\n","Todo = require 'models/todo'\n\nmodule.exports = class Todos extends Chaplin.Collection\n  model: Todo\n  localStorage: new Store 'todos-chaplin'\n\n  allAreCompleted: ->\n    @getCompleted().length is @length\n\n  getCompleted: ->\n    @where completed: yes\n\n  getActive: ->\n    @where completed: no\n\n  comparator: (todo) ->\n    todo.get('created')\n","module.exports = (match) ->\n  match ':filterer', 'index#list'\n  match '', 'index#list'\n","View = require 'views/base/view'\n\nmodule.exports = class CollectionView extends Chaplin.CollectionView\n  # This class doesn’t inherit from the application-specific View class,\n  # so we need to borrow the method from the View prototype:\n  getTemplateFunction: View::getTemplateFunction\n  useCssAnimation: true\n","module.exports = class View extends Chaplin.View\n  # Precompiled templates function initializer.\n  getTemplateFunction: ->\n    @template\n","View = require './base/view'\nutils = require 'lib/utils'\n\nmodule.exports = class FooterView extends View\n  autoRender: true\n  el: '#footer'\n  events:\n    'click #clear-completed': 'clearCompleted'\n  listen:\n    'todos:filter mediator': 'updateFilterer'\n    'all collection': 'renderCounter'\n  template: require './templates/footer'\n\n  render: ->\n    super\n    @renderCounter()\n\n  updateFilterer: (filterer) ->\n    filterer = '' if filterer is 'all'\n    selector = \"[href='#/#{filterer}']\"\n    cls = 'selected'\n    @findAll('#filters a').forEach (link) =>\n      link.classList.remove cls\n      link.classList.add cls if Backbone.utils.matchesSelector link, selector\n\n  renderCounter: ->\n    total = @collection.length\n    active = @collection.getActive().length\n    completed = @collection.getCompleted().length\n\n    @find('#todo-count > strong').textContent = active\n    countDescription = (if active is 1 then 'item' else 'items')\n    @find('.todo-count-title').textContent = countDescription\n\n    utils.toggle @find('#clear-completed'), completed > 0\n    utils.toggle @el, total > 0\n\n  clearCompleted: ->\n    @publishEvent 'todos:clear'\n","View = require './base/view'\n\nmodule.exports = class HeaderView extends View\n  autoRender: true\n  el: '#header'\n  events:\n    'keypress #new-todo': 'createOnEnter'\n  template: require './templates/header'\n\n  createOnEnter: (event) ->\n    ENTER_KEY = 13\n    title = event.delegateTarget.value.trim()\n    return if event.keyCode isnt ENTER_KEY or not title\n    @collection.create {title}\n    @find('#new-todo').value = ''\n","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  \n\n\n  return \"<span id=\\\"todo-count\\\">\\n  <strong></strong>\\n  <span class=\\\"todo-count-title\\\">items</span>\\n  left\\n</span>\\n<ul id=\\\"filters\\\">\\n  <li>\\n    <a href=\\\"#/\\\">All</a>\\n  </li>\\n  <li>\\n    <a href=\\\"#/active\\\">Active</a>\\n  </li>\\n  <li>\\n    <a href=\\\"#/completed\\\">Completed</a>\\n  </li>\\n</ul>\\n<button id=\\\"clear-completed\\\">Clear completed</button>\\n\";\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  \n\n\n  return \"<h1>todos</h1>\\n<input id=\\\"new-todo\\\" placeholder=\\\"What needs to be done?\\\" autofocus>\\n\";\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  var buffer = \"\", stack1, helper, self=this, functionType=\"function\", escapeExpression=this.escapeExpression;\n\nfunction program1(depth0,data) {\n  \n  \n  return \" checked\";\n  }\n\n  buffer += \"<div class=\\\"view\\\">\\n  <input class=\\\"toggle\\\" type=\\\"checkbox\\\"\";\n  stack1 = helpers['if'].call(depth0, (depth0 && depth0.completed), {hash:{},inverse:self.noop,fn:self.program(1, program1, data),data:data});\n  if(stack1 || stack1 === 0) { buffer += stack1; }\n  buffer += \">\\n  <label>\";\n  if (helper = helpers.title) { stack1 = helper.call(depth0, {hash:{},data:data}); }\n  else { helper = (depth0 && depth0.title); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }\n  buffer += escapeExpression(stack1)\n    + \"</label>\\n  <button class=\\\"destroy\\\"></button>\\n</div>\\n<input class=\\\"edit\\\" value=\\\"\";\n  if (helper = helpers.title) { stack1 = helper.call(depth0, {hash:{},data:data}); }\n  else { helper = (depth0 && depth0.title); stack1 = typeof helper === functionType ? helper.call(depth0, {hash:{},data:data}) : helper; }\n  buffer += escapeExpression(stack1)\n    + \"\\\">\\n\";\n  return buffer;\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","var __templateData = Handlebars.template(function (Handlebars,depth0,helpers,partials,data) {\n  this.compilerInfo = [4,'>= 1.0.0'];\nhelpers = this.merge(helpers, Handlebars.helpers); data = data || {};\n  \n\n\n  return \"<input id=\\\"toggle-all\\\" type=\\\"checkbox\\\">\\n<label for=\\\"toggle-all\\\">Mark all as complete</label>\\n<ul id=\\\"todo-list\\\"></ul>\\n\";\n  });\nif (typeof define === 'function' && define.amd) {\n  define([], function() {\n    return __templateData;\n  });\n} else if (typeof module === 'object' && module && module.exports) {\n  module.exports = __templateData;\n} else {\n  __templateData;\n}","View = require './base/view'\n\nmodule.exports = class TodoView extends View\n  events:\n    'click .toggle': 'toggle'\n    'dblclick label': 'edit'\n    'keyup .edit': 'save'\n    'focusout .edit': 'save'\n    'click .destroy': 'clear'\n\n  listen:\n    'change model': 'render'\n\n  template: require './templates/todo'\n  tagName: 'li'\n\n  render: ->\n    super\n    @toggleClass()\n\n  toggleClass: ->\n    isCompleted = @model.get('completed')\n    @el.classList.toggle 'completed', isCompleted\n\n  clear: ->\n    @model.destroy()\n\n  toggle: ->\n    @model.toggle().save()\n\n  edit: ->\n    @el.classList.add 'editing'\n    input = @find('.edit')\n    input.focus()\n    input.value = input.value;\n\n  save: (event) ->\n    ENTER_KEY = 13\n    title = event.delegateTarget.value.trim()\n    return @model.destroy() unless title\n    return if event.type is 'keyup' and event.keyCode isnt ENTER_KEY\n    @model.save {title}\n    @el.classList.remove 'editing'\n","CollectionView = require './base/collection-view'\nTodoView = require './todo-view'\nutils = require 'lib/utils'\n\nmodule.exports = class TodosView extends CollectionView\n  container: '#main'\n  events:\n    'click #toggle-all': 'toggleCompleted'\n  itemView: TodoView\n  listSelector: '#todo-list'\n  listen:\n    'all collection': 'renderCheckbox'\n    'todos:clear mediator': 'clear'\n  template: require './templates/todos'\n\n  render: ->\n    super\n    @renderCheckbox()\n\n  renderCheckbox: ->\n    @find('#toggle-all').checked = @collection.allAreCompleted()\n    utils.toggle @el, @collection.length isnt 0\n\n  toggleCompleted: (event) ->\n    isChecked = event.delegateTarget.checked\n    @collection.forEach (todo) -> todo.save completed: isChecked\n\n  clear: ->\n    @collection.getCompleted().forEach (model) ->\n      model.destroy()\n"]}
\ No newline at end of file

examples/derby/views/todos/index.html

@@ -54,7 +54,7 @@
 			</li>
 		</ul>
 		<button x-bind=click:clearCompleted id="clear-completed" class="{#unless _list.completed}non-completed{/}">
-			Clear completed (<span>{_list.completed.length}</span>)
+			Clear completed
 		</button>
 	</footer>
 

examples/dijon/js/views/FooterView.js

@@ -28,17 +28,13 @@
 			},
 			renderCounts: function( numTodosTotal, numTodosActive ) {
 				var numTodosCompleted = numTodosTotal - numTodosActive,
-					countTitle = '<strong>' + numTodosActive + '</strong> ' + this.pluralizeUtil.pluralize( numTodosActive, 'item' ) + ' left',
-					clearTitle = 'Clear completed (' + numTodosCompleted + ')';
+					countTitle = '<strong>' + numTodosActive + '</strong> ' + this.pluralizeUtil.pluralize( numTodosActive, 'item' ) + ' left';
 
 				// Only show the footer when there are at least one todo.
 				$footer.toggle( !!numTodosTotal );
 
-				// Active todo count
-				$count.html( countTitle );
-
-				// Toggle clear button and update title
-				$clearBtn.text( clearTitle ).toggle( !!numTodosCompleted );
+				// Toggle clear button
+				$clearBtn.toggle( !!numTodosCompleted );
 			}
 		};
 	};

examples/dijon/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/dojo/index.html

@@ -61,7 +61,7 @@
 								<a data-dojo-type="todo/widgets/CSSToggleWidget" data-dojo-props="_setSelectedAttr: {type: 'classExists'}, selected: at(this, 'status').transform(this.statusConverter), statusForElem: 'completed'" href="#/completed">Completed</a>
 							</li>
 						</ul>
-						<button id="clear-completed" data-dojo-type="dijit/_WidgetBase" data-dojo-attach-event="click: clearCompletedTodos" data-dojo-props="_setHiddenAttr: '', hidden: at(this, 'completedCount').transform(this.emptyConverter)">Clear completed (<span data-dojo-type="dojox/mvc/Element" data-dojo-props="innerText: at(this, 'completedCount')"></span>)</button>
+						<button id="clear-completed" data-dojo-type="dijit/_WidgetBase" data-dojo-attach-event="click: clearCompletedTodos" data-dojo-props="_setHiddenAttr: '', hidden: at(this, 'completedCount').transform(this.emptyConverter)">Clear completed</button>
 					</footer>
 				</section>
 			</script>

examples/dojo/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/durandal/js/views/list.html

@@ -31,6 +31,6 @@
 		</li>
 	</ul>
 	<button id="clear-completed" data-bind="visible: completedCount, click: removeCompleted">
-		Clear completed (<span data-bind="text: completedCount"></span>)
+		Clear completed
 	</button>
 </footer>

examples/emberjs/index.html

@@ -51,7 +51,7 @@
 								</li>
 							</ul>
 							{{#if completed.length}}
-								<button id="clear-completed" {{action "clearCompleted"}}>Clear completed ({{completed.length}})</button>
+								<button id="clear-completed" {{action "clearCompleted"}}>Clear completed</button>
 							{{/if}}
 						</footer>
 					{{/if}}

examples/emberjs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/epitome/index.html

@@ -49,7 +49,7 @@
 				</li>
 			</ul>
 			<% if (completed) { %>
-			<button id="clear-completed">Clear completed (<%=completed%>)</button>
+			<button id="clear-completed">Clear completed</button>
 			<% } %>
 		</script>
 		<script src="node_modules/todomvc-common/base.js"></script>

examples/epitome/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/exoskeleton/index.html

@@ -46,7 +46,7 @@
 				</li>
 			</ul>
 			<% if (completed) { %>
-			<button id="clear-completed">Clear completed (<%= completed %>)</button>
+			<button id="clear-completed">Clear completed</button>
 			<% } %>
 		</script>
 		<script src="node_modules/todomvc-common/base.js"></script>

examples/exoskeleton/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/extjs_deftjs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/extjs_deftjs/templates/todolist.tpl

@@ -30,7 +30,7 @@
         <footer id="footer">
             <span id="todo-count"><strong>{[ this.controller.incompleteCount() ]}</strong> {[ ( this.controller.incompleteCount() == 1 ) ? "item" : "items" ]} left</span>
             <tpl if="this.controller.completedCount()">
-                <button id="clear-completed" class="clearcompleted">Clear completed ({[ this.controller.completedCount() ]})</button>
+                <button id="clear-completed" class="clearcompleted">Clear completed</button>
             </tpl>
         </footer>
     </tpl>

examples/firebase-angular/index.html

@@ -46,7 +46,7 @@
 						<a ng-class="{selected: location.path() == '/completed'}" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" ng-click="clearCompletedTodos()" ng-show="completedCount">Clear completed ({{completedCount}})</button>
+				<button id="clear-completed" ng-click="clearCompletedTodos()" ng-show="completedCount">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/firebase-angular/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/flight/app/templates/stats.html

@@ -13,5 +13,5 @@
 	</li>
 </ul>
 <% if (completed) { %>
-<button id="clear-completed">Clear completed (<%= completed %>)</button>
+<button id="clear-completed">Clear completed</button>
 <% } %>

examples/flight/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/jquery/index.html

@@ -50,7 +50,7 @@
 					<a {{#eq filter 'completed'}}class="selected"{{/eq}}href="#/completed">Completed</a>
 				</li>
 			</ul>
-			{{#if completedTodos}}<button id="clear-completed">Clear completed ({{completedTodos}})</button>{{/if}}
+			{{#if completedTodos}}<button id="clear-completed">Clear completed</button>{{/if}}
 		</script>
 		<script src="node_modules/todomvc-common/base.js"></script>
 		<script src="node_modules/jquery/dist/jquery.js"></script>

examples/jquery/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/kendo/index.html

@@ -35,8 +35,8 @@
 			</ul>
 			<button id="clear-completed"
 				data-bind="click: destroyCompleted,
-							 visible: completedCount,
-							 text: clearCompletedText">
+							 visible: completedCount">
+				Clear completed
 			</button>
 			</footer>
 		</section>

examples/kendo/js/app.js

@@ -164,9 +164,6 @@ var app = app || {};
 		activeCountText: function () {
 			return this.activeCount() === 1 ? 'item' : 'items';
 		},
-		clearCompletedText: function () {
-			return 'Clear completed (' + this.completedCount() + ')';
-		},
 
 		// Class attribute bound methods
 		todoItemClass: function (item) {

examples/knockback/js/viewmodels/app.js

@@ -91,7 +91,7 @@
         return function() {
           var count;
           if ((count = _this.completed_count())) {
-            return "Clear completed (" + count + ")";
+            return "Clear completed";
           } else {
             return '';
           }

examples/knockback/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/knockoutjs/index.html

@@ -42,7 +42,7 @@
 						<a data-bind="css: { selected: showMode() == 'completed' }" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" data-bind="visible: completedCount, click: removeCompleted">Clear completed (<span data-bind="text: completedCount"></span>)</button>
+				<button id="clear-completed" data-bind="visible: completedCount, click: removeCompleted">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/knockoutjs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/knockoutjs_require/index.html

@@ -31,7 +31,7 @@
 					<strong data-bind="text: remainingCount">0</strong>
 					<span data-bind="text: getLabel(remainingCount)"></span> left
 				</span>
-				<button id="clear-completed" data-bind="visible: completedCount, click: removeCompleted">Clear completed (<span data-bind="text: completedCount"></span>)</button>
+				<button id="clear-completed" data-bind="visible: completedCount, click: removeCompleted">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/knockoutjs_require/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/lavaca_require/js/templates/todos.html

@@ -21,6 +21,6 @@
 				<a {@eq key=filter value="completed"}class="selected"{/eq} href="/completed">Completed</a>
 			</li>
 		</ul>
-		{@gt key=itemsCompleted value="0"}<button id="clear-completed">Clear completed ({itemsCompleted})</button>{/gt}
+		{@gt key=itemsCompleted value="0"}<button id="clear-completed">Clear completed</button>{/gt}
 	</footer>
 {/items}

examples/lavaca_require/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/meteor/app.html

@@ -60,7 +60,7 @@
 					{{/each}}
 		</ul>
 		{{#if todos_completed}}
-			<button id="clear-completed">Clear completed ({{todos_completed}})</button>
+			<button id="clear-completed">Clear completed</button>
 		{{/if}}
 	</footer>
 </template>

examples/mithril/js/views/footer-view.js

@@ -31,6 +31,6 @@ app.footer = function (ctrl) {
 			])
 		]), ctrl.amountCompleted() === 0 ? '' : m('button#clear-completed', {
 			onclick: ctrl.clearCompleted.bind(ctrl)
-		}, 'Clear completed (' + amountCompleted + ')')
+		}, 'Clear completed')
 	]);
 };

examples/mithril/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/olives/index.html

@@ -30,7 +30,7 @@
 			<footer id="footer" data-stats="bind:toggleClass,nbItems,show">
 				<span id="todo-count"><strong data-stats="bind:innerHTML,nbLeft">0</strong> <span data-stats="bind:innerHTML,plural"></span> left</span>
 				<button id="clear-completed" data-event="listen:click,delAll" data-stats="bind:toggleClass,nbCompleted,show">
-					Clear completed (<span data-stats="bind:innerHTML,nbCompleted"></span>)
+					Clear completed
 				</button>
 			</footer>
 		</section>

examples/olives/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/polymer/elements/td-todos.html

@@ -35,7 +35,7 @@
 						<a href="../#/completed">Completed</a>
 					</li>
 				</core-selector>
-				<button hidden?="{{model.completedCount == 0}}" id="clear-completed" on-click="{{clearCompletedAction}}">Clear completed ({{model.completedCount}})</button>
+				<button hidden?="{{model.completedCount == 0}}" id="clear-completed" on-click="{{clearCompletedAction}}">Clear completed</button>
 			</footer>
 		</section>
 	</template>

examples/puremvc/index.html

@@ -30,7 +30,7 @@
 						<a id="filterCompleted" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed">Clear completed (1)</button>
+				<button id="clear-completed">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/puremvc/js/view/component/TodoForm.js

@@ -259,7 +259,7 @@ puremvc.define({
 
 			updateClearButton: function() {
 				this.clearButton.style.display = ( this.stats.todoCompleted === 0 ) ? 'none' : 'block';
-				this.clearButton.innerHTML = 'Clear completed (' + this.stats.todoCompleted + ')';
+				this.clearButton.innerHTML = 'Clear completed';
 			},
 
 			updateTodoCount: function() {

examples/ractive/index.html

@@ -63,7 +63,7 @@
 					{{# completedTasks().length }}
 						<!-- When the user clicks this button, the `clearCompleted` event fires -->
 						<button id="clear-completed" on-click="clearCompleted">
-							Clear completed ({{ completedTasks().length }})
+							Clear completed
 						</button>
 					{{/ end of filter }}
 				</footer>

examples/ractive/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/react-backbone/js/footer.jsx

@@ -21,7 +21,7 @@ var app = app || {};
 					<button
 						id="clear-completed"
 						onClick={this.props.onClearCompleted}>
-						Clear completed ({this.props.completedCount})
+						Clear completed
 					</button>
 				);
 			}

examples/react-backbone/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/react/js/footer.jsx

@@ -18,7 +18,7 @@ var app = app || {};
 					<button
 						id="clear-completed"
 						onClick={this.props.onClearCompleted}>
-						Clear completed ({this.props.completedCount})
+						Clear completed
 					</button>
 				);
 			}

examples/react/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/sammyjs/templates/footer.template

@@ -12,4 +12,4 @@
 		<a <%= flag === 'completed' ? 'class=selected' : '' %> href="#/completed">Completed</a>
 	</li>
 </ul>
-<button id="clear-completed" <%= completedCount === 0 ? 'class=hidden' : '' %>>Clear completed (<%= completedCount %>)</button>
+<button id="clear-completed" <%= completedCount === 0 ? 'class=hidden' : '' %>>Clear completed</button>

examples/serenadejs/index.html

@@ -40,7 +40,7 @@
 								a.completed[class:selected=@filterCompleted href="#/completed"] "Completed"
 						- if @completedCount
 							button#clear-completed[event:click=clearCompleted]
-								"Clear completed (" @completedCount ")"
+								"Clear completed"
 		</script>
 
 		<script id="todo" type="text/serenade">

examples/serenadejs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/socketstream/client/templates/footer.html

@@ -13,5 +13,5 @@
 	</li>
 </ul>
 {{#completedTodos}}
-<button id="clear-completed">Clear completed ({{completedTodos}})</button>
+<button id="clear-completed">Clear completed</button>
 {{/completedTodos}}

examples/somajs/index.html

@@ -46,7 +46,7 @@
 						<a class="{{highlightFilter('completed')}}" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" data-show="{{clearCompletedVisible()}}" data-click="clearCompleted()">Clear completed ({{completed}})</button>
+				<button id="clear-completed" data-show="{{clearCompletedVisible()}}" data-click="clearCompleted()">Clear completed</button>
 			</footer>
 
 		</section>

examples/somajs/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/somajs_require/index.html

@@ -46,7 +46,7 @@
 						<a class="{{highlightFilter('completed')}}" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" data-show="{{clearCompletedVisible()}}" data-click="clearCompleted()">Clear completed ({{completed}})</button>
+				<button id="clear-completed" data-show="{{clearCompletedVisible()}}" data-click="clearCompleted()">Clear completed</button>
 			</footer>
 
 		</section>

examples/somajs_require/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/spine/js/app.js

-// Generated by CoffeeScript 1.7.1
+// Generated by CoffeeScript 1.9.1
 (function() {
   var TodoApp,
-    __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
-    __hasProp = {}.hasOwnProperty,
-    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+    bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
+    extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
+    hasProp = {}.hasOwnProperty;
 
-  TodoApp = (function(_super) {
+  TodoApp = (function(superClass) {
     var ENTER_KEY;
 
-    __extends(TodoApp, _super);
+    extend(TodoApp, superClass);
 
     ENTER_KEY = 13;
 
@@ -30,10 +30,10 @@
     };
 
     function TodoApp() {
-      this.renderFooter = __bind(this.renderFooter, this);
-      this.toggleElems = __bind(this.toggleElems, this);
-      this.addAll = __bind(this.addAll, this);
-      this.addNew = __bind(this.addNew, this);
+      this.renderFooter = bind(this.renderFooter, this);
+      this.toggleElems = bind(this.toggleElems, this);
+      this.addAll = bind(this.addAll, this);
+      this.addNew = bind(this.addNew, this);
       TodoApp.__super__.constructor.apply(this, arguments);
       Todo.bind('create', this.addNew);
       Todo.bind('refresh change', this.addAll);
@@ -45,7 +45,7 @@
           this.filter = param.filter;
 
           /*
-					TODO: Need to figure out why the route doesn't trigger `change` event
+          				TODO: Need to figure out why the route doesn't trigger `change` event
            */
           Todo.trigger('refresh');
           return this.filters.removeClass('selected').filter("[href='#/" + this.filter + "']").addClass('selected');
@@ -84,23 +84,23 @@
     };
 
     TodoApp.prototype.addAll = function() {
-      var todo, _i, _len, _ref, _results;
+      var i, len, ref, results, todo;
       this.todos.empty();
-      _ref = this.getByFilter();
-      _results = [];
-      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-        todo = _ref[_i];
-        _results.push(this.addNew(todo));
+      ref = this.getByFilter();
+      results = [];
+      for (i = 0, len = ref.length; i < len; i++) {
+        todo = ref[i];
+        results.push(this.addNew(todo));
       }
-      return _results;
+      return results;
     };
 
     TodoApp.prototype.toggleAll = function(e) {
       return Todo.each(function(todo) {
 
         /*
-				TODO: Model updateAttribute sometimes won't stick:
-					https://github.com/maccman/spine/issues/219
+        			TODO: Model updateAttribute sometimes won't stick:
+        				https://github.com/maccman/spine/issues/219
          */
         todo.updateAttribute('completed', e.target.checked);
         return todo.trigger('update', todo);
@@ -133,8 +133,7 @@
       };
       active = Todo.active().length;
       completed = Todo.completed().length;
-      this.count.html("<strong>" + active + "</strong> " + (text(active)) + " left");
-      return this.clearCompleted.text("Clear completed (" + completed + ")");
+      return this.count.html("<strong>" + active + "</strong> " + (text(active)) + " left");
     };
 
     return TodoApp;

examples/spine/js/controllers/todos.js

-// Generated by CoffeeScript 1.7.1
+// Generated by CoffeeScript 1.9.1
 (function() {
-  var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
-    __hasProp = {}.hasOwnProperty,
-    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+  var bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
+    extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
+    hasProp = {}.hasOwnProperty;
 
-  window.Todos = (function(_super) {
+  window.Todos = (function(superClass) {
     var ENTER_KEY, ESCAPE_KEY, TPL;
 
-    __extends(Todos, _super);
+    extend(Todos, superClass);
 
     ENTER_KEY = 13;
 
@@ -29,7 +29,7 @@
     };
 
     function Todos() {
-      this.render = __bind(this.render, this);
+      this.render = bind(this.render, this);
       Todos.__super__.constructor.apply(this, arguments);
       this.todo.bind('update', this.render);
       this.todo.bind('destroy', this.release);

examples/spine/js/models/todo.js

-// Generated by CoffeeScript 1.7.1
+// Generated by CoffeeScript 1.9.1
 (function() {
-  var __hasProp = {}.hasOwnProperty,
-    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+  var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
+    hasProp = {}.hasOwnProperty;
 
-  window.Todo = (function(_super) {
-    __extends(Todo, _super);
+  window.Todo = (function(superClass) {
+    extend(Todo, superClass);
 
     function Todo() {
       return Todo.__super__.constructor.apply(this, arguments);
@@ -27,14 +27,14 @@
     };
 
     Todo.destroyCompleted = function() {
-      var todo, _i, _len, _ref, _results;
-      _ref = this.completed();
-      _results = [];
-      for (_i = 0, _len = _ref.length; _i < _len; _i++) {
-        todo = _ref[_i];
-        _results.push(todo.destroy());
+      var i, len, ref, results, todo;
+      ref = this.completed();
+      results = [];
+      for (i = 0, len = ref.length; i < len; i++) {
+        todo = ref[i];
+        results.push(todo.destroy());
       }
-      return _results;
+      return results;
     };
 
     return Todo;

examples/spine/node_modules/todomvc-app-css/index.css

@@ -316,20 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	top: 0;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/spine/src/app.coffee

@@ -80,8 +80,6 @@ class TodoApp extends Spine.Controller
 		active = Todo.active().length
 		completed = Todo.completed().length
 		@count.html "<strong>#{ active }</strong> #{ text active } left"
-		@clearCompleted.text "Clear completed (#{ completed })"
-
 
 $ ->
 	new TodoApp el: $('#todoapp')

examples/typescript-angular/index.html

@@ -46,7 +46,7 @@
 						<a ng-class="{selected: location.path() == '/completed'}" href="#/completed">Completed</a>
 					</li>
 				</ul>
-				<button id="clear-completed" ng-click="vm.clearDoneTodos()" ng-show="doneCount">Clear completed ({{doneCount}})</button>
+				<button id="clear-completed" ng-click="vm.clearDoneTodos()" ng-show="doneCount">Clear completed</button>
 			</footer>
 		</section>
 		<footer id="info">

examples/typescript-angular/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/typescript-backbone/index.html

@@ -96,7 +96,7 @@ https://github.com/documentcloud/backbone/blob/master/examples/todos/index.html
 			<% } %>
 			<% if (completed) { %>
 				<span class="todo-clear">
-					<button id="clear-completed">Clear completed (<span class="number-done"><%= completed %></span>)</button>
+					<button id="clear-completed">Clear completed</button>
 				</span>
 			<% } %>
 		</script>

examples/typescript-backbone/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/vanilladart/build/web/dart/app.dart.js

@@ -4312,8 +4312,8 @@ z="<strong>"+x+"</strong> item"
 J.Qy(this.e,z+(x!==1?"s":"")+" left")
 z=this.f
 if(y===0)J.Y(z.style,"none")
-else{J.Y(z.style,"block")
-z.textContent="Clear completed ("+y+")"}this.nW()},
+else J.Y(z.style,"block")
+this.nW()},
 nW:function(){switch(window.location.hash){case"#/active":this.dK()
 break
 case"#/completed":this.bI()

examples/vanilladart/web/dart/TodoApp.dart

@@ -99,7 +99,6 @@ class TodoApp {
       clearCompletedElement.style.display = 'none';
     } else {
       clearCompletedElement.style.display = 'block';
-      clearCompletedElement.text = 'Clear completed ($complete)';
     }
     updateFilter();
   }

examples/vanillajs/js/template.js

@@ -102,7 +102,7 @@
 	 */
 	Template.prototype.clearCompletedButton = function (completedTodos) {
 		if (completedTodos > 0) {
-			return 'Clear completed (' + completedTodos + ')';
+			return 'Clear completed';
 		} else {
 			return '';
 		}

examples/vanillajs/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }
 

examples/vue/index.html

@@ -36,7 +36,7 @@
 					<li><a href="#/completed" v-class="selected: activeFilter == 'completed'">Completed</a></li>
 				</ul>
 				<button id="clear-completed" v-on="click:removeCompleted" v-show="todos.length > remaining">
-					Clear completed ({{todos.length - remaining}})
+					Clear completed
 				</button>
 			</footer>
 		</section>

examples/yui/index.html

@@ -50,7 +50,7 @@
 				</li>
 			</ul>
 			{{#if completed}}
-			<button id="clear-completed">Clear completed ({{completed}})</button>
+			<button id="clear-completed">Clear completed</button>
 			{{/if}}
 		</script>
 		<script src="node_modules/todomvc-common/base.js"></script>

examples/yui/node_modules/todomvc-app-css/index.css

@@ -15,11 +15,9 @@ button {
 	font-weight: inherit;
 	color: inherit;
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -33,7 +31,6 @@ body {
 	margin: 0 auto;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 	font-weight: 300;
 }
@@ -83,7 +80,6 @@ input[type="checkbox"] {
 	color: rgba(175, 47, 47, 0.15);
 	-webkit-text-rendering: optimizeLegibility;
 	-moz-text-rendering: optimizeLegibility;
-	-ms-text-rendering: optimizeLegibility;
 	text-rendering: optimizeLegibility;
 }
 
@@ -102,11 +98,9 @@ input[type="checkbox"] {
 	padding: 6px;
 	border: 1px solid #999;
 	box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-	-ms-box-sizing: border-box;
 	box-sizing: border-box;
 	-webkit-font-smoothing: antialiased;
 	-moz-font-smoothing: antialiased;
-	-ms-font-smoothing: antialiased;
 	font-smoothing: antialiased;
 }
 
@@ -191,7 +185,6 @@ label[for='toggle-all'] {
 	margin: auto 0;
 	border: none; /* Mobile Safari */
 	-webkit-appearance: none;
-	-ms-appearance: none;
 	appearance: none;
 }
 
@@ -323,19 +316,10 @@ html #clear-completed:active {
 	line-height: 20px;
 	text-decoration: none;
 	cursor: pointer;
-	visibility: hidden;
 	position: relative;
 }
 
-#clear-completed::after {
-	visibility: visible;
-	content: 'Clear completed';
-	position: absolute;
-	right: 0;
-	white-space: nowrap;
-}
-
-#clear-completed:hover::after {
+#clear-completed:hover {
 	text-decoration: underline;
 }