Latest solutions
Responsive, Tailwind-CSS, React, Redux, CRUD system.
#accessibility#react#redux-toolkit#tailwind-cssSubmitted almost 2 years agoCSS Grid, React, components Responsive, react-routing
#react#react-router#sass/scss#animationSubmitted over 2 years ago
Latest comments
- @Hoda96@azick99
Well-done Hoda! I see you did a lot and I like your css code.
However, I got some advice to improve your code and user-experience.
- Do not use
width: 1160px;
it can look like well in your PC but user will have different screens that developer must consider. Try to find better alternative likewidth: 90vw;
. Bonus for user-experience make border of image avatar: instead of.user-profile{ height: 3.8rem; cursor: pointer; } .user-profile:hover{ border: 2px solid #f98001; border-radius: 50px; }
make.user-profile{ height: 3.8rem; cursor: pointer; border: 2px solid #fff; border-radius: 50px; }
thenhover: {border-color:#f98001}
. - In page you got a bug in functionality, when you open dropdown and at the same time modal popup close disappears under dropdown, and you can close the modal. To solve it make
z-index
of popup higher and dropdown lower. - Try to improve your JS code, there are too many repetitions, work with functions that handles most problems.
I hope it would be useful. Keep coding!!!
Marked as helpful - Do not use
- @fsp3012@azick99
Well-done Fakorede, I like you project!
Here is some advice:
1.In your case it's not hard to make cart count pass count to Navbar through props and create ternary count === 0 ? " " : <span className='cart-count'> {count}</span> and style with position: absolute.
2.To make setCount(count - 1) is not correct because it goes minus like -1, -2 and so on, in order to prevent it use condition in onClick like:
if (count > 0) { setCount(count - 1); }.3.Pay attention to the styles try to make them better as in challenge.
I hope it will be useful for you. Keep coding!!!
Marked as helpful - @murilonicemento@azick99
Hi Murilo! I like your project and I see you did a lot.
However, there are some problems:
- Wrong API request, your api request is
https://api.shrtco.de/v2/shorten?url=${longURL}/very/long/link.html
but it should be https://api.shrtco.de/v2/shorten?url=${longURL} . You see after requesting, it shows Error page because of /very/long/link.html. - Navigation dropdown. it would be better to make its position:absolute and z-index:10.
- I would work with color polytrees in Statistics section.
Keep coding!!!
Marked as helpful - Wrong API request, your api request is
- @Gaurang-gupta@azick99
Hi! I really like your project and I see you did a lot. If you don't mind I will give you some feedbacks to improve your web app.
-
Work with responsiveness in smaller screens images and words overlapping. So, it looks like not good, I think you got larger screen in your PC but in mine it has bad layouts.
-
Input Link my advice instead link.length === 0 , it's better to create new useState and make it status state like changing status when you click button setStatus('empty') if input empty and setStatus('typing') when you typing. To better understand you can checkout my solution I made it in Features Section.
-
When you refresh the page it does not save the changes like links that is posted. But in the challenge it is required, to make it save you can use local storage. Try to find more information about local storage better choice ask for it in chatGPT.
I hope it would be useful for you!
Marked as helpful -
- @enn-ko@azick99
Hi Ennko ! I like your job and I see you worked on this project a lot. However, I could not find your code repository it does not work, to say exact something.
But any way here some advice from my point of view:
- Tabs, I think you did tabs anchor so every time when click tabs it brings you home section. I would recommend make them buttons not anchors.
- Overflow, most titles styled overflow: auto. I do not think that it is good idea so please you overflow when needed instead work with layouts and font size.
- Responsiveness, there are some problems with smalls styling some components is not positioned correctly. toggle menu has bugs when you scroll down.
Any way keep going!
Marked as helpful - @natanaelrusli@azick99
Hi there! I really like it and see you did good job!! keep on, Here some advice to improve your code from my point of view.
I think It would be easier, when you make main functionality in app.tsx from there you can pass props easier to components.
handling buttons. First make button like container with children prop and create 5 buttons with different percent pass event. you can check my solution I did like I said it is easier.
I think there is problem with custom input and total. total must be tip amount value that you have overall but tip amount must divide total to number of people like this total / numPeople.
I hope you understand me if no you can check my solution although I'm not sure I did it perfectly but it was easy for me
Marked as helpful