Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Using SCS and practicing more in creating extensible sass plugins

Raymart Pamplonaβ€’ 16,090

@pikapikamart

Desktop design screenshot for the Clipboard landing page coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


This challenge gives a good chance for practicing creating more extensible classes, this challenge was composed different layouts but if you look for points, you can identify similar sections and use that to compose reusable components.

Also I had a bit of trouble in this challenge but it was fun^^

I used gulp for preprocessing and for post

If you see any issues, feel free to point it out^

Community feedback

P
ApplePieGiraffeβ€’ 30,545

@ApplePieGiraffe

Posted

Greetings, yet again, Raymart Pamplona! πŸ‘‹

Sorry, I've missed a couple of your last few challenges (I've just been a little busy lately)! πŸ˜… I just saw this one and came to say well done on this challenge! πŸ‘ Overall, everything looks pretty on point! πŸ™Œ

One thing I noticed, though, is that the image of the desktop computer in the "Keep Track Of Your Snippets" section gets very squeezed in the desktop layout as the width of the screen decreases. Making sure that that image retains its original aspect ratio (to prevent it from distorting when its size changes) would be a good idea. πŸ˜‰

And one other super tiny thingβ€”IDK why, but the Facebook icon in the footer of the page doesn't seem to change its fill color and keep it when hovered over (like the other icons next it). 🧐

That's all! πŸ˜„

As alwaysβ€”keep coding (and happy coding, too)! 😁

1

Raymart Pamplonaβ€’ 16,090

@pikapikamart

Posted

@ApplePieGiraffe Thank you for reviewing :>>. That's fine being busy and since I saw in the article that you are working here now in FEM, that is really something and congrats to you for it^^

Yes hahaha well I decided to fixed the height of the image, I don't why but it can be refactored though and for the footer icon, well hahaha the reason is that, the I declared the hover state on the path hahaah that is why when you hover on it, on the hollow part of the svg, it will scale but not colored, because it is declared in path.

Thank you for reviewing and will refactor that later once I finished my last FEM challenge ^^

1
P
ApplePieGiraffeβ€’ 30,545

@ApplePieGiraffe

Posted

@pikamart

No problem! πŸ˜€ Keep it up! πŸ‘

0

@thetechacks

Posted

Hey this looks so nice !! I just noticed a simple design issue(not much of an issue really) that the the img just bellow the "Keep Track of your Snippets" could be a bit re-positioned towards the left according to the design. It just came to my notice so I thought it might help haha :)

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord