Akash Banchhor

Latest comments

• 

  Jayashree-26•40

  @Jayashree-26Submitted about 1 year ago

  

  Recipe Page

  #accessibility

  1

  20
  

  Akash Banchhor•230

  @akash02abPosted about 1 year ago

  Desktop View is looking Good!

  Need to optimize for mobile view.

  Few Suggestions:

  • Use consistent CSS naming conventions to make sure the styles are easily readable.
  • Use CSS variable to avoid repeating yourself. (makes it even more useful when you want to change something, you change it at one place)
  • Use semantic html such as main, section, article etc instead of using div's. Instead of <div class="container"> --> <main class="container"> is better of main content of the page.
  • Keep all the styles in one place (make it's easier to debug and good practice while working on a project with team). Instead of using inline style for margin-left it's better to put it in external css i.e. style.css

  Keep Up the good work. Happy Coding!! 👋

  0
• 

  Akash Banchhor•230

  @akash02abSubmitted about 1 year ago

  

  Result summary component solution

  #accessibility

  1

  50
  

  Akash Banchhor•230

  @akash02abPosted about 1 year ago

  Is screenshot broken cause I'm using nested CSS ?

  Can someone please confirm!

  0
• 

  charlisable•50

  @charlisableSubmitted about 1 year ago

  

  Mobile first responsive design

  1

  50
  

  Akash Banchhor•230

  @akash02abPosted about 1 year ago

  Looking good!

  Small suggesting increase the font-size of h1 element.

  h1 {
    font-size: 20px; ❌
    font-size: 22px; ✔️
  }
  

  Happy Coding!! 🎇

  PS: If you using images for your design consider using PerfectPixel extension to get the output as close as the design.

  0
• 

  P

  amersfoort3232•150

  @amersfoort3232Submitted about 1 year ago

  

  Advice Generator App using HTML and CSS

  1

  30
  

  Akash Banchhor•230

  @akash02abPosted about 1 year ago

  Looking good,

  Some improvements to match the design:

  • Divider SVG is non completely visible and it's position is off. (placement of svg should be exactly in between advice-text and dice-button)
  • Card's background color is off, it should be darker.
  • The hover effect on dice-button is missing.
  • Look at 'no-cache' attribute while fetching the data from AdviceSlip API, In some browsers (firefox) response is cached by default.

  0
• 

  Bhuvnesh Upadhayay•2,040

  @bhuvi819381Submitted about 1 year ago

  

  3-Column preview Card

  #tailwind-css

  1

  60
  

  Akash Banchhor•230

  @akash02abPosted about 1 year ago

  Good job! on desktop-view, but mobile-view need some work.

  1
• 

  Deivid Barreto•20

  @Deividb2Submitted about 1 year ago

  

  Advice generator using React with TypeScript and Tailwind CSS

  #axios#react#tailwind-css#typescript

  1

  30
  

  Akash Banchhor•230

  @akash02abPosted about 1 year ago

  Hi @Deividb2, great work on using semantic HTML elements.

  Few suggestions:

  • Give position: absolute; to the dice button to match the design. (the button is inside the card in your implementation, where it should be floating at the bottom-center)

  • Give higher border-radius to the card.

  • You may want to look no-cache attribute of axios, as Firefox browser store the advice as cache and new advice does not appear on button click, however it works perfectly fine on chrome and edge.

  0