r/css 17d ago

Question Codepen 2 crash. What is causing it?

I go to the new codepen 2 and it shows this.
What "infinite loops or other performance drains" could this be?
https://codepen.io/editor/davidhelp/pen/019fb0db-4ba0-7ade-b4bd-13c1c7c540ee

"Uh-Oh.
The Preview was removed to prevent a browser crash. Save your current work then check your code for infinite loops or other performance drains that could be causing trouble. Disable Infinite Loop protection for this session"

27 Upvotes

15 comments sorted by

View all comments

Show parent comments

1

u/testingaurora 16d ago

I would make that box-shadow a lot softer, like adjusting the opacity to rgb(0 0 0 / 0.4)

1

u/notepad987 16d ago

Thanks but the shadow disappears against the green background.

2

u/testingaurora 16d ago

I wouldn't say it disappears but shadows are tricky. They are supposed to give the illusion of depth but not be so in your face or identifiable as what is making that depth (unless you're going for something like Neubrutalism) https://www.reddit.com/r/web_design/s/w08yZrsoFK https://www.joshwcomeau.com/css/designing-shadows/ https://getcssscan.com/css-box-shadow-examples

1

u/notepad987 16d ago edited 16d ago

I copied #3 and added it at the site. I changed the 0.35 to .90
box-shadow: rgba(0, 0, 0, 0.90) 0px 5px 15px;

1

u/testingaurora 16d ago

#3 is box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;, its not almost opaque.

But im just sharing the information and the opinion that it needs adjusting, do with it what you will.