Skip to content
Submitted almost 3 years ago

Coffeeroasters-subscription-site with SCSS BOOTSTRAP JAVASCRIPT

Zybartas•480
@ZybartasRingys
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Coffeeroasters subscription site
  • HTML
  • CSS
  • JS
3intermediate

Design comparison

SolutionDesign

Solution retrospective

Hello, this was a really interesting and tough challenge to do it took a while to finish, this challenge was my first big project for which i used Bootstrap as a CSS framework and also a first project where i did mobile first development so it was really challenging at the beginning of project. This challenge helped me to learn a lot about bootstrap and responsive development , JS also was a big challenge since i have tried to make it on my own, still need to figure out some functionality.

Any feedback would be appreciated !

Community feedback

  • Harmanjot Singh•985
    @arkharman12Posted almost 3 years ago
    • Positioning of the hamburger icon needs an adjustment.
    • Mobile menu should automatically close if the screen width keeps increasing.
    • "Our Collection" section messes up at 1390px width.
    • "Our Commitment" section image keeps moving which makes the person's face hidden.
    • "Free Shipping" truck icon also seems squished.
    • Accordions don't open or close if I click on the icon itself.
    • Create my plan should only work if all of the criteria are selected.

    Otherwise, nice work!

    Marked as helpful
    0
  • Naveen Gumaste•10,480
    @NaveenGumastePosted almost 3 years ago

    Hay ! Good Job you made it look nearly perfect to the preview

    These below mentioned tricks will help you remove any Accessibility Issues

    -> Add Main tag after body like it should be your container

    -> For 1st heading or h1 tag, use header tag and then inside the header put your h1 or h2 etc

    -> But use header tag only once in main heading element.

    -> You have just used same id for multiple elements (class can be used multiple times bt.. id should be unique)

    Keep up the good work!

    Marked as helpful
    0
    Zybartas•480
    @ZybartasRingysPosted almost 3 years ago

    @Crazimonk Hey, thanks for comments, already fixed everything!

    0

Please log in to post a comment

Log in with GitHub

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