@mkostrikov
Latest comments
- @SimonHickling
This is very nice. Everything works as expected and it behaves very well on mobile etc. The only things that caught my eye are that it would be good to have some smooth transitions for the features items and the FAQs. Also, the FAQs maybe could have a but of a margin on mobile view, but that is just a preference thing. Nice work!
Marked as helpful - @SimonHickling@SimonHickling
Thanks for the help. Yes I completely missed the cursor:pointer on the submit button, not sure how I managed that!!
- @AchigyusWhat are you most proud of, and what would you do differently next time?
I learned how to setup a typescript project in vite and also how to use sass to write less css code through rule nesting
Some code I'm proud of:
.query_wrap border: 1px solid vars.$gray_500 border-radius: vars.$spacing_1 padding: 0.75rem 1.5rem font-size: 1.125rem line-height: 1.5 color: vars.$gray_900 display: flex gap: 0.75rem align-items: center flex: 1 1 0% &:hover border: 1px solid vars.$green_600 label font-size: 1.125rem line-height: 1.5 color: vars.$gray_900 cursor: pointer &:has(input[type="radio"]:checked), &:has(.querytype_input:focus-visible) background-color: vars.$green_200 border: 1px solid vars.$green_600
What specific areas of your project would you like help with?window.scroll({ top: 0, left: 0, behavior: 'smooth' })The accessibility
@SimonHicklingThis is very good work here. The only minor thing is that the original had an input:focus rule, giving the input fields a thicker and darker green outline. Apart from this, excellent work. I struggled with the radio and checked button icons, and ended up going about it a clumsy way, but yours seem perfect!
- @Oluwabillionz96@SimonHickling
This seems to work very well, and behaves well in different screens etc. The only minor thing is, it might look better if the map filled the entire reset of the vh. It looks a bit strange with the black at the bottom of the screen. Apart from that, great work.
- @Africa4795What are you most proud of, and what would you do differently next time?
I'm Proud of building a responsive Tip-Calculator
What challenges did you encounter, and how did you overcome them?few challenges with positioning, and JavaScript
What specific areas of your project would you like help with?Feedback is Welcome!
@SimonHicklingThis all appears to work very well, nice job! The layout is a bit squashed up in desktop view, but this is a preference thing more than a problem. The only thing I would recommend to improve it, is an event listener on the input fields, so that when an input is entered, the calculation functions automatically update. Apart from that, great work!
Marked as helpful - P@Y39WebDeveloper@SimonHickling
This looks mostly good in mobile view, but on a bigger screen ( > 1400px wide), the layout is way too stretched and does not fit the screen. The other problem is that the text does not update when you scroll. The way I addressed this was to update the innerHTML of the header and paragraph elements, from an array of objects in JS.
Another thing you could try, is to add some transitions in there for smoother movement when you scroll. Apart from that, it looks great and very accurate, particularly at 1400 wide.
