I was able to build it better than i did before
What challenges did you encounter, and how did you overcome them?The logic for select only one percentage
What specific areas of your project would you like help with?Any advice would do
I don't know how the mortgage system works so I did the calculations as simple interest
Add a container with display flex and items-center and justify-center property. Otherwise everything looks good
I think you have uploaded wrong website.
adjust the max width it will be more close to design.Good work.
i was able to complete the project
What specific areas of your project would you like help with?inputs are welcome
that's very close to design, keep up the good work.
I am very proud because I managed to place some elements to the desired position with grid layout without using position: absolute. CSS grid is definitely an awesome tool!
What challenges did you encounter, and how did you overcome them?Making the desktop layout is something that I got struggled with. I constructed the mobile layout by using display grid with grid-template areas. I managed to do the desktop layout by erasing the grid template areas and using the grid-row and grid-col to place the elements
What specific areas of your project would you like help with?The typography size is something that I can't do I an efficient way espessially when the screen size gets too big or too small. I think that I need to study and see example of how to deal with this. Also I need to work on establishing correctly the sizes between grid rows and columns.
I have to say that even though this project uses React mainly for componentization rather than functionality, there is nothing restricted to React here. I use a single useState, so you could implement all this functionality with just a few lines of pure JavaScript.
What challenges did you encounter, and how did you overcome them?I spent most of the time understanding the design. I don't have the Figma file, but in any case, I found that opening the JPG image in Figma and drawing a lot of frames around images and text is very handy.
So, I broke the design into small pieces, created React components for each one of them, and then created a Sass file for each component. I also created some utility classes for those patterns that don’t belong to any specific component, and then made a lot of adjustments to make the fonts and paddings dynamic.
What specific areas of your project would you like help with?Feel free to give your opinion about the code, the solution design, the process I chose, the technology stack, the class names I wrote, or even my profile on this platform or GitHub. Any feedback will be valuable to me, as long as it has a reasoning behind it.
I have tried for first time to organized my css code.
What challenges did you encounter, and how did you overcome them?I have tried to put some animations in the main picture component. I had to change the opacity of the --cyan color in order to achieve.
What specific areas of your project would you like help with?I need to work a lot in order to name my css classes in a more efficient way.
I think I didn't spend enough time thinking about the design and wrote too many CSS code, I would spend more on design pattern next time !
What challenges did you encounter, and how did you overcome them?It was pretty challenging it was my first time writing this much code in a row !
What specific areas of your project would you like help with?any suggestion is welcome !
I started with the mobile layout first which was a mistake because when I tried to convert it to the grid layout it did not work as indented. I ended up starting over starting with the desktop layout.
Implementing the mobile navigation bar was simple.
Semantic HTML: Generally good but could use a few tweaks for improved meaning and accessibility. Accessibility: Decent but could be improved with better keyboard accessibility and contrast checks. Responsive Layout: Mostly good but might need some adjustments for medium-sized screens and a more fluid design approach. Code Quality: Reasonable, but event handling should be moved to the external JS file, and some inline styles should be avoided. Design Consistency: Appears consistent but would need to be checked against the original design for final tweaks.
Keep up the good work
