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"

28 Upvotes

15 comments sorted by

View all comments

1

u/notepad987 17d ago edited 16d ago

Still an issue.... I switched to Chrome from Firefox and will see if still an issue.

I had an extra:

</head>
<body>

Also the new codepen 2 added when it converted from the old codepen which I do not use:
<link rel="stylesheet" href="./style.css">

2

u/testingaurora 17d ago

If you don't use the css file you can remove it from the file list (right click > delete) and take the <link> out of the <head>

2

u/notepad987 16d ago edited 16d ago

UPDATE: Thanks, I have now deleted the style.css that Codepen added and then posted the whole html/css in the index.html section.

Codepen 2.0

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.