Show HN: ReactScrollShadow – CSS shadow to indicate scrollable area

[zzarcon]

https://github.com/zzarcon/react-scroll-shadow

[simplify]

"Pure CSS" is a term that implies there is no JavaScript involved. I suggest rewording the readme so it doesn't confuse.

[egfx]

Why does everything as simple as this need to be a React project these days? It would be so much better if it was pure vanilla CSS or a Pen.

[zzarcon → egfx]

I guess it doesn't have to be a React component, you are right. But just by doing so you get a lot of things for free and makes it easier for people to start using it, like, you just install it, require it, and you are good to go... that was the motivation beyond using React for it

[solidr53]

Doesn't work all the time, you should use IntersectionObserver or ResizeObserver etc.

Edit: I'll rephrase my question, why does the Hacker News Frontpage include stories with zero comments and 1 point?

[brazzledazzle → solidr53]

I think we should aim to be more constructive on showHNs.

[zzarcon → solidr53]

Can you elaborate why we should use IntersectionObserver/ResizeObserver?

Currently there is no logic in place to do the calculation and detect if there is more available content or not, so I'm 100% sure if understand the issue

[teo4oro → solidr53]

Was thinking the same thing.

[monkeynotes]

Why not use some box-shadow so it looks like a shadow rather than a line?

[err4nt]

I've got a plugin[1] I use for something similar when it's a horizontal scrollable area. Scroll the boxes in the demo[2] to see the shadows appear/disappear when there is overflowed text on the left or right edge!

1: https://github.com/tomhodgins/jsincss-overflow

2: https://tomhodgins.github.io/jsincss-overflow/test/

[zzarcon → err4nt]

That's pretty neat! thanks for sharing

[danielrw7]

Both the "react-scroll-shadow" link on the left of the demo and the github cat link to https://github.com/zzarcon/react-circle

[zzarcon → danielrw7]

Oh sorry about, I copied that from a previous project I did, just published a fix for that. Thanks!

[erikpukinskis]

I don’t get it. Can someone explain?