diff --git a/step1-02/README.md b/step1-02/README.md index 0106361..f8aa83a 100644 --- a/step1-02/README.md +++ b/step1-02/README.md @@ -1,9 +1,9 @@ ## HTML and CSS +## Demo + +Scaffold out page + ## Exercise -1. Add an unordered list of class 'todos' after the filters -2. Add four todos. -3. Center the "TODO" header -4. Style all elements with button class to have no border and 5px padding top/bottom and 10px left/right -5. Set the active button style to have a 2px solid blue bottom border +Add and style footer diff --git a/step1-03/README.md b/step1-03/README.md new file mode 100644 index 0000000..be998f1 --- /dev/null +++ b/step1-03/README.md @@ -0,0 +1,18 @@ +Demo + +already done + +- addTodo +- filter +- filter() +- getTodoText + +Walk through 'addTodo' +attach addTodo to button +write clearInput/add to addTodo +write updateRemaining + +## Exercise + +write clearCompleted +add to footer button diff --git a/step1-03/index.html b/step1-03/index.html index 8e850ae..f24eea5 100644 --- a/step1-03/index.html +++ b/step1-03/index.html @@ -42,7 +42,7 @@ return document.querySelector('.textfield').value; } - function clearInput(selector) { + function clearInput() { document.querySelector('.textfield').value = ''; } diff --git a/step1-05/README.md b/step1-05/README.md new file mode 100644 index 0000000..10b6f23 --- /dev/null +++ b/step1-05/README.md @@ -0,0 +1,7 @@ +demo +Header +ListItem + +exercise +Footer +List diff --git a/step1-05/src/App.tsx b/step1-05/src/App.tsx index 5726b54..0f6e89a 100644 --- a/step1-05/src/App.tsx +++ b/step1-05/src/App.tsx @@ -3,16 +3,14 @@ import { TodoFooter } from './components/TodoFooter'; import { TodoHeader } from './components/TodoHeader'; import { TodoList } from './components/TodoList'; - export class TodoApp extends React.Component { render() { - return ( -