All comments

• 

  Lucas 👾•104,400

  @correlucasSubmitted about 2 years ago

  👾 Hello, Frontend Mentor coding community. This is my solution to the Four Card Feature Section.

  😎 I had a lots of fun doing the challenge and doing some custom design improvements.

  This is a solution that I've finished before but I decided to update it, when I saw a solution of guy Yefry Sanchez where he applied an hover effect on the card where the icon flips while hovered, so I tried to apply something similar to mine inspired on what he did. Here's is his profile @y25sanchez . Nice solution bro!

  👻 I added some features 💀

  • 🎨 Text Gradient on main heading.
  • 🥃 Glassmorphism on card hover.
  • 🎨 Custom background.

  Feel free to leave any feedback.

  

  4 Card Feature Section (Vanilla CSS + Custom Design + Glassmorphism)

  13

  7215
  

  devnnga•20

  @devnngaPosted about 2 years ago

  @correlucas can you share your source code please? Been trying to understand how to make that layout. Thanks

  1

  This comment has received 1 replyShow
• 

  Roland Jae V. Patalita•20

  @Rjae07Submitted about 2 years ago

  I have 2 question with this challenge:

  1.) How can I insert cart logo in my add to cart div?, I tried using fontawesome but to no avail, it did not work out.

  2.) How can I make round corner in the left side only of the image?.

  Thank you!.

  

  Product preview card component - Solution

  4

  20
  

  devnnga•20

  @devnngaPosted about 2 years ago

  For the rounded corners, use border - right top and border - right bottom to target those specific areas.

  Marked as helpful

  0