Skip to content
Submitted over 3 years ago

Officelite Coming Soon page / Sass, Mobile first

Tereza•605
@sirriah
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Officelite coming soon site
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

Hello,

First I need to say that this challenge was awsome! I think that it helped me to more understand the HTML form. I practised JavaScript, which is still on the poor level :).

Please leave me some feedback about Sass. I couldn't decide how to solve the two color variations of price list. First I used mixin and I called it twice - first with parameter background-color white, and second with background-color blue. But later I changed it and I set up the white column and for the blue column I used extend from the white column. 👋👩‍🦰

Community feedback

  • ApplePieGiraffe•30,545
    @ApplePieGiraffePosted over 3 years ago

    Hey, sirriah! 👋

    Good work on this challenge! 👍 Your solution looks good and responds well! 👏 I like the micro-interaction you added to the labels of the form of the sign-up page (I did that, too, when I completed this challenge)! 😆

    A few small things I'd like to suggest are,

    • Adding cursor: pointer to the buttons in the pricing cards and the submit button of the form on the sign-up page.
    • Adding overflow-x: hidden to the body to prevent a horizontal scroll bar from appearing along the bottom of the page in the desktop layout.
    • Currently, the buttons of the pricing card don't do anything. It would be nice if they took users to the sign-up page. 😉

    Keep coding (and happy coding, too)! 😁

    1
    Tereza•605
    @sirriahPosted over 3 years ago

    @ApplePieGiraffe Thank you for your comment and for your tips. I thought that I add the link to the buttons, but maybe I forgot to push the changes to github. :( I will check it again. Happy coding :)

    1
  • Grace•30,990
    @grace-snowPosted over 3 years ago

    Hi this looks good, well done.

    Main issue with this.is a lack of semantic html in some places. You have text content in spans only when it should probably be in paragraphs or lists. If you find yourself writing br at the end of ever line thats a definite sign you should be using a list.

    I hope that's a helpful pointer ☺

    1
    Tereza•605
    @sirriahPosted over 3 years ago

    @grace-snow Thank you for your comment. You are right. :) I think that I have some "semantic blindness" :).

    0
  • The Burrito Doggie•1,260
    @BurritoDoggiePosted over 3 years ago

    heyo sirrah!!

    Sweet Work!!!! First thing I want to say is... I really like the count down. It is super cool!!! And the email form. It is great. Having the words in the the input element come out when you type is another cool feature you added.

    Keep Coding!

                                         (@@)
                                      \__/
    1

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