Skip to content
OverviewSolutions
6
Comments
13

Veronika Palto

@JepardMay355 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

I’m currently learning...

React

Latest solutions

Latest comments

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

    I’m most proud of a recent project where I work on changing theme and give unique styling to the project. This experience helped me grow because it required a lot of dedication, attention to detail, and adaptability. It was satisfying to see the impact my effort had on the outcome and how it helped others in some way. Looking back, I would focus even more on getting feedback early in the process. While the project was a success, I realized that input from others could have improved our results and made the process smoother. I’m now more proactive about asking for feedback early and throughout any project. That way, I can learn and adapt as I go, ensuring an even better final result

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

    One significant challenge I encountered was challenged during styling and changing theme of project and I overcome it by learning more about and using my mind .

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

    In this project, I'd like help with CSS grid, flexbox and DOM. I believe that having guidance in this area could help me develop a more robust approach and overcome certain challenges I’ve faced, such as how to change theme and how I use CSS grid.

    Calculator-app-main

    1
    Veronika Palto•355
    @JepardMay

    Hi! Nice work! Here are some suggestions:

    • make sure that user can't input more than one symbol in a row or more than one dot per number
    • reduce buttons gaps on mobile to give it some space to breath, overall mobile version can have a bit more work

    Hope this helps!

    Marked as helpful
  • Sameema Nasrin•130
    @SameemaNasrin
    What are you most proud of, and what would you do differently next time?

    I’m really proud of the fact that I managed to quickly find a workaround for the resizing issue in my result div. I added a max-width and set overflow: hidden, which stopped the layout from breaking when the numbers got too large. It’s not perfect, but it did the job for now. Next time, I’d probably try to come up with a more scalable solution that doesn’t limit the content visibility. Something more dynamic that adapts as the number grows would be ideal, so the layout stays intact without cutting off any data.

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

    The biggest challenge was that as the numbers in the result div grew, they stretched the container, throwing off the layout and making things look messy. To fix this, I used max-width to cap the div size and added overflow: hidden to prevent the content from overflowing. It was a quick fix, but I realized it’s not the most elegant or long-term solution, so I’d like to improve it moving forward.

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

    I'm looking for a cleaner way to handle dynamic content resizing. Currently, I'm using a max-width with overflow: hidden, but it feels like more of a workaround than a permanent solution. I’m wondering if there’s a more elegant and flexible layout approach that could better handle this, without compromising the responsiveness of the design. Any suggestions or guidance on how to improve this would be really helpful!

    Responsive Calculator App using Flexbox, Media query and DOM operation

    #pure-css
    3
    Veronika Palto•355
    @JepardMay

    Hi! Nice work on this one! I've got some notes on your solution:

    • adaptive styles are changing too early from mobile to desktop, and therefore it's very squished on 375px screen
    • you also can have max-width and width: 100%; to allow the element not to shrink when it's plenty of space available
    • I think it's better to use something like word-break: all; to allow big numbers to wrap other than cuts off by the container
  • Lubos Jurca•290
    @lubosJurca
    What are you most proud of, and what would you do differently next time?

    I am very proud to complete this challenge! It's not exactly what it should look like, but I tried to put it a little differently. A complex application - authentication, CRUD operations, light/dark mode, two languages to choose from, animations, pagination... I'm satisfied.

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

    I had to learn the complete basics of the backend, specifically the MERN stack. It was a challenge, but it gave me a lot!

    MERN stack app.

    #express#mongodb#node#react#typescript
    1
    Veronika Palto•355
    @JepardMay

    That's very impressive! I like the scale of it and everything seems to work. Screenwise also looks good, and I especially like mobile animations for the invoice.

    The only minor issue I can see is that some interactive elements like page buttons, logout button, and language buttons don't have cursor: pointer; but other than that nice work!

  • Veronika Palto•355
    @JepardMay

    Hello. The easiest way to align stats is using flexbox https://gyazo.com/66422e28c2ec3b3d4246a440957d7a48

    Marked as helpful
  • Veronika Palto•355
    @JepardMay

    Hi! Nice work with this project. Found some things that can be fixed:

    • The page doesn't look good before mobile breakpoint https://gyazo.com/b1842ccec3bd06218dd196ae0c5066e9. Maybe it's worth changing the breakpoint earlier. Also, an icon in the second input goes wild.

    • When you choose custom input whole section hops because of the border. An easy solution is to set the border by default, make it transparent, and change border-color on hover and focus.

    • In the JS file I see that you use the same code twice. Try to create a function, that contains that code, and use it when you need it. All lines of actions that can be used more than one (even only in theory) are worth putting in separate functions as an option.

    Marked as helpful
  • Veronika Palto•355
    @JepardMay

    Hello. I found that on 320px the bottom-container is going off the container https://gyazo.com/eeecf9eff43a38588d60a1c7c77f1c88. 320px is a minimum width that is worth checking. About your second question. Browser engines are quite different from one another. If you want to know more about it, read about browser rendering.

View more comments