Sammy: project-happy-thoughts #436
Conversation
There was a problem hiding this comment.
I would like to start out by letting you know that you should be proud of this weeks work! You did a really good job and I'm super impressed by your structure.
There really isn't much negative to say about your code except for the word break in the single-thought container. That is all I would like to add.
Big high five on a great job with a tough assignment!
| setNewThought(event.target.value) | ||
| } | ||
|
|
||
| /* POSTS NEW THOUGHT AND UPDATES STATE */ |
| </div> | ||
| ); | ||
| } | ||
| } |
There was a problem hiding this comment.
Very nice structure in your App.js! Impressive!
| <p>Happy Thoughts made by <a href="https://www.linkedin.com/in/sammy-olsson/" target="_blank" rel="noreferrer">Sammy Olsson</a>, | ||
| Team-🐢 |
There was a problem hiding this comment.
Nice add with the contact information!
| const ThoughtForm = ({ newThought, onNewThoughtChange, onFormSubmit }) => { | ||
| const isSubmitButtonDisabled = newThought.length < 6 || newThought.length > 140; |
There was a problem hiding this comment.
Short and consistent code on the length parameters.
| <section className="form-section"> | ||
| <form className="form" onSubmit={onFormSubmit}> | ||
| <label className="label" htmlFor="thought-input"> | ||
| What's making you happy right now? |
| import React from 'react'; | ||
| import { formatDistanceToNow } from 'date-fns'; | ||
|
|
||
| const ThoughtList = ({ loading, thoughtList, handleLike }) => { |
There was a problem hiding this comment.
Very clear and structured code and props. Your code is easy to follow and understand.
| <div className="time-wrapper"> | ||
| <span className="time">{formatDistanceToNow( |
| } | ||
|
|
||
| .thought-input { | ||
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", |
There was a problem hiding this comment.
Do you need all these fonts? Perhaps make a --var in the beginning so you won't have to write as much code for each.
| margin: 1.5rem 1rem 1rem 1rem; | ||
| box-shadow: 0.5rem 0.5rem rgb(31, 31, 31); | ||
| padding: 2rem; | ||
| } |
There was a problem hiding this comment.
I suggest you try adding overflow-wrap: break-word; to your .single-though to break the words in the container. Now they are over flowing.
No description provided.