todomvc
Version:
> Helping you select an MV\* framework
95 lines (83 loc) • 2.1 kB
CSS
#clear-completed, #footer, #main,
.plural {
display: none;
}
#todoapp.todos_selected #clear-completed,
#todoapp.todos_present #footer,
#todoapp.todos_present #main,
.multiple .plural {
display: inherit;
}
#todo-list li.hidden {
display: none;
}
#todo-list li .toggle.dijitChecked:after {
color: #85ada7;
text-shadow: 0 1px 0 #669991;
bottom: 1px;
position: relative;
}
/* When checkbox is selected, score through todo item content */
.dijitCheckBoxChecked + .todo-content {
color: #666;
text-decoration: line-through;
}
/* When checkbox is selected, score through todo item content after an edit */
.dijitCheckBoxChecked + .dijitInline + .todo-content {
color: #666;
text-decoration: line-through;
}
#todo-list .dijitCheckBoxInput {
opacity: 0;
position: absolute;
top: 14px;
z-index: 10;
}
/** Match up inline edit box with styling */
.dijitInputInner {
position: relative;
margin: 0;
width: 100%;
font-size: 24px;
font-family: inherit;
line-height: 1.4em;
border: 0;
outline: none;
color: inherit;
padding: 6px;
border: 1px solid #999;
box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-font-smoothing: antialiased;
-ms-font-smoothing: antialiased;
-o-font-smoothing: antialiased;
font-smoothing: antialiased;
}
#todo-list li .dijitInputInner {
display: block;
width: 506px;
padding: 13px 17px 12px 17px;
margin: 0 0 0 43px;
z-index: 10;
}
/** Ugh, force override of edit container margin */
#todo-list li span.dijitInline {
margin: 0 ;
}
/**
* Inline edit box doesn't provide indication via class names
* when a box is 'live'. Style values are set manually. Use the
* opacity change as indicator... :( */
.inline_edit[style~='0;'] ~ .toggle {
visibility: hidden ;
}
.dijitOffScreen { /* For 1.8 in-line edit box */
position: absolute ;
left: 50% ;
top: -10000px ;
}