Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
15
Comments
12
Adriverion
@Adriverion

All comments

  • Zeey76•200
    @Zeey76
    Submitted 8 months ago

    Rating Card

    1
    Adriverion•220
    @Adriverion
    Posted 8 months ago

    excelente solución

  • Mudasir Nadeem•430
    @mudasirNadeem
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?

    I’m most proud of the responsiveness and clean structure of the project. I approached the design with a mobile-first mindset, which allowed me to ensure that the user experience is optimized for all devices. The use of CSS Flexbox helped me maintain flexibility in the layout, and I successfully incorporated JavaScript logic to manage dynamic content and calculations, like percentage formulas.

    Next time, I would focus on improving the accessibility of the project by adding ARIA labels and enhancing keyboard navigation. Additionally, I plan to explore CSS Grid more deeply to see how it can complement Flexbox in creating more complex layouts.

    This reflects both your achievements and a plan for future growth. Let me know if you'd like any changes!

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

    One of the main challenges I encountered was ensuring the accuracy of calculations when dealing with percentages and dynamic user inputs. It was tricky to get the right formula to handle both tip calculations and total bill splits across multiple people. I resolved this by refining my understanding of JavaScript number handling, utilizing functions like parseFloat() and toFixed() to ensure the results were accurate and displayed correctly.

    Another challenge was ensuring the project remained fully responsive across various screen sizes. By adopting a mobile-first approach and utilizing CSS Flexbox, I was able to overcome layout issues. Through continuous testing and adjusting breakpoints, I ensured the design worked seamlessly on different devices.

    This highlights the obstacles you faced and how you tackled them, showing growth and problem-solving skills. Let me know if you'd like to add or modify anything!

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

    I would appreciate feedback on the accessibility of my project. While I focused on responsiveness and clean UI design, I want to ensure the website is accessible to all users, including those using screen readers or keyboard navigation. Specifically, I’m looking for advice on implementing ARIA attributes and any improvements I could make to the overall semantic structure of the HTML.

    Additionally, I’d like input on how to better optimize my JavaScript code, particularly for handling dynamic data and user inputs more efficiently. I’m also exploring CSS Grid to complement the Flexbox layout and would love any suggestions on improving my approach in areas where Grid might be more appropriate.

    This gives the community a clear direction on where they can help, leading to more valuable and specific feedback. Let me know if you'd like any adjustment

    tip-calculator-app-main

    1
    Adriverion•220
    @Adriverion
    Posted 9 months ago

    excelente solución

  • ItachiCodes•160
    @itachidevs
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?

    I am most proud of writing code for responsive.

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

    When Iam developing a grid template I felt difficult. After careful consideration I am able to do it.

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

    Grid Areas

    Time Tracking dashboard

    1
    Adriverion•220
    @Adriverion
    Posted 9 months ago

    buen trabajo

  • P
    EfthymiosK•390
    @EfthymiosK
    Submitted 9 months ago

    Newsletter sign-up form using CSS Flexbox and Javascript

    1
    Adriverion•220
    @Adriverion
    Posted 9 months ago

    excelente solución

  • Alex Santos•240
    @alexsantoswork
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?

    Consegui concluir o desafio construindo um lealt responsivo e com interações através do javascript, css e html, e depois de concluído vi que se escrevesse o código do arquivo html diferente, talvez usaria menos código no arquivo css.

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

    Na construção do código CSS responsivo, tive que fazer testes com tags diferentes para poder chegar no resultado final.

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

    Sei que o meu código não está 100% limpo, sei que posso melhorar nesse ponto, porém estou me aperfeiçoando com a prática e qualquer feedback é sempre bem-vindo.

    Cartão de Perfil Social

    1
    Adriverion•220
    @Adriverion
    Posted 9 months ago

    excelente resultado, me encantó

  • Abasifreke Jimmy•150
    @Abas-code
    Submitted 9 months ago
    What are you most proud of, and what would you do differently next time?

    I'm beginning to understand CSS Grid.

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

    I had issues with using flexbox and CSS Grid together.

    Testimonials grid section solution

    2
    Adriverion•220
    @Adriverion
    Posted 9 months ago

    excelente trabajo

    Marked as helpful
  • Marcus Daniels•160
    @marjsky
    Submitted 11 months ago

    Responsive four card feature section

    1
    Adriverion•220
    @Adriverion
    Posted 10 months ago

    what a great job, your solution is very similar to the design.

  • moonji-spoonji•280
    @moonji-spoonji
    Submitted 10 months ago
    What are you most proud of, and what would you do differently next time?

    I'm proud of how it turned out with trying out what I learned from the responsive design resources provided. Next time it'll hopefully be better structured!

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

    I had some trouble with the image responsiveness but these helped out:

    object-fit: cover;
    max-inline-size: 100%;
    block-size: auto;
    

    Perfume Preview Card (moonji)

    1
    Adriverion•220
    @Adriverion
    Posted 10 months ago

    buen trabajo

  • Vladislav Zenin•120
    @vladzen13
    Submitted 10 months ago
    What are you most proud of, and what would you do differently next time?

    Clean html, CSS Grid gaps, pretty simple media query

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

    list-style for ol with ::marker was quite tricky. Workaround with tag which is always first worked - it is not really clean, but works fine.

    Responsive Recipe Page with CSS Grid

    1
    Adriverion•220
    @Adriverion
    Posted 10 months ago

    Buen trabajo, como recomendación puedes utilizar figma y construir una grilla encima de la imagen del diseño para tener una mejor idea de los espaciados que se deben colocar en los ejercicios y tener mejores referencias en cuanto a los colores de los elementos

  • SantiagoAEM•30
    @SantiagoAEM
    Submitted 10 months ago

    Responsive landing page using flexbox

    1
    Adriverion•220
    @Adriverion
    Posted 10 months ago

    buen trabajo

  • BelaGereon•40
    @BelaGereon
    Submitted 10 months ago
    What are you most proud of, and what would you do differently next time?

    I really liked the idea of using custom CSS classes that give more control over the font-styling and using these classes in the HTML structure. This makes it easy to understand at first glance what exactly is going on in the code by only looking in the HTML and makes styling similar texts very easy and fast. All you have to do is add the correct CSS-class onto the HTML-Tag you want to style and you're done! Super convenient especially when working in bigger projects.

    Also I would like to experiment with using web-components within the next project, so it is even easier to reuse code and build an application with a uniform look.

    Blog Preview Card with basic CSS reset

    1
    Adriverion•220
    @Adriverion
    Posted 10 months ago

    excelente trabajo

  • NatteeN•70
    @NatteeN
    Submitted 10 months ago
    What are you most proud of, and what would you do differently next time?

    This is my first webpage using basic html and css. Next time I will be made a more complex html and css, and maybe javascript.

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

    When I develop this project. The challenges is with I start from scratch. With little experience with front-end. It can be challenges. My challenges is with how to made CSS working fit with the design document.

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

    There is any other way to make project like this with React or something else?

    QR code component with HTML and CSS

    2
    Adriverion•220
    @Adriverion
    Posted 10 months ago

    el código con respecto a medidas y colores pudieron haberse agregado custom properties, las cuales puede ser muy utiles cuando se realizan ajustes en los tamaños

Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub