Product Landing Page - Succulant

Code Feedback
23

Hey @adzika, Thanks for your feedback.

Yea you are right. Haven’t noticed that spell. I have corrected it. You seems succulent lover too. :slight_smile:

I have made some changes to color palettes. Let me know how does it look to you. I am terrible at color selection. :stuck_out_tongue_closed_eyes:

Happy codding :wink:

Thanks,
Monika.

24

I like it much more now. :slight_smile: Also, you can try to make the button stand out more, as it kind of blends with the background now, maybe use something brighter?

Yes, I love flowers in general but I’m especially fond of aloe plants. :smiley:
And no, you’re not terrible, working out the right color palette is tough AF, especially on the computer. ^^

Here is a nice tool that might help you create a color palette: https://colorhunt.co/
And here is a great article about creating them: https://medium.freecodecamp.org/an-intro-to-color-theory-how-to-combine-colors-and-set-the-mood-of-your-designs-79bf5a45b3d

Happy coding! :slight_smile:

1 Like
25

Thanks for sharing links very helpful. Appreciate :slight_smile:

27

Really nice project. Some minor changes i would make:

I would change in html all tags having the class product-price from

<div class="col-lg-6 col-md-6 col-xs-12 col-sm-12 product-price">
  $15.00
</div>

to

<div class="col-lg-6 col-md-12 product-price">
  $15.00
</div>

in order to avoid this
price%20tag

Check also your add to card containers for incomplete class declaration

<div class="col-lg-6 col-md- col-xs-12 col-sm-12">
  <button class="btn add-to-cart" type="button">Add to cart</button>
</div>

col-md- ???
Otherwise, you did a good job. Happy coding

28

Hi @camperextraordinaire,

Yea actually I was looking some solutions but after using z-index :100 I neve think of going 1032 far. It’s great to know the magical z-index.

I have made all those changes now. Its looks fab :smile:

Its always great to be here with a different role as learner/adviser/endeavour/achiever and many more :relaxed:

Thanks for sharing.

Happy coding.

Cheers,
Monika.

29

Hey @sorinr

Wow good catch. :clap: I seriously didn’t noticed that. Thanks for your feedback. All been fixed now.

Much appreciate.

Happy codding.

Cheers,
Monika.

1 Like
30

@geekysmurf I finally make it 100% width and turned out awesome. Thanks for your suggestion. Happy coding. :slight_smile:
Monika.

32

@camperextraordinaire That after animation effect was big hassle. I tried an alternate to delay the text effect after animation but didn’t work out. I didn’t know that I can add multiple functions in animation parameter. Good to know :+1:

For the small device, I didn’t do much testing. But I’ll soon. If you don’t mind can you suggest me any Browser Compatibility Testing tools please. I am currently using codepen cross browser tool but constantly getting this message even though I am using Crome

image
image501×762 84.2 KB

Happy Coding.