Frontend Mentor | Web Frog's profile

@fidellimSubmitted over 3 years ago

Would love to ask for your feedback! Also, I would like to ask is there a better way for me to position the illustration?

Mobile First Project Tracking Intro Component using HTML, SCSS, and JS

1

Web Frog•1,840

@MasterDev333Posted over 3 years ago

Great work! fully responsive and close to design. Here're some suggestions.

It would be great if you add transitions to buttons. please add transition: all .3s ease-in-outfor example.
on mobile view, please remove min-width for hero image
and personally, I think it would be great if you put landing-page-container outside of header tag. Hope this helps. Happy coding ~ :)

1

Stelin•10

@StelinUwUSubmitted almost 4 years ago

❤

Intro component with grid, flex and js

3

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @Stelin. Everything is fully rsponsive and close to design. One suggstion, title should be h1 tag, not span. :) Happy coding~

1

Stuart Haw•20

@shdsgnSubmitted almost 4 years ago

This is my first time coding something by myself. If anyone could give me some feedback on I would greatly appreciate your help, good or bad :D. Thanks

Profile card component

2

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @Stuart Haw. It's a little tricky to draw background circles in this example. I suggest you use background-image or pseudo-elements. Here's my solution used pseudo elements. https://www.frontendmentor.io/solutions/profile-card-xRCu-QVRG Hope it helps. Happy coding~ :)

0

Luca•210

@DucknaroSubmitted almost 4 years ago

Hi guys, I really liked doing this other website, I'll keep practising because I've noticed I have been improving my skills by doing all of these challanges. I still have a hard time fixing problems with flex-box, width, what do you suggest doing? thanks

Social section Luca Tufo

1

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Well done @Luca! Some suggestions here.

It would be great if you make everything fully responsive.
Font is not loaded correctly
background images are missing https://css-tricks.com/snippets/css/complete-guide-grid/ https://css-tricks.com/snippets/css/a-guide-to-flexbox/ These are great materials for studying CSS Grid and flex. Hope it helps. Happy coding~ :)

0

Daniel•60

@DanielHolenSubmitted almost 4 years ago

I've tried to clean everything up (better class names, re-usable classes etc;) also adjusted the card size to better represent the original design.

Profile Card (v2)

2

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @Daniel. Your solution is spot on. I suggest you to use background-image or pseudo-elements to draw background circles rather than real doms. And if you'd like to make your class names more readable, please study BEM. Hope it helps. Happy coding~ :)

1

Denis•125

@DenisShkarinovSubmitted almost 4 years ago

I don't like a lot of background images in one block. Especially, do it responsive.

HTML, SCSS, BEM

1

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great solution @Denis. It would be better if you use pseudo-elements or background-image rather than real doms. Anyway, it was great. Happy coding~ :)

0

tediko•6,680

@tedikoSubmitted almost 4 years ago

Hello👋!

No specific questions but any additional feedback will be appreciated!

Thanks! 😁

Mobile first Fylo landing page using Sass, JavaScript

3

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @tediko. I love your animations, especially header link hover animation. It would be better if you use anchor tags for footer phonenumber and mail. You may use tel and mailto attributes for direct call and message. Hope it helps. Happy coding~ :)

1

Moreshwar Nabar•30

@moreshwarnabarSubmitted almost 4 years ago

Completed my first challenge. It was a bit difficult at times, but I am happy with the end result. Setting up the background was the most challenging part. It still doesn't respond perfectly at lower screen sizes. Also feel like my CSS is too long. Would love some feedback on how to style the background better!

HTML, CSS Flexbox

1

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work. Your solution is spot on. Needs some improvements while drawing background. To make background position responsive, you may use vw rather than px. so it should be background-position: top xvw left xvw, bottom xvw right xvw; Hope it helps. Happy coding~ :)

Marked as helpful

1

Sajjad Ali \•10

@Sajjad-alSubmitted almost 4 years ago

Please give me feedback It will help me a lot and tell me what I have done mistakes. pls it's my second-time solution

Mobile first Social proof section with css grid and flex-box

1

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @Sajjad-al! I have some suggestions.

Why did you set grid for text? I think it's useless.
Font size and spacing are slightly different
Background patterns are missing
I suggest you use background-image and background-repeat to draw rating stars. It's hard to draw 4.5 or 4.2 base on your solution. Hope it helps. Happy coding~ :)

0

Mayank-Behl•20

@Mayank-BehlSubmitted almost 4 years ago

Thank you for checking the solution. All improvements and suggestions are welcome.

Single price grid component (Mobile first approach)

2

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @Mayank-Behl. Everything is responsive and close to design. Your code is also semantic. I have no words to say. "Perfect!" Happy coding~ :)

1

__alv__•30

@alvi0407Submitted almost 4 years ago

Feel free to point out any mistakes and I am happy to receive suggestions. Thankyou.

Testimonials grid section coding challenge

1

Web Frog•1,840

@MasterDev333Posted almost 4 years ago

Great work @alvi0407. It would be better if you use Grid rather than flex. And when screen goes down 920px, style is broken. Please make it more responsive. Happy coding~ :)

0