Skip to content
OverviewSolutions
5
Comments
5

Aditya Nair

@AdityaNair07India90 points

Front-end Developer || React

Latest solutions

Latest comments

  • melanielogan74•140
    @melanielogan74
    What are you most proud of, and what would you do differently next time?

    My goal for this challenge was to use flex and grid for the responsive design, making sure to not rely on fixed widths or heights. Also, I used the picture tag to size the image for mobile and desktop without having to use media queries.

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

    I attempted to use portrait and landscape modes to accommodate users turning their devices in different directions, but I could not get it to work well for tablets, so I commented it out.

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

    I'd like to make the designs more responsive by using more automatic sizing for things like images and containers. I couldn't quite get it with the picture for this challenge. Also, I'd like to use the portrait and landscape media queries, but need help figuring out how to size for various devices.

    Product Preview Card Component

    1
    Aditya Nair•90
    @AdityaNair07

    Great work Melanie!! Hope to see more of such solutions😁

  • tathanz98•90
    @tathanz98
    What are you most proud of, and what would you do differently next time?

    Estoy más orgulloso de haber logrado un diseño totalmente responsivo que se adapta tanto a dispositivos móviles como a pantallas más grandes. Logré implementar correctamente las media queries para un diseño fluido. En el futuro, podría explorar técnicas como CSS Grid para mayor flexibilidad y experimentaría con preprocesadores como Sass para organizar mejor los estilos.

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

    El principal desafío fue manejar las diferencias de diseño entre la versión móvil y la de escritorio. Superé esto utilizando media queries y verificando constantemente cómo se veía el diseño en diferentes resoluciones. Además, ajustar el espaciado y las proporciones de las imágenes fue complicado, pero logré resolverlo utilizando object-fit y estableciendo proporciones adecuadas en el contenedor de las imágenes.

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

    Me gustaría recibir comentarios sobre cómo optimizar mejor el código CSS para reducir redundancias. También agradecería sugerencias sobre cómo hacer que el diseño sea más accesible y mejorar el rendimiento en dispositivos de baja capacidad.

    Flexbox Media Queries Metodología BEM opcional, si la utilizaste Diseñ

    #pure-css
    1
    Aditya Nair•90
    @AdityaNair07

    The pricing font is different. Other than that it looks nearly perfect.

  • JiggytheDev•150
    @JiggytheDev
    What are you most proud of, and what would you do differently next time?

    Being able to build a website that is responsive on all devices.

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

    I didn't encounter ansy challenges on this one.

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

    The preparation time section background color, i don't think it's the same with the one provided on the challenge. Maybe, it's my eye tho.

    Responsive recipe page

    #pure-css
    1
    Aditya Nair•90
    @AdityaNair07

    In my solution, the image shows a white space at bottom even after using object-fit cover and object-position center.

    Your solution seems nice.

    Marked as helpful
  • Yusuf Babatunde•310
    @owocoded
    What are you most proud of, and what would you do differently next time?

    I learnt more about pure css and will love to improve more on my pure css skills.

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

    I encounter little or no challenge during this project.

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

    Nothing specifically.

    social link profile

    #pure-css
    1
    Aditya Nair•90
    @AdityaNair07

    This is my personal opinion that if the card is horizontally shaped, the buttons should not be used; instead icons should be used. Just a friendly opinion. Feel free to provide your views on this😁

  • P
    Roberto Keppler•60
    @rkeppler42
    What are you most proud of, and what would you do differently next time?

    This is the second time I am doing this project and I am proud about learning the basics of media query and BEM

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

    I still am not 100% immerside in BEM and in mediaqueries. I had to research somethings, but that is great too. It makes it stick into your mind

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

    BEM Mediaqueries

    Blog preview card with BEM and mediaquery

    #bem#pure-css
    1
    Aditya Nair•90
    @AdityaNair07

    Pixel perfect one would say🤯

    Marked as helpful