P
@jasper2virtualSubmitted 3 months ago
P
Smaylen5
@Smailen5All comments
- P@jasper2virtualSubmitted 3 months ago
- P@nvallineSubmitted 6 months agoWhat are you most proud of, and what would you do differently next time?
This was a good challenge to focus on developing a contact form and some of the finer details that go into creating an accessible form. I am proud about completing the challenge based on the requirements provided.
What challenges did you encounter, and how did you overcome them?Creating the toast animations took a little longer than it should have, but I did learn about a new method to animate from display: none.
What specific areas of your project would you like help with?I would appreciate any tips/suggestions as to improve my code. Thanks!
P@Smailen5Posted 6 months agoGreat solution 😉
But I noticed that the validation only happens when the form is sent, if I correct the input field I don't have immediate feedback if it is correct
Marked as helpful0 - @wendyhamelSubmitted about 1 year ago
- @Mohamedkabba444Submitted 7 months ago
- @marcfrancissSubmitted 9 months ago
- P@DrakeHermitSubmitted 11 months agoWhat are you most proud of, and what would you do differently next time?
To be completely honest I am not that proud of finishing this challenge. I feel like there must be an easier way to get this to look the way that the design is set up. But I am happy that I managed to get it to look at least similar to the design.
What challenges did you encounter, and how did you overcome them?The main challenge was to get the desktop part of the design look the way it should. And to be honest I am not entirely proud of how I went about making it look the way it needed to be. I created a grid of 3 columns and 3 rows wide, and I just placed the cards the way they were supposed to be placed, and I finalized it by adding
What specific areas of your project would you like help with?transform: translateY()to the middle cards to move them to the center. It worked but I feel like there is an easier, or more efficient way.I just want someone to look at my CSS and tell me if my solution to this challenge is decent.
P@Smailen5Posted 11 months agoExcellent solution, congratulations your css code seems well written, you made use of variables and pseudo selectors such as ::before, I liked that for the media query you used rem and not px. Is there any part of your code that gives you doubts? and still a good code 😉
1 - @RosanrajSubmitted 11 months agoWhat are you most proud of, and what would you do differently next time?
not anything specific, need to improve my skill in responsive design to all screen size.
What challenges did you encounter, and how did you overcome them?-I faced some issues in adjusting the content page to right side of the image and then, I used float left to move right the page content.
What specific areas of your project would you like help with?-how to design a responsive design page for any screen size.
P@Smailen5Posted 11 months agoUnfortunately, the solution is not displayed correctly. This is because the index.html file is not located in the root directory, so GitHub Pages uses the readme file as the home page.
Marked as helpful0 - @kaoutar-ouadihSubmitted 11 months agoWhat are you most proud of, and what would you do differently next time?
I'm proud of completing this challenge! and learning new things from it.
What challenges did you encounter, and how did you overcome them?I struggled with making thing work together and making the code more dynamic.
What specific areas of your project would you like help with?Anything that can help me improve.
P@Smailen5Posted 11 months agoGreat solution, well done, very similar to the original design.
0 - @MariaMarusakovaSubmitted about 1 year agoP@Smailen5Posted 11 months ago
Great solution, the script works well.
Unfortunately, there are some display issues:
- The width of the white container is fixed, it would be better if it were not and adapted to the content, this would prevent content overflow.
- The tip buttons would be better if they were 6rem instead of 7rem, at 1440px they overlap otherwise.
- You could give the reset button a width of 100%, so it takes the correct size from the parent, it would also be better to remove the margin-left.
Hope I've been helpful :)
0 - @kaoutar-ouadihSubmitted 12 months agoWhat are you most proud of, and what would you do differently next time?
I'm proud of completing this challenge!
What challenges did you encounter, and how did you overcome them?I struggled with displaying elements dynamically with javaScript without affecting my css layout.
What specific areas of your project would you like help with?Anything that can help me improve.
P@Smailen5Posted 12 months agoGreat, excellent solution 😊, everything looks perfect both on mobile and desktop. My only suggestion, if you want to match the requested design completely, you could increase the height and width of the
containera bit.0 - @MaulanyaSubmitted 12 months agoP@Smailen5Posted 12 months ago
Great solution, the design is very similar for smartphones and wide desktops. Note that between tablets and desktops <1440px, the design breaks. You would also need to add color on hover.
1 - @aymanelaminSubmitted about 1 year agoP@Smailen5Posted 12 months ago
Great, the solution is similar to the request. You might have forgotten
background-size: cover;for the image, so you should center the image better as in the requested layout.0 - @ccccchrizSubmitted about 1 year agoP@Smailen5Posted 12 months ago
Great solution, the layout is very similar to what was requested. It seems that in desktop mode, you can add a bit more space above the logo to align it even better with the layout.
0 - @gitWater21Submitted about 1 year agoP@Smailen5Posted 12 months ago
Great solution, the layout is correct both on mobile and desktop. One thing you could do is increase the padding of the
.grid-itemclass to 2rem it seems to be a good measure.Marked as helpful1 - P@AntonvasilacheSubmitted about 1 year agoWhat are you most proud of, and what would you do differently next time?
- Creating a more complex layout using grid and flex containers, to minimize the use of fixed values.
- Figuring out and creating the layout relatively quick, vast majority of time was spent on the fine details.
- Creating the shadow just as in the design file, I still think color is not exactly right.
- Adjusting the spacing at the end, trying to match the design as best as possible.
- Placing the container on the page, not sure if using vh was the best option.
- Not confident with how to use the box-shadow properties.
P@Smailen5Posted about 1 year agoFantastic, the layout is practically identical. Perhaps you forgot to use the correct background color for the card container.
1 - @graiess073029Submitted almost 2 years agoWhat are you most proud of, and what would you do differently next time?
;)
What challenges did you encounter, and how did you overcome them?;)
What specific areas of your project would you like help with?;)
P@Smailen5Posted about 1 year agoGreat, you've respected the original layout almost perfectly!
Marked as helpful0 - @XarlizardSubmitted about 1 year agoWhat are you most proud of, and what would you do differently next time?
.
What challenges did you encounter, and how did you overcome them?Putting an between table rows... I struggled to figure that out for a bit lol
What specific areas of your project would you like help with?.
P@Smailen5Posted about 1 year agoGreat solution, both on desktop and mobile, the layout is similar to the original. I think the preview error on Frontend Mentor might be due to either the 120vh on the body or the fact that you've added multiple projects in the same repo.
0
