All solutions

Any feedback appreciated!

There's a bug where generating a new advice slip while a typewriter animation is still ongoing causes the new message to write out twice as quickly. I believe it's because of multiple typewriter functions running asynchronously because of setTimeout(), but I don't know how to fix it without also forcing the user to wait until the typewriter animation fully completes. Any tips for how to resolve this issue would be greatly appreciated!

Any feedback appreciated!

This is the first non-Newbie-level challenge I've done; I think it turned out pretty good! Any feedback appreciated!

I wanted to do a slide in animation for the cards, but I found out that it tends to break elements that use z-indexing. Since my implementation for the two-layer cards uses a pseudo element with z-indexing, I wasn't able to figure out how to get it to work. If anyone has any solutions, I'd greatly appreciate hearing them.

Any feedback appreciated!

With this quick challenge I hadn't gotten to out of the way, I've completed all the (free) Newbie-level challenges. Onto the Junior-level challenges!

Any feedback appreciated!

Was trying to use more semantic HTML tags in this, and my solution only uses 1 <div> for a flexbox container, which I'm pretty happy with. I also played around with a nice fade-in animation on page load (which is why the thumbnail is empty on the right) and Ionicons for this.

Wondering what the ideal way to keep the dashboard illustration in place is; I had a margin-top that counteracted the downward shift, based on the added space from the error message.

Besides that though, I'd appreciate any feedback!

Any feedback appreciated!

Pretty proud of how this one turned out; any feedback appreciated!

(The screenshot isn't rendering with Poppins for whatever reason; it's actually there when loaded.)

Had a lot of fun learning how to do form validation and keyframe animations, and a lot less fun wrangling the grid :V Turns out they're way more finicky to properly set the sizes for non-equal grid rows / columns in a dynamic context if you're not the most familiar with them.

Is there a way to use minmax() with a fr as the minimum, and an explicit maximum value (such as an em)? It didn't appear that was the case from what I saw, and knowing how to do a similar effect would be very useful to know as I continue to do more complex frontend design.

Beyond that, I'd appreciate any other feedback!

Any feedback appreciated!

Was having trouble figuring out the best way to handle the share tooltip; my solution had to use 2 separate ones for the mobile and desktop layouts, and the popup on desktop goes off-screen on smaller sizes. I wanted to keep the arrow static while shifting the bubble to the side, how can one do that?

Beyond that though, I had fun with this project, and I'd appreciate any additional feedback!

Had a fun time with this challenge; any feedback on this would be appreciated!

As a sidenote, this solution uses a basic JavaScript function to render out the star vectors–I'm curious how one could expand it to support partial stars for decimal ratings, possibly even with a gray star background?

First time doing JavaScript, and I would appreciate any feedback, but especially for: a] How to do a wipe animation when opening / closing a tab; b] If there's a better way to orient the images (had to set the mobile-to-desktop breakpoint really high because the images would completely break otherwise :V)

First time trying out overlapping multiple box shadows together, I'm happy how it turned out, but I still am very inexperienced with them. Would appreciate any feedback!

Just going through all the early challenges – any feedback appreciated!

Aligned the icons with pseudo elements along with either absolute positioning or flexbox align-items + block display; curious to know if there are any preferred methods for image alignment for different situations.

First time doing a frontend project – any feedback would be greatly appreciated!