Looking to hire developers?
@Shomy032
@ClariceR
Submitted
Hi everyone! Here's my solution :) I would really appreciate some feedback on the following points:
@Shomy032
Posted
Your card element (class = card ) , is not centered vertically on my screen , i am on my laptop with resolution 1600 x 900 px , you can wrap your .card and .attribution classes in one div and center it .
Anyway great work , and keep up coding :)
@MSorJinxi
Submitted
This is my first project and I would need a feedback because I don't even know what to ask. I'm learning how to code by myself from 2 months.
What mistakes did I made? What could I have done better? What should I be careful about in such design? How would you rate my code from 1 to 10? ;)
Thank you for your help and support :D
@Shomy032
Posted
1 . Your cards are not centered vertically on desktop view , solution : use flexbox or grid insted of float , that way you can do it easily , ( Floats work really well in small cases like when there's an element, such as a button, that you'd like to move to the right of a paragraph. But the real issue arises when you start using floats to lay out entire web pages. And the reason for that is: floats are not meant for layouts , instead use flexbox or grid)
2 . Maybe you can add property ' transition ' on your buttons , so when you hover them color change smoothly ( for example : transition : all 300ms linear ; ),
helpful links for research :
Anyway great work , if you have any more questions feel free to ask , and keep up coding :)
@miguelkarlos
Submitted
This is my first completed challenge, any feedback would be really great for my improvement.
@Shomy032
Posted
I am on my laptop , and your box is not centered , its at bottom of my page. Its because you set a min height of that element , and i can scroll page way to much .
maybe add overflow hidden to body and remove min height from .element class , and it should work.
Anyway great work , and keep up coding.
@Guarito
Submitted
I couldn't obtain fix slider control on bottom of avatars. I tried to add an container to images and the control on position absolute but the design is damaged. I hope in the future to have better skills to complete the challenge. I appreciate any advice, thanks.
@Shomy032
Posted
I think this should work
.container{
position : relative;
width : 500px ; // for example
height : 500px ; // for example
}
.container img{
width : 100% ;
object-fit : cover ;
}
.container button{
position : absolute ; // relative to container , this will remove it from flow
bottom : 0 ;
left 100px ;
transform: translateY(-50%); // this will push it down for half of their height
}
Anyway great work , and keep up coding :)
@olgak169
Submitted
I'm very pleased with the JS part of it, but CSS definitely needs some improvement. Leave a feedback, I will be happy to know your opinion!
UPD. updated version finally all works as it should.
@Shomy032
Posted
Very cool , i am looking forward to build it myself. What was the hardest part for you?
@haydee75
Submitted
Hi :) Good challenge with a lot of skills covered. Sad tho that the API kinda sucks Any feedback on the React part would be really appreciate :) Thank you!
@Shomy032
Posted
When i click "more" button scroll bar appear top left of screen , everything else works just fine. Good job :)
@thenutscout
Submitted
Even though I liked the backgrounds images for the given widths, I didn't liked how it turned out outside of those widths (I explained more in detail on the README in the repository). Can you give me any advice of how to make it more responsive for the users screen? Is it the size? Is it the positions? Is it the units I used?
Thank you for taking your time!
@Shomy032
Posted
You can make your black text little bit brighter , maybe set lower opacity or change color . Overall great work , i think its fully responsive , keep you coding :)
@femizi
Submitted
had problems putting an image behind the color in this task and also had problems on the mobile hamburger menu and gave up
@Shomy032
Posted
Great work dude , ill suggest you 2 things , fix your padding in footer (bottom of page) , and add transition to all your elements that have hoover state , for example 300ms , then it will work much smoother.
Happy coding :)
@tjfaccipieri
Submitted
What should I improve from responsivity and @media queries?
@Shomy032
Posted
I you want it to be perfect , you can add media queries for i-pad , go to firefox dev tools and press ctrl + shift + m and select i - pad , but its not that big off a deal.
Overall great work dude :)
@furhart
Submitted
Much closer than my first challenge solution. Feedback is appreciated.
@Shomy032
Posted
Good job mate , i have one suggestion for you to improve your project , and that is to add transition of 300-400 ms to your buttons , then the hover effect will be so much smoother.
Everything else is great , its completely mobile responsive , its work on i-pad too . Maybe add some animation when the page loads , if you want to practice css even further.
Overall great work , and keep up coding :)
@Shomy032
Submitted
I worked very hard to get this done , ill appreciate any feedback. Hope you like it , and happy coding to you all :)
@Shomy032
Posted
it works fine but only on screen wider the 1500px , challenge is on 1440 px , i guess its to late now (how use 1440 px screen anyways :) ), just demo it and you will see.
@Shomy032
Submitted
Probably its not best solution but it works :) on 1440 x 900 , 900 x 660 and mobile 375 width. I worked a lot to get this done , hope you like it.
@Shomy032
Posted
Oh I just realized that i forgot to positon back-groud-img op purple card on tablet(900 x 600) , and my border radius i smaller then it shoult be , and grid gap is also smaller . But i guess now is to late :)
