Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 1 year ago

Responsive Meet Landing Page

Paul Olynek•330
@ePaulo
A solution to the Meet landing page challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


What are you most proud of, and what would you do differently next time?

My plan was to add code in stages... 1) html-only, 2) general css, 3) mobile css, 4) tablet css, and 5) desktop css... helped reduce the "ripple effect" of making code changes that might adversely affect previous work.
In hindsight, it might have helped to considered (early rather than later) the need for inner "containers" to group some related UI design blocks.
Note that I did make a few subtle changes to the design, such as changing the font color for the button hover effect.

What challenges did you encounter, and how did you overcome them?

Find specific css code within "Mobile Design", "Tablet Design" and "Desktop Design" became more time consuming as the number of css lines increased... so I added comments to both html and css files to clearly indicate what the sections were for each of the mobile, tablet and desktop css styling.

What specific areas of your project would you like help with?

The one thing I could not figure out what how to control (remove?) the opacity on the second divider (that partially covered the last section) and, similarly, how to control the opacity of the button in the last section.

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Paul Olynek's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License