#todo-count span.word { font-weight: normal; } /* The GWT TodoMVC uses a CellList - a framework widget for rendering a list of cells - to render the list of todo items. Unfortunately the CellList uses a div as its root container and wraps each cell in a separate div. There are no extension points that allow you to change this. As a result, this application deviates from the TodoMVC standard of ul / li for the to do list. The styles applied to the li elements are duplicated here, matching a listItem class instead. */ #todo-list .listItem { padding: 18px 20px 18px 0; position: relative; font-size: 24px; border-bottom: 1px solid #cccccc; } #todo-list div :last-child .listItem { border-bottom: none; } #todo-list .listItem.done label { color: #777777; text-decoration: line-through; } #todo-list .listItem .destroy { display: none; position: absolute; top: 20px; right: 10px; cursor: pointer; width: 20px; height: 20px; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUBAMAAAB/pwA+AAAABGdBTUEAALGPC/xhBQAAACdQTFRFzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMAAAA////zMzMhnu0WAAAAAt0Uk5T5u3pqtV3jFQEKAC0bVelAAAAfUlEQVQI12NYtWpFsc8R865VqxhWrZpyBgg8QcylZ8AgCsjMgTCPrWJYfgYKqhjWwJgaDDVnzpw+c2bPmTPHGWzOnNm95/TuM2cOM/AARXfvBooeZAAp270bRCIz4QoOIGtDMqwJZoUEQzvCYrhzuhhWtUKYEahOX7UK6iEA3A6NUGwCTZIAAAAASUVORK5CYII=') no-repeat center center; } #todo-list .listItem:hover .destroy { display: block; } #todo-list .listItem.editing { border-bottom: none; margin-top: -1px; padding: 0; } #todo-list .listItem.editing:last-child { margin-bottom: -1px; } #todo-list .listItem.editing .edit { display: block; width: 444px; padding: 13px 15px 14px 20px; margin: 0; } #todo-list .listItem.editing .view { display: none; } #todo-list .listItem .view label { word-break: break-word; } #todo-list .listItem .edit { display: none; }