question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[website] Make the showcase component of hero on landing page scrollable

See original GitHub issue

The top right section of the landing page is cut off and cannot be scrolled, making it impossible to see some of the cool examples.

  • The issue is present in the latest release.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

The height is based on the screen height (calc(100vh - 120px)). Overflowing content is hidden.

Note that e.g. the “Use the sx prop to add these properties” example is not fully visible.

image

Expected Behavior 🤔

IMO the best way to handle this is by making the section scrollable.

Steps to Reproduce 🕹

Steps:

  1. Go to https://mui.com/

Context 🔦

I noticed that the “Use the sx prop to add these properties” example was cut off.

Your Environment 🌎

24" screen in landscape orientation 😄

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:10 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
ysstudio22commented, Oct 18, 2021

Hi @hbjORbj

I’m Yoshi. I’m interested in contributing if this issue hasn’t been assigned yet. I’ll wait until @LorenzHenk has replied to you. Thanks🙂

1reaction
hbjORbjcommented, Nov 1, 2021
Read more comments on GitHub >

github_iconTop Results From Across the Web

Landing Page Hero Shots: 18 Insightful Examples To Guide ...
Learn from the good, the bad, and the bogus landing page hero shots examples so you know exactly what to do to improve...
Read more >
20 inspiring hero image websites - Justinmind
20 examples of hero image website inspiration to boost your conversion rates and impress your users.
Read more >
Landing Page Design: How to Create Pages That Convert ...
A landing page can take many forms: A scrollable sales page that walks visitors through a specific use case for your product.
Read more >
Landing Page Animation 101: Examples, Tips, and Tools - Vev
We created our own landing page specifically to showcase the magic that can be made with Lottie animation in Vev.
Read more >
Homepage: hero section | Webflow University
Before adding any elements to the page, drag your assets — your image files — into the Asset panel: ... Let's create the...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found