@codesByJoseSubmitted 2 months ago
What challenges did you encounter, and how did you overcome them?
im still figuring out how to use imported fonts!
What specific areas of your project would you like help with?all feedbacks are welcomed
Emre Söylemez
@soymzeAll comments
- @soymzePosted 2 months ago
When you ctrl+click to style.md font links you are landing to google fonts, Click on -> Get font -> Get embedded code -> import -> copy the import and paste it to your css file.Below that import section there is an example usage, there should be font-family,font-weight,font-style etc. copy them and try a font-weight according to project you are coding.Happy coding :)
Marked as helpful0 - @EtSuraDevSubmitted 2 months ago@soymzePosted 2 months ago
Your solution looks same with the design.Congratulations:) Some tips about the functionality about the solution, when you hover on buttons, cursor should be pointer. After you clicked a button, its background is becoming white but when you click another one it is not changing its background back to orange and because of that we can click all of them and all of them are going to be white backgrounded... So the solution is to check if a previous button exists and is different from the currently clicked button. If so, reset the previous button’s background color and text color before updating the current button’s style.Happy coding :)
Marked as helpful0 - @rawan-salah137Submitted 2 months ago@soymzePosted 2 months ago
Great work, congrats! About the image filter, Set the container of the image to position: relative;. Use the ::before pseudo-element with position: absolute; to create the overlay. Set the background-color. Apply mix-blend-mode: multiply; to blend the overlay with the image. Ensure the z-index of the pseudo-element is higher than the image to appear on top.But make sure to use hsla with some transparecy so we can see the photo behind it.Happy coding:)
Marked as helpful0 - @Gayatri0109Submitted 2 months agoWhat are you most proud of, and what would you do differently next time?
I'm most proud about the thing that i know the concepts up to the mark and i'm easily able to understand and rectify the errors. The next time i do this task i will do it in a more simple and professional way.
What challenges did you encounter, and how did you overcome them?web development is nothing but accuracy.There should not be any errors even 0.1% is not acceptable achieving the accuracy is little difficult.By practicing ,i have overcome it.
@soymzePosted 2 months agoHey, your solution looks pretty same with the design.There are only 2 things that I saw as a problem.First one is positioning.Your card is not in the middle,It is in the way more right side of the viewport and I checked your css file.I think if you use percent values instead of pixels, the card is going to be more responsive.The other thing is when I previewed your solution, one of the buttons were out of the div.So maybe you can use flexbox for that.Cause I coded this design yesterday and had the same problem.The length of p elements are different and because of that alligning buttons is hard.Happy coding :)
Marked as helpful0 - @Kinsman13Submitted 2 months ago@soymzePosted 2 months ago
Hey, it is a nice start.But looks like there are some problems. You can use style.md file to match the colors with the design. Card's border-radius is a bit much than needed and buttons also need some border-radius.Lastly buttons must be in card div. Nice coding :)
0 - @fsahinbasSubmitted 2 months ago@soymzePosted 2 months ago
Well, I think user should be able to open multiple questions at the same time.But when he does that, the height of the card may not be enough for all expanded questions.I used max-height: max-content to overcome this problem.So if questions are expanding, card expands also.So you are being able to expand all questions. The other thing, you should be able to shrink the question by clicking the minus, but that functionality is not working. By the way expand animation(plus to minus) looks awesome, how did you do it?
0
