👀
[See More Interaction] with a Contextual Last Read Tag ✨🤌🏽
Key takeaways: 📝
- I used a CSS Grid trick, toggling grid-template-rows between 0fr and 1fr to animate to an auto height smoothly.
- The "last read" pill is a chat-style bubble with a custom (using clip-path)...
[See More Interaction] with a Contextual Last Read Tag ✨🤌🏽
Key takeaways: 📝
- I used a CSS Grid trick, toggling grid-template-rows between 0fr and 1fr to animate to an auto height smoothly.
- The "last read" pill is a chat-style bubble with a custom (using clip-path)...
[004] New Experiment: Pixel-dissolve image transition, made with GSAP in Nextjs ✨🤌🏽
👀
[003] New Experiment: Meet the team section, made with tailwind and framer-motion in Nextjs ✨🤌🏽
Inspo: https://attio.com/careers
One of out many other experiments. 👷🏾♂️
Animated card border ✨🤌🏾
This can be achieved in two ways: by manipulating the height and width, or by using transform scale(). The span tags will be positioned absolutely in all four corners. Using the transform scale() method is more performant, but for something like this, the difference is negligible.