@kelvtmoney
Submitted
just completed my responsive landing page, reviews are highly appreciated
Looking to hire developers?
@leoikeh99
@kelvtmoney
Submitted
just completed my responsive landing page, reviews are highly appreciated
@leoikeh99
Posted
Good solution, i have a couple of feedbacks:
padding
for the top and bottom and then set a width
of 100%
, i.e.: padding:1rem 0;
, this will help with overall responsivenessh3
there are couple of ways to make sure the img
and the plain text are properly vertically aligned, you could set the h3
to display: flex
and align-items: center
, this will help with the alignmentMarked as helpful
@nablanco
Submitted
The key challenge for this project was not converting markdown to JSX, but instead managing user's markdown documents. I tackled this by using React context to create a document context which managed all CRUD operations. I decided to use localStorage to store user's documents, as I wanted to keep this a pure frontend project. To convert markdown to JSX, I used a converter found on npm which worked very well (markdown-to-jsx). For the theme, I also use React context.
@leoikeh99
Posted
Very nice solution i have two reeomendations
overflow
to auto
instead of scroll
, this way the scrollbar only shows when it's actually needed.P.S: I really like the responsiveness.
Marked as helpful
@abbas-roholamin
Submitted
Do you find it easier to work with flexbox or grid to create a responsive layout?
@leoikeh99
Posted
Very good solution, my only feedback is:
Try to already make the component responsive before reaching 425px, as it is right now the image seems to reduce in width a little too much before you applied your responsive styles.
I would also advice, at a point when the screen is a small sizes to just set the components with to a certain percentage e.g. 90%, this will greatly improve responsiveness.
@CodeSofty
Submitted
Did I setup my flexbox containers/parents correctly? Some of this was a bit confusing until I took my time and slowly got the card component to how I wanted it to look like inside the container.
I used width: 50% on .card in my media query, is this the best method to resize the card for this type of project?
Chrome doesn't want to load my images, but Firefox does, why is that?
Was there anything I missed or got wrong or could improve on? Any other comments?
Thanks in advance.
@leoikeh99
Posted
A nice attempt, i have a couple of corrections:
You shouldn't set the card to a width of 50% rather to an actual value e.g. 600px
As for flexbox i think you used it well but the image and the right part (the content), should both take 50% of the card you can do this by easily setting the width of both the image and the right part (the content) to 50%
It will also be very helpful to set the content parts border-box to box-sizing i.e. box-sizing:border-box
in your css
lastly i'll leave a resource link to a youtube step by step solution to this problem: Product Card Component (Explained) - Frontend Mentor #1
Marked as helpful
@Eslam-EO
Submitted
@leoikeh99
Posted
Good solution, but i have a few corrections:
I think is just better to set the buttons width to 100%, since you have already set the width and padding for the container.
I think will also be better to set the width of the container to something like 90% when the screen reduces to a certain width, this will enable better responsiveness.
For the button, i don't think you should set the border-radius to 5%, rather is should be something like 8px.
Lastly you should reduce the line height of you <h2> a bit.
Marked as helpful
@Yazdun
Submitted
Hey everyone ! This is my first Guru challenge and It's a little bit different from the original design, For example I completely changed the desktop hero section and I created a sidebar for the cart, which was supposed to be a modal.
I also decided to use more reddish color as the primary color, The original orange color didn't look alive enough to me 😁
I'm open to feedbacks and let me know of your thoughts about this solution. Thanks in advance
@leoikeh99
Posted
Wooooowwwwwwww
@stevexero
Submitted
I am having the hardest time with getting the replies functionality to work. I'm using Redux Toolkit and have tried normalizing the state, but to no avail. I'm excited to look at the other solutions on here to see how they solved it!
@leoikeh99
Posted
Check out this solution: https://www.frontendmentor.io/solutions/product-feedback-app-nextjs-and-styled-components-BJgXK1hBB5
if you still cant figure it out then maybe reach out
@androgitai
Submitted
Hello everyone!
This is my solution for the invoice app challenge. I built it full stack and uses Firebase database and authentication. I used React, Redux and CSS modules to build it. It does not use any other dependencies because I wanted to build out the whole app myself.
Let me know what you think ;)
Andro
@leoikeh99
Posted
All i can says is this is really good, great job.
@agrajy10
Submitted
This is my 3rd project in ReactJS. I was able to complete every functionality of this web app but I think I could have done invoice form better. Open for in-depth feedback about the final result, my code and any other kind of feedback.
@leoikeh99
Posted
Good stuff
@leoikeh99
Posted
Great job
Marked as helpful
@abhu-A-J
Submitted
I had planned to learn React and Redux this week and I gave shortly a different twist to practise those skills . Kindly suggest you feedback to improve.
Skills I learned:
@leoikeh99
Posted
very nice im also learning react need to ask did you deploy this with heroku or netlify?
@ankitdevelops
Submitted
@leoikeh99
Posted
Nice work, i guess one thing i'll add is that you should now learn css grid or flex box or both, they will make this a lot easier.