Пікірлер

• 
  @marthinus.x8 күн бұрын

  A nice refresher, thank you for making this. Your narration is really good too, very clear and to the point.

• 
  @CodeSnapOnline6 күн бұрын

  Thanks for the support!

• 
  @raulriquelme473414 күн бұрын

  The best tutorial channel I have seen, the method you use, I think is the best... I hope you can upload more or a link where you offer a react course? thank you

• 
  @raulriquelme473414 күн бұрын

  The best tutorial channel I have seen, the method you use, I think is the best... I hope you can upload more or a link where you offer a react course? thank you

• 
  @raulriquelme473416 күн бұрын

  Your teaching is very good, it is pure gold, continue so I want to continue learning, thank you

• 
  @CodeSnapOnline15 күн бұрын

  Thank you! I am glad that you enjoyed the video :)

• 
  @baulcartoonhd16 күн бұрын

  I would be cool if you shared a link to the code instead of just pasting tens of lines of code out of nowhere...

• 
  @CodeSnapOnline15 күн бұрын

  I will make sure that I share a link for future projects, thank you for the feedback :)

• 
  @BenDoesGames17 күн бұрын

  For handlePopUp, could you not just setPopUp to !popUp. If the popUp is open, it'll set to false and close it, and the same for opening it.

• 
  @glennacasanova3584Ай бұрын

  😍 Promo`SM

• 
  @LafeSpaceАй бұрын

  I noticed the ToDoItem section was missing.

• 
  @CodeSnapOnline2 ай бұрын

  See below the App.css file for the project! .to-do-list { display: flex; flex-direction: column; align-items: center; } .to-do-container { display: flex; flex-direction: row; width: 96%; height: 88px; background-color: #FF4F4F; align-content: center; border-radius: 8px; margin-top: 8px; margin-bottom: 8px; padding-top: 8px; padding-bottom: 8px; } .to-do-container.completed { background-color: #ffabab; } .to-do-container:hover { border: 2px solid #4D4D4D; } .to-do-checkbox { color: white; font-size: 40px; height: 50px; width: 50px; text-align: center; align-self: center; line-height: 62px; margin-left: 8px; margin-right: 8px; } .to-do-text { color: white; font-size: 24px; height: fit-content; align-self: center; font-family: 'Open Sans'; font-weight: normal; margin-left: 0px; overflow-y: scroll; height: fit-content; max-height: 88px; width: 100% } /* Hide scrollbar for WebKit browsers (Chrome, Safari) */ .to-do-text::-webkit-scrollbar { display: none; } /* Optional: Hide scrollbar for Firefox */ .to-do-text { scrollbar-width: none; } .to-do-delete { background-color: #FF4F4F; border: none; color: white; font-size: 42px; height: 50px; width: 50px; text-align: center; align-self: center; line-height: 62px; margin-right: 12px; margin-left: auto; } .to-do-delete.completed { background-color: #ffabab; } .header-container { display: flex; flex-direction: column; } .header { height: 120px; margin-bottom: 6px; border-bottom: 4px solid #4D4D4D; width: 98%; align-self: center; display: flex; flex-direction: row; } .header-title { color: #4D4D4D; font-size: 56px; height: fit-content; align-self: center; font-family: 'Open Sans'; font-weight: normal; margin-left: 20px; } .header-add-task { background-color: #FF4F4F; width: 80px; height: 80px; align-self: center; border-radius: 8px; margin-right: 20px; margin-left: auto; display: flex; flex-direction: row; justify-content: center; } .header-add-task-text { color: white; align-self: center; font-size: 48px; line-height: 36px; } .pop-up-container { height: 100dvh; width: 100dvw; background-color: none; position: absolute; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, 0.8); margin-left: -8px; margin-top: -8px; } .pop-up { width: 80%; height: 50%; background-color: white; border-radius: 8px; display: flex; flex-direction: column; align-items: center; } .pop-up-title { color: #4D4D4D; font-size: 48px; height: fit-content; align-self: center; font-family: 'Open Sans'; font-weight: normal; margin-top: 12px; margin-bottom: 24px; text-align: center; padding-left: 12px; padding-right: 12px; } .pop-up-input { height: auto; margin-top: auto; margin-bottom: 12px; height: 100%; width: 90%; border: 2px solid #4D4D4D; border-radius: 8px; font-size: 32px; text-align: center; } .pop-up-button-container { height: fit-content; width: 100%; display: flex; flex-direction: row; align-items: center; justify-content: center; } .pop-up-button { color: #4D4D4D; font-size: 28px; height: fit-content; align-self: center; font-family: 'Open Sans'; font-weight: normal; margin-left: 8px; margin-right: 8px; border-radius: 8px; margin-bottom: 12px; padding: 8px; border: none; color: white; } .back { background-color: #FF4F4F; } .add { background-color: #00c31a; }

• 
  @Onur-iv8lt2 ай бұрын

  where is the css file?

• 
  @CodeSnapOnline2 ай бұрын

  I have just posted a pinned comment with the file, thank you for watching!

• 
  @johny_ginger2 ай бұрын

  Great, very good and simple explanation.

• 
  @johny_ginger2 ай бұрын

  Nice One. loved the video.

• 
  @mod_cyber10152 ай бұрын

  Pretty and concise

• 
  @beatricetinca63373 ай бұрын

  Best summary of React I’ve seen so far. Thank you!

• 
  @CodeSnapOnline2 ай бұрын

  Glad you enjoyed it!