Ylvas ToDo-project Week 11 #446
Conversation
There was a problem hiding this comment.
Great job Ylva, I'm impressed by how ambitious your approach to this project was! Everything looks great, the date is in a nice format, a lot of extra functions and functionality. Maybe you can try later to make the categories work, then I will be happy to learn how you made it work!
code/src/App.js
Outdated
|
|
||
| // ctrl + c inside the terminal to stop the liveServer |
There was a problem hiding this comment.
Nice that you write such comments but I think our final code should be without comments, however, I strongly advise you to make a separate google sheet - docs - where you put all your coding notes ;)
code/src/redux/reducers/todos.js
Outdated
| id: '189438fdjhrjejioe9845', | ||
| name: 'ToDo1', | ||
| isNew: false | ||
| }, | ||
| { | ||
| id: '189438fdjhrjejioe9846', | ||
| name: 'ToDo2', | ||
| isNew: false | ||
| }, | ||
| { | ||
| id: '189438fdjhrjejioe9847', | ||
| name: 'ToDo3', | ||
| isNew: false | ||
| } |
There was a problem hiding this comment.
you can also start your list with no to-dos by making an empty array, like:
const initialState = {
items: [ ]
}
code/public/index.html
Outdated
| Favicon provided free from Icons8 - here you can reed more about the usage of this in your own projects | ||
| https://icons8.com/license | ||
| Notice the use of %PUBLIC_URL% in the tags above. | ||
| It will be replaced with the URL of the `public` folder during the build. | ||
| Only files inside the `public` folder can be referenced from the HTML. |
There was a problem hiding this comment.
this is such a great thing to add credits in the html, commented out.
code/src/components/AddToDo.js
Outdated
| const NewToDo = styled.form` | ||
| line-height: 0.5rem; | ||
| padding-bottom: 0.8rem; | ||
| `; | ||
|
|
||
| const Input = styled.input` | ||
| background: #a83256; | ||
| border: none; | ||
| padding: 8px; | ||
| font-size: 18px; | ||
| font-family: 'Baloo 2', cursive; | ||
| border-bottom: 2px dashed; | ||
| :focus { | ||
| outline: none; | ||
| } | ||
| `; | ||
|
|
||
| const AddButton = styled.button` | ||
| font-family: 'Baloo 2', cursive; | ||
| font-size: 18px; | ||
| border: none; | ||
| background: transparent; | ||
| cursor: pointer; | ||
| `; | ||
|
|
||
| export const AddToDo = () => { |
There was a problem hiding this comment.
nice that you like using styled-components! if you like different ways of styling you can read more about Sass or tailwind css :) Maybe you can also try to switch to rems, ems instead of px.
code/src/index.css
Outdated
| @@ -1,7 +1,12 @@ | |||
| @import url('https://fonts.googleapis.com/css2?family=DynaPuff:wght@400;600&display=swap'); | |||
|
|
|||
| body { | |||
| background: rgb(51,102,255); | |||
| background: linear-gradient(180deg, rgba(51,102,255,1) 0%, rgba(255,0,255,1) 100%); | |||
This was a fun week - finally!
Happy to be able to have a working project :D