Mars - Martiniano Leguizamon

Latest comments

• 

  Sena Abodan•80

  @Ss-e-N-aaSubmitted about 2 months ago

  What are you most proud of, and what would you do differently next time?

  I created two components , one for the Card and one SuccessCard for the success message after submission .

  i used useState to get hold of the email input with help of FormData and another useState for the errors .

  then i conditionally rendered whats shown on screen based on a third useState in the App component , by passing two props to the Card and SuccessCard.

  What specific areas of your project would you like help with?

  i am open to suggestions on improvements or if there are other simpler ways to do this challenge .

  i could not replicate the same design and i could use some help with that .

  

  Newsletter signup form using React

  #react

  1

  20
  

  P

  Mars - Martiniano Leguizamon•255

  @martinianolPosted 21 days ago

  Hi Sena It would have been nice to pass the entered email to the SuccessCard. Just pass it as a prop.

  Need to work on the responsiveness between mobile and desktop

  0
• 

  P

  Scott•310

  @ldgSubmitted about 1 month ago

  What are you most proud of, and what would you do differently next time?

  I'm happy I got the javascript to work on this. I also tried something new on this project and used Sass Mixins to create utility classes from the text presets in the figma files. I saw how useful that can be, so I intend to explore mixins more as I progress.

  What challenges did you encounter, and how did you overcome them?

  I struggled with the transition between the different viewport sizes, thinking I needed a javascript solution. After trying separate functions for mobile, tablet and desktop, I realized I could accomplish what I need with media queries instead. That simplified everything.

  

  Vanilla Javascript, Sass Article Preview Component

  #sass/scss

  1

  10
  

  P

  Mars - Martiniano Leguizamon•255

  @martinianolPosted about 1 month ago

  Hey mate. Liked the solution and that you used rem. Agree on your comment about using BEM. The SCSS is too nested.

  Minor detail: The Share text in the tooltip should be UPPERCASE.

  Good job

  Marked as helpful

  0
• 

  P

  Coder-Liz•400

  @Coder-LizSubmitted about 2 months ago

  What specific areas of your project would you like help with?

  I am not really sure if I completed this challenge correctly, specifically in the hero section. I used display: block on the left and right images, and I used the clamp() function on the gap.

  

  Responsive Meet landing page

  #sass/scss

  1

  10
  

  P

  Mars - Martiniano Leguizamon•255

  @martinianolPosted about 1 month ago

  Hey Liz Check the responsiveness in your code. The tablet and mobile version aren't that accurate.

  Regardin the hero images I used display: none for mobile version and then display: block at a break point of 800px.

  0
• 

  P

  fringe4life•160

  @fringe4lifeSubmitted about 2 months ago

  What are you most proud of, and what would you do differently next time?

  I would not reuse the nth-child() selector, while it was good practise, it did not produce clean CSS.

  I am quite happy with using Grid template areas in this it made things quite nice and easy

  What challenges did you encounter, and how did you overcome them?

  Didn't encounter any particularly difficult challenges.

  Just the usual bugs and misspelled selectors etc.

  What specific areas of your project would you like help with?

  any feedback is welcome

  

  Responsive Testimonials using CSS Grid

  1

  00
  

  P

  Mars - Martiniano Leguizamon•255

  @martinianolPosted about 2 months ago

  Well done

  1
• 

  P

  emawid•120

  @emawidSubmitted 2 months ago

  What are you most proud of, and what would you do differently next time?

  Used clamp(min, ideal value, max) and grid to implement a fluid design between mobile and desktop

  

  Four card responsive grid

  #vite

  1

  00
  

  P

  Mars - Martiniano Leguizamon•255

  @martinianolPosted 2 months ago

  Good job ema. Clamp is great

  Same comment as previous project. Remove unnecesary boiler plate code from vite. Its confusing when checking the code.

  Visuals: "Our Artificial..." text is a bit bolder than design General its all a bit lower

  0
• 

  P

  emawid•120

  @emawidSubmitted 2 months ago

  What challenges did you encounter, and how did you overcome them?

  1. First I used srcset to load the images but it required a page refresh to change the image when going back and forth between mobile and desktop. Solved problem with <picture>.
  2. Implemnted the cart icon as a background image which was very neat but struggled to position it at first before i found background-position with a relative (%) offset from left.

  

  Product preview

  #vite

  1

  00
  

  P

  Mars - Martiniano Leguizamon•255

  @martinianolPosted 2 months ago

  Hi ema Your solution looks good. Congrats

  I don't understand why you use react to create the project and then did everything on an html (index.html) and css code components.css

  Next time, try it with React or at least clean all the unused code from the vite boilerplate. Cheers

  0